ulivargas/classroomio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: lint codebase and run precommit hook

Browse Source
This commit is contained in:
Rotimi Best
2025-12-25 09:01:51 +00:00
parent 334c67f22a
commit b31ccf3037
214 changed files with 6191 additions and 2880 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/src/custom/domain-input/index.ts
-1
View File
@@ -2,4 +2,3 @@ import DomainInput from './domain-input.svelte';
export { DomainInput };
export { DomainInput as default };
packages/ui/src/custom/icon-button/icon-button.svelte
+1 -7
View File
@@ -8,12 +8,7 @@
tooltipSide?: 'top' | 'bottom' | 'left' | 'right';
}
let {
tooltip,
tooltipSide = 'top',
children,
...buttonProps
}: Props = $props();
let { tooltip, tooltipSide = 'top', children, ...buttonProps }: Props = $props();
</script>
{#if tooltip}
@@ -34,4 +29,3 @@
{@render children?.()}
</Button>
{/if}
packages/ui/src/custom/icon-button/index.ts
-1
View File
@@ -2,4 +2,3 @@ import IconButton from './icon-button.svelte';
export { IconButton };
export { IconButton as default };
packages/ui/src/custom/image-cropper/utils.ts
+51 -55
View File
@@ -1,32 +1,32 @@
import type { CropArea } from 'svelte-easy-crop';
export const getFileFromUrl = async (url: string, fileName = 'cropped.png'): Promise<File> => {
// Fetch the file data from the URL
const response = await fetch(url);
// Fetch the file data from the URL
const response = await fetch(url);
if (!response.ok) {
throw new Error(`Failed to fetch resource: ${response.status} ${response.statusText}`);
}
if (!response.ok) {
throw new Error(`Failed to fetch resource: ${response.status} ${response.statusText}`);
}
// Convert the response into a Blob
const blob = await response.blob();
// Convert the response into a Blob
const blob = await response.blob();
// Create and return a File. You can set a custom type if needed.
return new File([blob], fileName, { type: blob.type });
// Create and return a File. You can set a custom type if needed.
return new File([blob], fileName, { type: blob.type });
};
const createImage = (url: string): Promise<HTMLImageElement> => {
return new Promise<HTMLImageElement>((resolve, reject) => {
const image = new Image();
image.addEventListener('load', () => resolve(image));
image.addEventListener('error', (error) => reject(error));
image.setAttribute('crossOrigin', 'anonymous'); // needed to avoid cross-origin issues on CodeSandbox
image.src = url;
});
return new Promise<HTMLImageElement>((resolve, reject) => {
const image = new Image();
image.addEventListener('load', () => resolve(image));
image.addEventListener('error', (error) => reject(error));
image.setAttribute('crossOrigin', 'anonymous'); // needed to avoid cross-origin issues on CodeSandbox
image.src = url;
});
};
const getRadianAngle = (degreeValue: number) => {
return (degreeValue * Math.PI) / 180;
return (degreeValue * Math.PI) / 180;
};
/** Gets the cropped image from the src using the cropped area
@@ -36,50 +36,46 @@ const getRadianAngle = (degreeValue: number) => {
* @param rotation
* @returns
*/
export const getCroppedImg = async (
imageSrc: string,
pixelCrop: CropArea,
rotation = 0
): Promise<string> => {
const image = await createImage(imageSrc);
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
export const getCroppedImg = async (imageSrc: string, pixelCrop: CropArea, rotation = 0): Promise<string> => {
const image = await createImage(imageSrc);
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
if (!ctx) {
throw new Error('Error getting 2d rendering context');
}
if (!ctx) {
throw new Error('Error getting 2d rendering context');
}
const maxSize = Math.max(image.width, image.height);
const safeArea = 2 * ((maxSize / 2) * Math.sqrt(2));
const maxSize = Math.max(image.width, image.height);
const safeArea = 2 * ((maxSize / 2) * Math.sqrt(2));
// set each dimensions to double largest dimension to allow for a safe area for the
// image to rotate in without being clipped by canvas context
canvas.width = safeArea;
canvas.height = safeArea;
// set each dimensions to double largest dimension to allow for a safe area for the
// image to rotate in without being clipped by canvas context
canvas.width = safeArea;
canvas.height = safeArea;
// translate canvas context to a central location on image to allow rotating around the center.
ctx.translate(safeArea / 2, safeArea / 2);
ctx.rotate(getRadianAngle(rotation));
ctx.translate(-safeArea / 2, -safeArea / 2);
// translate canvas context to a central location on image to allow rotating around the center.
ctx.translate(safeArea / 2, safeArea / 2);
ctx.rotate(getRadianAngle(rotation));
ctx.translate(-safeArea / 2, -safeArea / 2);
// draw rotated image and store data.
ctx.drawImage(image, safeArea / 2 - image.width * 0.5, safeArea / 2 - image.height * 0.5);
const data = ctx.getImageData(0, 0, safeArea, safeArea);
// draw rotated image and store data.
ctx.drawImage(image, safeArea / 2 - image.width * 0.5, safeArea / 2 - image.height * 0.5);
const data = ctx.getImageData(0, 0, safeArea, safeArea);
// set canvas width to final desired crop size - this will clear existing context
canvas.width = pixelCrop.width;
canvas.height = pixelCrop.height;
// set canvas width to final desired crop size - this will clear existing context
canvas.width = pixelCrop.width;
canvas.height = pixelCrop.height;
// paste generated rotate image with correct offsets for x,y crop values.
ctx.putImageData(
data,
Math.round(0 - safeArea / 2 + image.width * 0.5 - pixelCrop.x),
Math.round(0 - safeArea / 2 + image.height * 0.5 - pixelCrop.y)
);
// paste generated rotate image with correct offsets for x,y crop values.
ctx.putImageData(
data,
Math.round(0 - safeArea / 2 + image.width * 0.5 - pixelCrop.x),
Math.round(0 - safeArea / 2 + image.height * 0.5 - pixelCrop.y)
);
return new Promise((resolve) => {
canvas.toBlob((file) => {
resolve(URL.createObjectURL(file!));
}, 'image/png');
});
return new Promise((resolve) => {
canvas.toBlob((file) => {
resolve(URL.createObjectURL(file!));
}, 'image/png');
});
};
packages/ui/src/custom/input-field/index.ts
-1
View File
@@ -2,4 +2,3 @@ import InputField from './input-field.svelte';
export { InputField };
export { InputField as default };
packages/ui/src/custom/password/index.ts
-1
View File
@@ -2,4 +2,3 @@ import Password from './password.svelte';
export { Password };
export { Password as default };
packages/ui/src/custom/password/password.svelte
+1 -2
View File
@@ -50,7 +50,7 @@
bind:value
{disabled}
aria-invalid={ariaInvalid}
autocomplete={autocomplete}
{autocomplete}
{...restProps}
/>
<InputGroup.Addon align="inline-end">
@@ -77,4 +77,3 @@
</Tooltip.Provider>
</InputGroup.Addon>
</InputGroup.Root>
packages/ui/src/custom/search/index.ts
-1
View File
@@ -2,4 +2,3 @@ import Search from './search.svelte';
export { Search };
export { Search as default };
packages/ui/src/custom/underline-tabs/index.ts
+9 -9
View File
@@ -4,13 +4,13 @@ import List from './underline-tabs-list.svelte';
import Trigger from './underline-tabs-trigger.svelte';
export {
Root,
Content,
List,
Trigger,
//
Root as UnderlineTabs,
Content as UnderlineTabsContent,
List as UnderlineTabsList,
Trigger as UnderlineTabsTrigger
Root,
Content,
List,
Trigger,
//
Root as UnderlineTabs,
Content as UnderlineTabsContent,
List as UnderlineTabsList,
Trigger as UnderlineTabsTrigger
};
packages/ui/src/custom/underline-tabs/underline-tabs-utils.svelte.ts
+53 -53
View File
@@ -4,85 +4,85 @@ import type { Tabs as TabsPrimitive } from 'bits-ui';
import { crossfade } from 'svelte/transition';
export const [send, receive] = crossfade({
duration: (d) => Math.sqrt(d * 200)
duration: (d) => Math.sqrt(d * 200)
});
type UnderlineTabsRootProps = WritableBoxedValues<{
value: string;
value: string;
}> &
ReadableBoxedValues<{
id: string;
}>;
ReadableBoxedValues<{
id: string;
}>;
class UnderlineTabsRootState {
hoveredTab = $state<string | null>(null);
isHovered = $state(false);
constructor(readonly opts: UnderlineTabsRootProps) {
this.hoveredTab = this.opts.value.current;
}
hoveredTab = $state<string | null>(null);
isHovered = $state(false);
constructor(readonly opts: UnderlineTabsRootProps) {
this.hoveredTab = this.opts.value.current;
}
}
type UnderlineTabsTriggerProps = ReadableBoxedValues<{
value: string;
onmouseenter: TabsPrimitive.TriggerProps['onmouseenter'];
onmouseleave: TabsPrimitive.TriggerProps['onmouseleave'];
onfocus: TabsPrimitive.TriggerProps['onfocus'];
onblur: TabsPrimitive.TriggerProps['onblur'];
value: string;
onmouseenter: TabsPrimitive.TriggerProps['onmouseenter'];
onmouseleave: TabsPrimitive.TriggerProps['onmouseleave'];
onfocus: TabsPrimitive.TriggerProps['onfocus'];
onblur: TabsPrimitive.TriggerProps['onblur'];
}>;
class UnderlineTabsTriggerState {
constructor(
readonly opts: UnderlineTabsTriggerProps,
readonly rootState: UnderlineTabsRootState
) {}
constructor(
readonly opts: UnderlineTabsTriggerProps,
readonly rootState: UnderlineTabsRootState
) {}
handleFocus() {
this.rootState.isHovered = true;
this.rootState.hoveredTab = this.opts.value.current;
}
handleFocus() {
this.rootState.isHovered = true;
this.rootState.hoveredTab = this.opts.value.current;
}
handleBlur() {
if (this.rootState.hoveredTab === this.opts.value.current) {
this.rootState.isHovered = false;
}
}
handleBlur() {
if (this.rootState.hoveredTab === this.opts.value.current) {
this.rootState.isHovered = false;
}
}
onmouseenter(e: Parameters<NonNullable<TabsPrimitive.TriggerProps['onmouseenter']>>[0]) {
this.handleFocus();
this.opts.onmouseenter.current?.(e);
}
onmouseenter(e: Parameters<NonNullable<TabsPrimitive.TriggerProps['onmouseenter']>>[0]) {
this.handleFocus();
this.opts.onmouseenter.current?.(e);
}
onmouseleave(e: Parameters<NonNullable<TabsPrimitive.TriggerProps['onmouseleave']>>[0]) {
this.handleBlur();
this.opts.onmouseleave.current?.(e);
}
onmouseleave(e: Parameters<NonNullable<TabsPrimitive.TriggerProps['onmouseleave']>>[0]) {
this.handleBlur();
this.opts.onmouseleave.current?.(e);
}
onfocus(e: Parameters<NonNullable<TabsPrimitive.TriggerProps['onfocus']>>[0]) {
this.handleFocus();
this.opts.onfocus.current?.(e);
}
onfocus(e: Parameters<NonNullable<TabsPrimitive.TriggerProps['onfocus']>>[0]) {
this.handleFocus();
this.opts.onfocus.current?.(e);
}
onblur(e: Parameters<NonNullable<TabsPrimitive.TriggerProps['onblur']>>[0]) {
this.handleBlur();
onblur(e: Parameters<NonNullable<TabsPrimitive.TriggerProps['onblur']>>[0]) {
this.handleBlur();
this.opts.onblur.current?.(e);
}
this.opts.onblur.current?.(e);
}
props = $derived.by(() => ({
value: this.opts.value.current,
onmouseenter: this.onmouseenter.bind(this),
onmouseleave: this.onmouseleave.bind(this),
onfocus: this.onfocus.bind(this),
onblur: this.onblur.bind(this)
}));
props = $derived.by(() => ({
value: this.opts.value.current,
onmouseenter: this.onmouseenter.bind(this),
onmouseleave: this.onmouseleave.bind(this),
onfocus: this.onfocus.bind(this),
onblur: this.onblur.bind(this)
}));
}
const ctx = new Context<UnderlineTabsRootState>('underline-tabs-root-ctx');
export function useUnderlineTabs(opts: UnderlineTabsRootProps) {
return ctx.set(new UnderlineTabsRootState(opts));
return ctx.set(new UnderlineTabsRootState(opts));
}
export function useUnderlineTabsTrigger(opts: UnderlineTabsTriggerProps) {
return new UnderlineTabsTriggerState(opts, ctx.get());
return new UnderlineTabsTriggerState(opts, ctx.get());
}