@sqlrooms/ui 0.29.0-rc.7 → 0.29.0-rc.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE.md +2 -1
- package/dist/components/switch.d.ts +5 -1
- package/dist/components/switch.d.ts.map +1 -1
- package/dist/components/switch.js +7 -2
- package/dist/components/switch.js.map +1 -1
- package/dist/components/textarea.d.ts.map +1 -1
- package/dist/components/textarea.js +2 -2
- package/dist/components/textarea.js.map +1 -1
- package/dist/components/theme-switch.d.ts.map +1 -1
- package/dist/components/theme-switch.js +3 -3
- package/dist/components/theme-switch.js.map +1 -1
- package/dist/components/tree.js +3 -3
- package/dist/components/tree.js.map +1 -1
- package/package.json +2 -2
package/LICENSE.md
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
MIT License
|
|
2
2
|
|
|
3
|
-
Copyright
|
|
3
|
+
Copyright 2024-2026 SQLRooms Contributors
|
|
4
|
+
Copyright Vis.gl contributors
|
|
4
5
|
|
|
5
6
|
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
6
7
|
|
|
@@ -1,5 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import * as SwitchPrimitives from '@radix-ui/react-switch';
|
|
3
|
-
declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & React.RefAttributes<HTMLButtonElement>, "ref"> &
|
|
3
|
+
declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
|
|
4
|
+
children?: React.ReactNode;
|
|
5
|
+
} & React.RefAttributes<HTMLButtonElement>> & {
|
|
6
|
+
Thumb: React.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchThumbProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
|
|
7
|
+
};
|
|
4
8
|
export { Switch };
|
|
5
9
|
//# sourceMappingURL=switch.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/components/switch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,gBAAgB,MAAM,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/components/switch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,gBAAgB,MAAM,wBAAwB,CAAC;AAsC3D,QAAA,MAAM,MAAM;eAhBG,KAAK,CAAC,SAAS;;;CAkB5B,CAAC;AAEH,OAAO,EAAC,MAAM,EAAC,CAAC"}
|
|
@@ -3,7 +3,12 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
import * as SwitchPrimitives from '@radix-ui/react-switch';
|
|
5
5
|
import { cn } from '../lib/utils';
|
|
6
|
-
const
|
|
7
|
-
|
|
6
|
+
const SwitchThumb = React.forwardRef(({ className, ...props }, ref) => (_jsx(SwitchPrimitives.Thumb, { className: cn('bg-background pointer-events-none block h-4 w-4 rounded-full shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0', className), ...props, ref: ref })));
|
|
7
|
+
SwitchThumb.displayName = SwitchPrimitives.Thumb.displayName;
|
|
8
|
+
const SwitchRoot = React.forwardRef(({ className, children, ...props }, ref) => (_jsx(SwitchPrimitives.Root, { className: cn('focus-visible:ring-ring focus-visible:ring-offset-background data-[state=checked]:bg-primary data-[state=unchecked]:bg-input peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50', className), ...props, ref: ref, children: children ?? _jsx(SwitchThumb, {}) })));
|
|
9
|
+
SwitchRoot.displayName = SwitchPrimitives.Root.displayName;
|
|
10
|
+
const Switch = Object.assign(SwitchRoot, {
|
|
11
|
+
Thumb: SwitchThumb,
|
|
12
|
+
});
|
|
8
13
|
export { Switch };
|
|
9
14
|
//# sourceMappingURL=switch.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../src/components/switch.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,gBAAgB,MAAM,wBAAwB,CAAC;AAE3D,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAEhC,MAAM,
|
|
1
|
+
{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../src/components/switch.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,gBAAgB,MAAM,wBAAwB,CAAC;AAE3D,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAEhC,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAGlC,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,GAAG,EAAE,EAAE,CAAC,CAChC,KAAC,gBAAgB,CAAC,KAAK,IACrB,SAAS,EAAE,EAAE,CACX,4KAA4K,EAC5K,SAAS,CACV,KACG,KAAK,EACT,GAAG,EAAE,GAAG,GACR,CACH,CAAC,CAAC;AACH,WAAW,CAAC,WAAW,GAAG,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC;AAE7D,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAKjC,CAAC,EAAC,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAC,EAAE,GAAG,EAAE,EAAE,CAAC,CAC1C,KAAC,gBAAgB,CAAC,IAAI,IACpB,SAAS,EAAE,EAAE,CACX,+XAA+X,EAC/X,SAAS,CACV,KACG,KAAK,EACT,GAAG,EAAE,GAAG,YAEP,QAAQ,IAAI,KAAC,WAAW,KAAG,GACN,CACzB,CAAC,CAAC;AACH,UAAU,CAAC,WAAW,GAAG,gBAAgB,CAAC,IAAI,CAAC,WAAW,CAAC;AAE3D,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,UAAU,EAAE;IACvC,KAAK,EAAE,WAAW;CACnB,CAAC,CAAC;AAEH,OAAO,EAAC,MAAM,EAAC,CAAC","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport * as SwitchPrimitives from '@radix-ui/react-switch';\n\nimport {cn} from '../lib/utils';\n\nconst SwitchThumb = React.forwardRef<\n React.ComponentRef<typeof SwitchPrimitives.Thumb>,\n React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Thumb>\n>(({className, ...props}, ref) => (\n <SwitchPrimitives.Thumb\n className={cn(\n 'bg-background pointer-events-none block h-4 w-4 rounded-full shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0',\n className,\n )}\n {...props}\n ref={ref}\n />\n));\nSwitchThumb.displayName = SwitchPrimitives.Thumb.displayName;\n\nconst SwitchRoot = React.forwardRef<\n React.ComponentRef<typeof SwitchPrimitives.Root>,\n React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root> & {\n children?: React.ReactNode;\n }\n>(({className, children, ...props}, ref) => (\n <SwitchPrimitives.Root\n className={cn(\n 'focus-visible:ring-ring focus-visible:ring-offset-background data-[state=checked]:bg-primary data-[state=unchecked]:bg-input peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50',\n className,\n )}\n {...props}\n ref={ref}\n >\n {children ?? <SwitchThumb />}\n </SwitchPrimitives.Root>\n));\nSwitchRoot.displayName = SwitchPrimitives.Root.displayName;\n\nconst Switch = Object.assign(SwitchRoot, {\n Thumb: SwitchThumb,\n});\n\nexport {Switch};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../src/components/textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,KAAK,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,GAAG;IACtD,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,QAAA,MAAM,QAAQ,
|
|
1
|
+
{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../src/components/textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,KAAK,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,GAAG;IACtD,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,QAAA,MAAM,QAAQ,wGAqEb,CAAC;AAGF,OAAO,EAAC,QAAQ,EAAC,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import { cn } from '../lib/utils';
|
|
4
|
-
const Textarea = React.forwardRef(({ className, autoResize = false, onInput, value, defaultValue, ...props }, ref) => {
|
|
4
|
+
const Textarea = React.forwardRef(({ className, autoResize = false, onInput, value, defaultValue, rows, ...props }, ref) => {
|
|
5
5
|
const localRef = React.useRef(null);
|
|
6
6
|
React.useImperativeHandle(ref, () => localRef.current);
|
|
7
7
|
const [hasOverflow, setHasOverflow] = React.useState(false);
|
|
@@ -36,7 +36,7 @@ const Textarea = React.forwardRef(({ className, autoResize = false, onInput, val
|
|
|
36
36
|
? hasOverflow
|
|
37
37
|
? 'overflow-y-auto'
|
|
38
38
|
: 'overflow-y-hidden'
|
|
39
|
-
: undefined, className), ref: localRef, onInput: handleInput, value: value, defaultValue: defaultValue, ...props }));
|
|
39
|
+
: undefined, className), rows: rows ?? (autoResize ? 1 : undefined), ref: localRef, onInput: handleInput, value: value, defaultValue: defaultValue, ...props }));
|
|
40
40
|
});
|
|
41
41
|
Textarea.displayName = 'Textarea';
|
|
42
42
|
export { Textarea };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.js","sourceRoot":"","sources":["../../src/components/textarea.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAMhC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAC/B,CACE,
|
|
1
|
+
{"version":3,"file":"textarea.js","sourceRoot":"","sources":["../../src/components/textarea.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAMhC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAC/B,CACE,EACE,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,OAAO,EACP,KAAK,EACL,YAAY,EACZ,IAAI,EACJ,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAsB,IAAI,CAAC,CAAC;IAEzD,KAAK,CAAC,mBAAmB,CACvB,GAAG,EACH,GAAG,EAAE,CAAC,QAAQ,CAAC,OAA8B,CAC9C,CAAC;IAEF,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE5D,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAChD,MAAM,EAAE,GAAG,QAAQ,CAAC,OAAO,CAAC;QAC5B,IAAI,CAAC,EAAE,IAAI,CAAC,UAAU;YAAE,OAAO;QAC/B,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;QACzB,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,EAAE,CAAC,YAAY,IAAI,CAAC;QAEzC,qDAAqD;QACrD,MAAM,aAAa,GAAG,MAAM,CAAC,gBAAgB,CAAC,EAAE,CAAC,CAAC;QAClD,MAAM,SAAS,GAAG,aAAa,CAAC,SAAS,CAAC;QAC1C,IAAI,SAAS,IAAI,SAAS,KAAK,MAAM,EAAE,CAAC;YACtC,MAAM,cAAc,GAAG,UAAU,CAAC,SAAS,CAAC,CAAC;YAC7C,cAAc,CAAC,EAAE,CAAC,YAAY,GAAG,cAAc,CAAC,CAAC;QACnD,CAAC;aAAM,CAAC;YACN,cAAc,CAAC,KAAK,CAAC,CAAC;QACxB,CAAC;IACH,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,6DAA6D;QAC7D,kBAAkB,EAAE,CAAC;IACvB,CAAC,EAAE,CAAC,kBAAkB,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;IAE9C,MAAM,WAAW,GAAG,CAAC,CAAuC,EAAE,EAAE;QAC9D,IAAI,UAAU;YAAE,kBAAkB,EAAE,CAAC;QACrC,IAAI,OAAO;YAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IAC1B,CAAC,CAAC;IAEF,OAAO,CACL,mBACE,SAAS,EAAE,EAAE,CACX,6QAA6Q,EAC7Q,UAAU;YACR,CAAC,CAAC,WAAW;gBACX,CAAC,CAAC,iBAAiB;gBACnB,CAAC,CAAC,mBAAmB;YACvB,CAAC,CAAC,SAAS,EACb,SAAS,CACV,EACD,IAAI,EAAE,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,EAC1C,GAAG,EAAE,QAAQ,EACb,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,KACtB,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AACF,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAC;AAElC,OAAO,EAAC,QAAQ,EAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport {cn} from '../lib/utils';\n\ntype TextareaProps = React.ComponentProps<'textarea'> & {\n autoResize?: boolean;\n};\n\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n (\n {\n className,\n autoResize = false,\n onInput,\n value,\n defaultValue,\n rows,\n ...props\n },\n ref,\n ) => {\n const localRef = React.useRef<HTMLTextAreaElement>(null);\n\n React.useImperativeHandle(\n ref,\n () => localRef.current as HTMLTextAreaElement,\n );\n\n const [hasOverflow, setHasOverflow] = React.useState(false);\n\n const resizeToFitContent = React.useCallback(() => {\n const el = localRef.current;\n if (!el || !autoResize) return;\n el.style.height = 'auto';\n el.style.height = `${el.scrollHeight}px`;\n\n // Check if content exceeds the max-height constraint\n const computedStyle = window.getComputedStyle(el);\n const maxHeight = computedStyle.maxHeight;\n if (maxHeight && maxHeight !== 'none') {\n const maxHeightValue = parseFloat(maxHeight);\n setHasOverflow(el.scrollHeight > maxHeightValue);\n } else {\n setHasOverflow(false);\n }\n }, [autoResize]);\n\n React.useEffect(() => {\n // Trigger on mount and whenever the controlled value changes\n resizeToFitContent();\n }, [resizeToFitContent, value, defaultValue]);\n\n const handleInput = (e: React.FormEvent<HTMLTextAreaElement>) => {\n if (autoResize) resizeToFitContent();\n if (onInput) onInput(e);\n };\n\n return (\n <textarea\n className={cn(\n 'border-input placeholder:text-muted-foreground focus-visible:ring-ring flex min-h-[60px] w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-sm focus-visible:ring-1 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',\n autoResize\n ? hasOverflow\n ? 'overflow-y-auto'\n : 'overflow-y-hidden'\n : undefined,\n className,\n )}\n rows={rows ?? (autoResize ? 1 : undefined)}\n ref={localRef}\n onInput={handleInput}\n value={value}\n defaultValue={defaultValue}\n {...props}\n />\n );\n },\n);\nTextarea.displayName = 'Textarea';\n\nexport {Textarea};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme-switch.d.ts","sourceRoot":"","sources":["../../src/components/theme-switch.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"theme-switch.d.ts","sourceRoot":"","sources":["../../src/components/theme-switch.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAKzB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC;IAC3B,+DAA+D;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAiBA,CAAC"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import * as SwitchPrimitives from '@radix-ui/react-switch';
|
|
4
3
|
import { MoonIcon, SunIcon } from 'lucide-react';
|
|
5
4
|
import { cn } from '../lib/utils';
|
|
6
5
|
import { useTheme } from '../theme/theme-provider';
|
|
6
|
+
import { Switch } from './switch';
|
|
7
7
|
/**
|
|
8
8
|
* A theme toggle switch component that allows users to switch between light and dark themes.
|
|
9
9
|
*
|
|
@@ -39,8 +39,8 @@ import { useTheme } from '../theme/theme-provider';
|
|
|
39
39
|
*/
|
|
40
40
|
export const ThemeSwitch = ({ className }) => {
|
|
41
41
|
const { theme, setTheme } = useTheme();
|
|
42
|
-
return (_jsx(
|
|
42
|
+
return (_jsx(Switch, { className: cn('data-[state=checked]:bg-primary/20', className), checked: theme === 'dark', onCheckedChange: (checked) => {
|
|
43
43
|
setTheme(checked ? 'dark' : 'light');
|
|
44
|
-
}, children: _jsxs(
|
|
44
|
+
}, children: _jsxs(Switch.Thumb, { className: "bg-background flex items-center justify-center dark:bg-zinc-900", children: [_jsx(SunIcon, { className: "dark:text-primary h-2.5 w-2.5 scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90" }), _jsx(MoonIcon, { className: "dark:text-primary absolute h-2.5 w-2.5 scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0" })] }) }));
|
|
45
45
|
};
|
|
46
46
|
//# sourceMappingURL=theme-switch.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme-switch.js","sourceRoot":"","sources":["../../src/components/theme-switch.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,
|
|
1
|
+
{"version":3,"file":"theme-switch.js","sourceRoot":"","sources":["../../src/components/theme-switch.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAC,QAAQ,EAAE,OAAO,EAAC,MAAM,cAAc,CAAC;AAE/C,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAChC,OAAO,EAAC,QAAQ,EAAC,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAC,MAAM,EAAC,MAAM,UAAU,CAAC;AAEhC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,MAAM,CAAC,MAAM,WAAW,GAGnB,CAAC,EAAC,SAAS,EAAC,EAAE,EAAE;IACnB,MAAM,EAAC,KAAK,EAAE,QAAQ,EAAC,GAAG,QAAQ,EAAE,CAAC;IAErC,OAAO,CACL,KAAC,MAAM,IACL,SAAS,EAAE,EAAE,CAAC,oCAAoC,EAAE,SAAS,CAAC,EAC9D,OAAO,EAAE,KAAK,KAAK,MAAM,EACzB,eAAe,EAAE,CAAC,OAAO,EAAE,EAAE;YAC3B,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;QACvC,CAAC,YAED,MAAC,MAAM,CAAC,KAAK,IAAC,SAAS,EAAC,iEAAiE,aACvF,KAAC,OAAO,IAAC,SAAS,EAAC,8FAA8F,GAAG,EACpH,KAAC,QAAQ,IAAC,SAAS,EAAC,sGAAsG,GAAG,IAChH,GACR,CACV,CAAC;AACJ,CAAC,CAAC","sourcesContent":["'use client';\n\nimport {MoonIcon, SunIcon} from 'lucide-react';\nimport {FC} from 'react';\nimport {cn} from '../lib/utils';\nimport {useTheme} from '../theme/theme-provider';\nimport {Switch} from './switch';\n\n/**\n * A theme toggle switch component that allows users to switch between light and dark themes.\n *\n * This component provides a visually appealing switch with sun/moon icons that animate smoothly\n * during theme transitions. It integrates with the theme context to manage theme state.\n *\n * Features:\n * - Smooth icon animations\n * - Accessible keyboard navigation\n * - Focus and hover states\n * - Customizable via className prop\n *\n * @component\n * @example\n * ```tsx\n * // Basic usage\n * <ThemeSwitch />\n *\n * // With custom styling\n * <ThemeSwitch className=\"my-custom-class\" />\n *\n * // Within a theme provider\n * import { ThemeProvider } from '../theme/theme-provider';\n *\n * function App() {\n * return (\n * <ThemeProvider>\n * <ThemeSwitch />\n * </ThemeProvider>\n * );\n * }\n * ```\n */\nexport const ThemeSwitch: FC<{\n /** Optional CSS class name for styling the switch container */\n className?: string;\n}> = ({className}) => {\n const {theme, setTheme} = useTheme();\n\n return (\n <Switch\n className={cn('data-[state=checked]:bg-primary/20', className)}\n checked={theme === 'dark'}\n onCheckedChange={(checked) => {\n setTheme(checked ? 'dark' : 'light');\n }}\n >\n <Switch.Thumb className=\"bg-background flex items-center justify-center dark:bg-zinc-900\">\n <SunIcon className=\"dark:text-primary h-2.5 w-2.5 scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90\" />\n <MoonIcon className=\"dark:text-primary absolute h-2.5 w-2.5 scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0\" />\n </Switch.Thumb>\n </Switch>\n );\n};\n"]}
|
package/dist/components/tree.js
CHANGED
|
@@ -24,11 +24,11 @@ function TreeNode(props) {
|
|
|
24
24
|
const hasChildren = Boolean(children?.length);
|
|
25
25
|
const [isOpen, setIsOpen] = useState(Boolean(treeData.isInitialOpen));
|
|
26
26
|
if (!hasChildren) {
|
|
27
|
-
return (_jsxs("div", { className: "flex w-full items-center space-x-1", children: [_jsx("div", { className: "shrink-0", style: { width: DROPDOWN_ICON_PLACEHOLDER_WIDTH } }), renderNode(treeData, isOpen)] }));
|
|
27
|
+
return (_jsxs("div", { className: "flex w-full items-center space-x-1", children: [_jsx("div", { className: "mr-px ml-2 shrink-0", style: { width: DROPDOWN_ICON_PLACEHOLDER_WIDTH } }), renderNode(treeData, isOpen)] }));
|
|
28
28
|
}
|
|
29
|
-
return (_jsxs(Collapsible, { open: isOpen, onOpenChange: setIsOpen, children: [_jsx(CollapsibleTrigger, { className: "w-full", asChild: true, children: _jsxs("div", { className: "flex w-full cursor-pointer items-center space-x-1", children: [_jsx(ChevronRightIcon, { className: cn('shrink-0 text-gray-500', {
|
|
29
|
+
return (_jsxs(Collapsible, { open: isOpen, onOpenChange: setIsOpen, children: [_jsx(CollapsibleTrigger, { className: "w-full", asChild: true, children: _jsxs("div", { className: "flex w-full cursor-pointer items-center space-x-1", children: [_jsx(ChevronRightIcon, { className: cn('mr-px ml-2 shrink-0 text-gray-500', {
|
|
30
30
|
'rotate-90 transform': isOpen,
|
|
31
|
-
}), size: DROPDOWN_ICON_PLACEHOLDER_WIDTH }), renderNode(treeData, isOpen)] }) }), _jsx(CollapsibleContent, { className: "pl-
|
|
31
|
+
}), size: DROPDOWN_ICON_PLACEHOLDER_WIDTH }), renderNode(treeData, isOpen)] }) }), _jsx(CollapsibleContent, { className: "pl-2", children: isOpen
|
|
32
32
|
? children?.map((child) => (_jsx(TreeNode, { treeData: child, renderNode: renderNode }, child.key)))
|
|
33
33
|
: null })] }));
|
|
34
34
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tree.js","sourceRoot":"","sources":["../../src/components/tree.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAC,WAAW,EAAE,kBAAkB,EAAC,MAAM,6BAA6B,CAAC;AAC5E,OAAc,EAAC,QAAQ,EAAC,MAAM,OAAO,CAAC;AAEtC,OAAO,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAChC,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAEjD,MAAM,+BAA+B,GAAG,MAAM,CAAC;AAe/C;;;;GAIG;AACH,MAAM,UAAU,IAAI,CAAI,KAAmB;IACzC,MAAM,EAAC,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAC,GAAG,KAAK,CAAC;IAChD,OAAO,CACL,cAAK,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC,YAC5C,KAAC,QAAQ,IAAI,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,GAAI,GACvD,CACP,CAAC;AACJ,CAAC;AAOD;;GAEG;AACH,SAAS,QAAQ,CAAI,KAAuB;IAC1C,MAAM,EAAC,QAAQ,EAAE,UAAU,EAAC,GAAG,KAAK,CAAC;IACrC,MAAM,EAAC,QAAQ,EAAC,GAAG,QAAQ,CAAC;IAC5B,MAAM,WAAW,GAAG,OAAO,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;IAC9C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;IACtE,IAAI,CAAC,WAAW,EAAE,CAAC;QACjB,OAAO,CACL,eAAK,SAAS,EAAC,oCAAoC,aACjD,cACE,SAAS,EAAC,
|
|
1
|
+
{"version":3,"file":"tree.js","sourceRoot":"","sources":["../../src/components/tree.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAC,WAAW,EAAE,kBAAkB,EAAC,MAAM,6BAA6B,CAAC;AAC5E,OAAc,EAAC,QAAQ,EAAC,MAAM,OAAO,CAAC;AAEtC,OAAO,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAChC,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAEjD,MAAM,+BAA+B,GAAG,MAAM,CAAC;AAe/C;;;;GAIG;AACH,MAAM,UAAU,IAAI,CAAI,KAAmB;IACzC,MAAM,EAAC,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAC,GAAG,KAAK,CAAC;IAChD,OAAO,CACL,cAAK,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC,YAC5C,KAAC,QAAQ,IAAI,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,GAAI,GACvD,CACP,CAAC;AACJ,CAAC;AAOD;;GAEG;AACH,SAAS,QAAQ,CAAI,KAAuB;IAC1C,MAAM,EAAC,QAAQ,EAAE,UAAU,EAAC,GAAG,KAAK,CAAC;IACrC,MAAM,EAAC,QAAQ,EAAC,GAAG,QAAQ,CAAC;IAC5B,MAAM,WAAW,GAAG,OAAO,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;IAC9C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;IACtE,IAAI,CAAC,WAAW,EAAE,CAAC;QACjB,OAAO,CACL,eAAK,SAAS,EAAC,oCAAoC,aACjD,cACE,SAAS,EAAC,qBAAqB,EAC/B,KAAK,EAAE,EAAC,KAAK,EAAE,+BAA+B,EAAC,GAC/C,EACD,UAAU,CAAC,QAAQ,EAAE,MAAM,CAAC,IACzB,CACP,CAAC;IACJ,CAAC;IACD,OAAO,CACL,MAAC,WAAW,IAAC,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,SAAS,aAChD,KAAC,kBAAkB,IAAC,SAAS,EAAC,QAAQ,EAAC,OAAO,kBAC5C,eAAK,SAAS,EAAC,mDAAmD,aAChE,KAAC,gBAAgB,IACf,SAAS,EAAE,EAAE,CAAC,mCAAmC,EAAE;gCACjD,qBAAqB,EAAE,MAAM;6BAC9B,CAAC,EACF,IAAI,EAAE,+BAA+B,GACrC,EACD,UAAU,CAAC,QAAQ,EAAE,MAAM,CAAC,IACzB,GACa,EACrB,KAAC,kBAAkB,IAAC,SAAS,EAAC,MAAM,YACjC,MAAM;oBACL,CAAC,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACvB,KAAC,QAAQ,IAEP,QAAQ,EAAE,KAAK,EACf,UAAU,EAAE,UAAU,IAFjB,KAAK,CAAC,GAAG,CAGd,CACH,CAAC;oBACJ,CAAC,CAAC,IAAI,GACW,IACT,CACf,CAAC;AACJ,CAAC","sourcesContent":["'use client';\n\nimport {Collapsible, CollapsibleContent} from '@radix-ui/react-collapsible';\nimport React, {useState} from 'react';\n\nimport {ChevronRightIcon} from 'lucide-react';\nimport {cn} from '../lib/utils';\nimport {CollapsibleTrigger} from './collapsible';\n\nconst DROPDOWN_ICON_PLACEHOLDER_WIDTH = '18px';\n\nexport type TreeNodeData<T> = {\n key: string;\n object: T;\n children?: TreeNodeData<T>[];\n isInitialOpen?: boolean;\n};\n\ntype TreeProps<T> = {\n className?: string;\n treeData: TreeNodeData<T>;\n renderNode: TreeNodeProps<T>['renderNode'];\n};\n\n/**\n * Component that renders a generic tree.\n * @param treeData - The tree data.\n * @param renderNode - A function that renders a tree node.\n */\nexport function Tree<T>(props: TreeProps<T>): React.ReactElement {\n const {className, treeData, renderNode} = props;\n return (\n <div className={cn('flex flex-col', className)}>\n <TreeNode<T> treeData={treeData} renderNode={renderNode} />\n </div>\n );\n}\n\ntype TreeNodeProps<T> = {\n treeData: TreeNodeData<T>;\n renderNode: (node: TreeNodeData<T>, isOpen: boolean) => React.ReactNode;\n};\n\n/**\n * Component that renders a tree node.\n */\nfunction TreeNode<T>(props: TreeNodeProps<T>): React.ReactElement | null {\n const {treeData, renderNode} = props;\n const {children} = treeData;\n const hasChildren = Boolean(children?.length);\n const [isOpen, setIsOpen] = useState(Boolean(treeData.isInitialOpen));\n if (!hasChildren) {\n return (\n <div className=\"flex w-full items-center space-x-1\">\n <div\n className=\"mr-px ml-2 shrink-0\"\n style={{width: DROPDOWN_ICON_PLACEHOLDER_WIDTH}}\n />\n {renderNode(treeData, isOpen)}\n </div>\n );\n }\n return (\n <Collapsible open={isOpen} onOpenChange={setIsOpen}>\n <CollapsibleTrigger className=\"w-full\" asChild>\n <div className=\"flex w-full cursor-pointer items-center space-x-1\">\n <ChevronRightIcon\n className={cn('mr-px ml-2 shrink-0 text-gray-500', {\n 'rotate-90 transform': isOpen,\n })}\n size={DROPDOWN_ICON_PLACEHOLDER_WIDTH}\n />\n {renderNode(treeData, isOpen)}\n </div>\n </CollapsibleTrigger>\n <CollapsibleContent className=\"pl-2\">\n {isOpen\n ? children?.map((child) => (\n <TreeNode<T>\n key={child.key}\n treeData={child}\n renderNode={renderNode}\n />\n ))\n : null}\n </CollapsibleContent>\n </Collapsible>\n );\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sqlrooms/ui",
|
|
3
|
-
"version": "0.29.0-rc.
|
|
3
|
+
"version": "0.29.0-rc.8",
|
|
4
4
|
"repository": {
|
|
5
5
|
"type": "git",
|
|
6
6
|
"url": "git+https://github.com/sqlrooms/sqlrooms.git"
|
|
@@ -71,5 +71,5 @@
|
|
|
71
71
|
"publishConfig": {
|
|
72
72
|
"access": "public"
|
|
73
73
|
},
|
|
74
|
-
"gitHead": "
|
|
74
|
+
"gitHead": "dcb1a51631c5fa87b49d3e78ae6c0023eccd4189"
|
|
75
75
|
}
|