glass-ui-solid 0.1.0 → 0.2.1
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/README.md +24 -15
- package/dist/_virtual/_commonjsHelpers.js +9 -0
- package/dist/_virtual/_commonjsHelpers.js.map +1 -0
- package/dist/_virtual/prism.js +8 -0
- package/dist/_virtual/prism.js.map +1 -0
- package/dist/_virtual/prism2.js +5 -0
- package/dist/_virtual/prism2.js.map +1 -0
- package/dist/components/Accordion/Accordion.d.ts.map +1 -1
- package/dist/components/Accordion/Accordion.js +53 -0
- package/dist/components/Accordion/Accordion.js.map +1 -0
- package/dist/components/Accordion/AccordionPanel.d.ts.map +1 -1
- package/dist/components/Accordion/AccordionPanel.js +38 -0
- package/dist/components/Accordion/AccordionPanel.js.map +1 -0
- package/dist/components/Alert/Alert.d.ts.map +1 -1
- package/dist/components/Alert/Alert.js +97 -0
- package/dist/components/Alert/Alert.js.map +1 -0
- package/dist/components/Avatar/Avatar.js +70 -0
- package/dist/components/Avatar/Avatar.js.map +1 -0
- package/dist/components/Badge/Badge.d.ts.map +1 -1
- package/dist/components/Badge/Badge.js +31 -0
- package/dist/components/Badge/Badge.js.map +1 -0
- package/dist/components/Breadcrumb/Breadcrumb.js +58 -0
- package/dist/components/Breadcrumb/Breadcrumb.js.map +1 -0
- package/dist/components/Button/Button.d.ts.map +1 -1
- package/dist/components/Button/Button.js +58 -0
- package/dist/components/Button/Button.js.map +1 -0
- package/dist/components/Button/Spinner.js +17 -0
- package/dist/components/Button/Spinner.js.map +1 -0
- package/dist/components/Button/types.d.ts +1 -1
- package/dist/components/Button/types.d.ts.map +1 -1
- package/dist/components/Card/Card.js +34 -0
- package/dist/components/Card/Card.js.map +1 -0
- package/dist/components/Chip/Chip.d.ts.map +1 -1
- package/dist/components/Chip/Chip.js +55 -0
- package/dist/components/Chip/Chip.js.map +1 -0
- package/dist/components/CodeBlock/CodeBlock.js +76 -0
- package/dist/components/CodeBlock/CodeBlock.js.map +1 -0
- package/dist/components/Dialog/Dialog.d.ts.map +1 -1
- package/dist/components/Dialog/Dialog.js +61 -0
- package/dist/components/Dialog/Dialog.js.map +1 -0
- package/dist/components/Drawer/Drawer.d.ts.map +1 -1
- package/dist/components/Drawer/Drawer.js +94 -0
- package/dist/components/Drawer/Drawer.js.map +1 -0
- package/dist/components/Dropdown/Dropdown.js +68 -0
- package/dist/components/Dropdown/Dropdown.js.map +1 -0
- package/dist/components/ErrorDisplay/ErrorDisplay.js +10 -0
- package/dist/components/ErrorDisplay/ErrorDisplay.js.map +1 -0
- package/dist/components/GlassBackground/GlassBackground.d.ts +47 -0
- package/dist/components/GlassBackground/GlassBackground.d.ts.map +1 -0
- package/dist/components/GlassBackground/GlassBackground.js +109 -0
- package/dist/components/GlassBackground/GlassBackground.js.map +1 -0
- package/dist/components/GlassBackground/index.d.ts +3 -0
- package/dist/components/GlassBackground/index.d.ts.map +1 -0
- package/dist/components/Input/Checkbox.d.ts.map +1 -1
- package/dist/components/Input/Checkbox.js +34 -0
- package/dist/components/Input/Checkbox.js.map +1 -0
- package/dist/components/Input/Input.d.ts.map +1 -1
- package/dist/components/Input/Input.js +53 -0
- package/dist/components/Input/Input.js.map +1 -0
- package/dist/components/Input/Select.d.ts.map +1 -1
- package/dist/components/Input/Select.js +39 -0
- package/dist/components/Input/Select.js.map +1 -0
- package/dist/components/Input/Textarea.d.ts.map +1 -1
- package/dist/components/Input/Textarea.js +52 -0
- package/dist/components/Input/Textarea.js.map +1 -0
- package/dist/components/Input/types.d.ts +9 -1
- package/dist/components/Input/types.d.ts.map +1 -1
- package/dist/components/JsonSchemaForm/JsonSchemaForm.d.ts.map +1 -1
- package/dist/components/JsonSchemaForm/JsonSchemaForm.js +162 -0
- package/dist/components/JsonSchemaForm/JsonSchemaForm.js.map +1 -0
- package/dist/components/JsonSchemaForm/fields/ArrayField.d.ts.map +1 -1
- package/dist/components/JsonSchemaForm/fields/ArrayField.js +198 -0
- package/dist/components/JsonSchemaForm/fields/ArrayField.js.map +1 -0
- package/dist/components/JsonSchemaForm/fields/BooleanField.d.ts +1 -1
- package/dist/components/JsonSchemaForm/fields/BooleanField.js +15 -0
- package/dist/components/JsonSchemaForm/fields/BooleanField.js.map +1 -0
- package/dist/components/JsonSchemaForm/fields/EnumField.js +36 -0
- package/dist/components/JsonSchemaForm/fields/EnumField.js.map +1 -0
- package/dist/components/JsonSchemaForm/fields/NumberField.js +27 -0
- package/dist/components/JsonSchemaForm/fields/NumberField.js.map +1 -0
- package/dist/components/JsonSchemaForm/fields/ObjectField.js +67 -0
- package/dist/components/JsonSchemaForm/fields/ObjectField.js.map +1 -0
- package/dist/components/JsonSchemaForm/fields/OneOfField.js +28 -0
- package/dist/components/JsonSchemaForm/fields/OneOfField.js.map +1 -0
- package/dist/components/JsonSchemaForm/fields/SchemaField.js +77 -0
- package/dist/components/JsonSchemaForm/fields/SchemaField.js.map +1 -0
- package/dist/components/JsonSchemaForm/fields/StringField.js +40 -0
- package/dist/components/JsonSchemaForm/fields/StringField.js.map +1 -0
- package/dist/components/JsonSchemaForm/utils.js +37 -0
- package/dist/components/JsonSchemaForm/utils.js.map +1 -0
- package/dist/components/JsonViewer/JsonViewer.d.ts.map +1 -1
- package/dist/components/JsonViewer/JsonViewer.js +213 -0
- package/dist/components/JsonViewer/JsonViewer.js.map +1 -0
- package/dist/components/Markdown/Markdown.js +79 -0
- package/dist/components/Markdown/Markdown.js.map +1 -0
- package/dist/components/Menu/Menu.js +139 -0
- package/dist/components/Menu/Menu.js.map +1 -0
- package/dist/components/Menu/types.d.ts +11 -4
- package/dist/components/Menu/types.d.ts.map +1 -1
- package/dist/components/Modal/Modal.d.ts.map +1 -1
- package/dist/components/Modal/Modal.js +90 -0
- package/dist/components/Modal/Modal.js.map +1 -0
- package/dist/components/Pagination/Pagination.d.ts.map +1 -1
- package/dist/components/Pagination/Pagination.js +95 -0
- package/dist/components/Pagination/Pagination.js.map +1 -0
- package/dist/components/Progress/Progress.js +136 -0
- package/dist/components/Progress/Progress.js.map +1 -0
- package/dist/components/Section/Section.js +10 -0
- package/dist/components/Section/Section.js.map +1 -0
- package/dist/components/SegmentedControl/SegmentedControl.d.ts.map +1 -1
- package/dist/components/SegmentedControl/SegmentedControl.js +57 -0
- package/dist/components/SegmentedControl/SegmentedControl.js.map +1 -0
- package/dist/components/Skeleton/Skeleton.js +37 -0
- package/dist/components/Skeleton/Skeleton.js.map +1 -0
- package/dist/components/Snackbar/Snackbar.d.ts.map +1 -1
- package/dist/components/Snackbar/Snackbar.js +68 -0
- package/dist/components/Snackbar/Snackbar.js.map +1 -0
- package/dist/components/Snackbar/SnackbarContainer.d.ts +8 -0
- package/dist/components/Snackbar/SnackbarContainer.d.ts.map +1 -0
- package/dist/components/Snackbar/SnackbarContainer.js +82 -0
- package/dist/components/Snackbar/SnackbarContainer.js.map +1 -0
- package/dist/components/Snackbar/index.d.ts +3 -0
- package/dist/components/Snackbar/index.d.ts.map +1 -1
- package/dist/components/Snackbar/store.d.ts +24 -0
- package/dist/components/Snackbar/store.d.ts.map +1 -0
- package/dist/components/Snackbar/store.js +37 -0
- package/dist/components/Snackbar/store.js.map +1 -0
- package/dist/components/Table/Table.d.ts.map +1 -1
- package/dist/components/Table/Table.js +163 -0
- package/dist/components/Table/Table.js.map +1 -0
- package/dist/components/Tabs/Tabs.js +60 -0
- package/dist/components/Tabs/Tabs.js.map +1 -0
- package/dist/components/Toast/Toast.d.ts.map +1 -1
- package/dist/components/Toast/Toast.js +109 -0
- package/dist/components/Toast/Toast.js.map +1 -0
- package/dist/components/Toast/store.d.ts +7 -2
- package/dist/components/Toast/store.d.ts.map +1 -1
- package/dist/components/Toast/store.js +42 -0
- package/dist/components/Toast/store.js.map +1 -0
- package/dist/components/Tooltip/Tooltip.js +47 -0
- package/dist/components/Tooltip/Tooltip.js.map +1 -0
- package/dist/components/index.d.ts +4 -2
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/shared/CloseButton/CloseButton.d.ts +20 -0
- package/dist/components/shared/CloseButton/CloseButton.d.ts.map +1 -0
- package/dist/components/shared/CloseButton/CloseButton.js +55 -0
- package/dist/components/shared/CloseButton/CloseButton.js.map +1 -0
- package/dist/components/shared/CloseButton/index.d.ts +3 -0
- package/dist/components/shared/CloseButton/index.d.ts.map +1 -0
- package/dist/components/shared/CloseButton/types.d.ts +23 -0
- package/dist/components/shared/CloseButton/types.d.ts.map +1 -0
- package/dist/components/shared/icons/CheckIcon.d.ts +5 -0
- package/dist/components/shared/icons/CheckIcon.d.ts.map +1 -0
- package/dist/components/shared/icons/CheckIcon.js +20 -0
- package/dist/components/shared/icons/CheckIcon.js.map +1 -0
- package/dist/components/shared/icons/ChevronIcon.d.ts +14 -0
- package/dist/components/shared/icons/ChevronIcon.d.ts.map +1 -0
- package/dist/components/shared/icons/ChevronIcon.js +38 -0
- package/dist/components/shared/icons/ChevronIcon.js.map +1 -0
- package/dist/components/shared/icons/CloseIcon.d.ts +8 -0
- package/dist/components/shared/icons/CloseIcon.d.ts.map +1 -0
- package/dist/components/shared/icons/CloseIcon.js +20 -0
- package/dist/components/shared/icons/CloseIcon.js.map +1 -0
- package/dist/components/shared/icons/ErrorIcon.d.ts +5 -0
- package/dist/components/shared/icons/ErrorIcon.d.ts.map +1 -0
- package/dist/components/shared/icons/ErrorIcon.js +20 -0
- package/dist/components/shared/icons/ErrorIcon.js.map +1 -0
- package/dist/components/shared/icons/InfoIcon.d.ts +5 -0
- package/dist/components/shared/icons/InfoIcon.d.ts.map +1 -0
- package/dist/components/shared/icons/InfoIcon.js +20 -0
- package/dist/components/shared/icons/InfoIcon.js.map +1 -0
- package/dist/components/shared/icons/PlusIcon.d.ts +5 -0
- package/dist/components/shared/icons/PlusIcon.d.ts.map +1 -0
- package/dist/components/shared/icons/PlusIcon.js +20 -0
- package/dist/components/shared/icons/PlusIcon.js.map +1 -0
- package/dist/components/shared/icons/SortIcon.d.ts +5 -0
- package/dist/components/shared/icons/SortIcon.d.ts.map +1 -0
- package/dist/components/shared/icons/SortIcon.js +20 -0
- package/dist/components/shared/icons/SortIcon.js.map +1 -0
- package/dist/components/shared/icons/TrashIcon.d.ts +5 -0
- package/dist/components/shared/icons/TrashIcon.d.ts.map +1 -0
- package/dist/components/shared/icons/TrashIcon.js +20 -0
- package/dist/components/shared/icons/TrashIcon.js.map +1 -0
- package/dist/components/shared/icons/WarningIcon.d.ts +5 -0
- package/dist/components/shared/icons/WarningIcon.d.ts.map +1 -0
- package/dist/components/shared/icons/WarningIcon.js +20 -0
- package/dist/components/shared/icons/WarningIcon.js.map +1 -0
- package/dist/components/shared/icons/index.d.ts +12 -0
- package/dist/components/shared/icons/index.d.ts.map +1 -0
- package/dist/components/shared/index.d.ts +4 -0
- package/dist/components/shared/index.d.ts.map +1 -0
- package/dist/constants/animations.d.ts +101 -0
- package/dist/constants/animations.d.ts.map +1 -0
- package/dist/constants/animations.js +28 -0
- package/dist/constants/animations.js.map +1 -0
- package/dist/constants/colors.d.ts +95 -0
- package/dist/constants/colors.d.ts.map +1 -0
- package/dist/constants/colors.js +133 -0
- package/dist/constants/colors.js.map +1 -0
- package/dist/constants/index.d.ts +6 -0
- package/dist/constants/index.d.ts.map +1 -0
- package/dist/hooks/index.d.ts +2 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/useAnimationState.d.ts +40 -0
- package/dist/hooks/useAnimationState.d.ts.map +1 -0
- package/dist/hooks/useAnimationState.js +23 -0
- package/dist/hooks/useAnimationState.js.map +1 -0
- package/dist/hooks/useCopyToClipboard.js +18 -0
- package/dist/hooks/useCopyToClipboard.js.map +1 -0
- package/dist/hooks/useDialogState.js +25 -0
- package/dist/hooks/useDialogState.js.map +1 -0
- package/dist/hooks/useDisclosure.js +14 -0
- package/dist/hooks/useDisclosure.js.map +1 -0
- package/dist/hooks/useIsDark.js +7 -0
- package/dist/hooks/useIsDark.js.map +1 -0
- package/dist/index.js +112 -6243
- package/dist/index.js.map +1 -1
- package/dist/node_modules/dompurify/dist/purify.es.js +553 -0
- package/dist/node_modules/dompurify/dist/purify.es.js.map +1 -0
- package/dist/node_modules/marked/lib/marked.esm.js +1564 -0
- package/dist/node_modules/marked/lib/marked.esm.js.map +1 -0
- package/dist/node_modules/prismjs/components/prism-bash.js +220 -0
- package/dist/node_modules/prismjs/components/prism-bash.js.map +1 -0
- package/dist/node_modules/prismjs/components/prism-json.js +26 -0
- package/dist/node_modules/prismjs/components/prism-json.js.map +1 -0
- package/dist/node_modules/prismjs/prism.js +1157 -0
- package/dist/node_modules/prismjs/prism.js.map +1 -0
- package/dist/styles.css +1 -0
- package/dist/styles2.css +1 -0
- package/package.json +14 -10
- package/dist/index.css +0 -1
package/README.md
CHANGED
|
@@ -120,36 +120,45 @@ import {
|
|
|
120
120
|
|
|
121
121
|
## Theming
|
|
122
122
|
|
|
123
|
-
The library uses CSS custom properties
|
|
123
|
+
The library uses CSS custom properties with a numbered scale (OKLCH color space). Override these in your CSS:
|
|
124
124
|
|
|
125
125
|
```css
|
|
126
126
|
:root {
|
|
127
|
+
/* Glass effects */
|
|
127
128
|
--glass-bg: rgba(255, 255, 255, 0.7);
|
|
128
129
|
--glass-border: rgba(255, 255, 255, 0.3);
|
|
129
130
|
--glass-blur: 20px;
|
|
130
131
|
|
|
131
|
-
|
|
132
|
-
--color-surface-
|
|
133
|
-
--color-
|
|
134
|
-
--color-
|
|
135
|
-
|
|
136
|
-
--color-
|
|
137
|
-
--color-
|
|
138
|
-
--color-
|
|
139
|
-
--color-
|
|
132
|
+
/* Surface colors (backgrounds, cards, inputs) */
|
|
133
|
+
--color-surface-50: oklch(0.99 0.002 240);
|
|
134
|
+
--color-surface-100: oklch(0.97 0.004 240);
|
|
135
|
+
--color-surface-200: oklch(0.92 0.01 240);
|
|
136
|
+
--color-surface-300: oklch(0.8 0.02 240);
|
|
137
|
+
--color-surface-400: oklch(0.6 0.025 240);
|
|
138
|
+
--color-surface-500: oklch(0.4 0.03 240);
|
|
139
|
+
--color-surface-600: oklch(0.3 0.03 250);
|
|
140
|
+
--color-surface-700: oklch(0.2 0.03 260);
|
|
141
|
+
--color-surface-800: oklch(0.15 0.03 260);
|
|
142
|
+
--color-surface-900: oklch(0.1 0.03 260);
|
|
143
|
+
--color-surface-950: oklch(0.05 0.03 260);
|
|
144
|
+
|
|
145
|
+
/* Accent colors (buttons, links, focus states) */
|
|
146
|
+
--color-accent-500: oklch(0.55 0.2 250);
|
|
147
|
+
/* ... see theme.css for full scale */
|
|
140
148
|
}
|
|
141
149
|
|
|
142
150
|
.dark {
|
|
143
151
|
--glass-bg: rgba(30, 30, 30, 0.8);
|
|
144
152
|
--glass-border: rgba(255, 255, 255, 0.1);
|
|
145
|
-
|
|
146
|
-
--color-surface: #1c1c1e;
|
|
147
|
-
--color-surface-secondary: #2c2c2e;
|
|
148
|
-
--color-text: #f5f5f7;
|
|
149
|
-
--color-text-secondary: #98989d;
|
|
150
153
|
}
|
|
151
154
|
```
|
|
152
155
|
|
|
156
|
+
For the full color palette, import the theme file directly:
|
|
157
|
+
|
|
158
|
+
```css
|
|
159
|
+
@import "glass-ui-solid/theme.css";
|
|
160
|
+
```
|
|
161
|
+
|
|
153
162
|
## Dark Mode
|
|
154
163
|
|
|
155
164
|
Add the `dark` class to enable dark mode:
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
var o = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
|
|
2
|
+
function l(e) {
|
|
3
|
+
return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
|
|
4
|
+
}
|
|
5
|
+
export {
|
|
6
|
+
o as commonjsGlobal,
|
|
7
|
+
l as getDefaultExportFromCjs
|
|
8
|
+
};
|
|
9
|
+
//# sourceMappingURL=_commonjsHelpers.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"_commonjsHelpers.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"prism.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"prism2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAA2B,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAA2B,MAAM,UAAU,CAAC;AAEnE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,eAAO,MAAM,SAAS,EAAE,SAAS,CAAC,cAAc,CA6D/C,CAAC"}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { template as f, insert as n, createComponent as c, effect as d, setAttribute as u, className as b, delegateEvents as w } from "solid-js/web";
|
|
2
|
+
import { createSignal as k, For as _, Show as C } from "solid-js";
|
|
3
|
+
import { ChevronRightIcon as y, ChevronDownIcon as I } from "../shared/icons/ChevronIcon.js";
|
|
4
|
+
var O = /* @__PURE__ */ f("<div>"), A = /* @__PURE__ */ f('<div class="px-3 pb-3 border-t border-surface-200 dark:border-white/5 animate-in fade-in slide-in-from-top-2 duration-200"><div class=pt-3>'), D = /* @__PURE__ */ f('<div class="glass-card rounded-lg overflow-hidden"><button type=button class="w-full flex items-center justify-between px-3 py-2.5 hover:bg-black/[0.02] dark:hover:bg-white/[0.02] transition-colors"><div class="flex items-center gap-2 text-left"><span class="text-xs font-medium text-surface-700 dark:text-surface-200">');
|
|
5
|
+
const F = (o) => {
|
|
6
|
+
const p = () => {
|
|
7
|
+
const e = [];
|
|
8
|
+
for (const t of o.items)
|
|
9
|
+
t.defaultOpen && e.push(t.id);
|
|
10
|
+
return e;
|
|
11
|
+
}, [x, h] = k(p()), i = (e) => x().includes(e), $ = (e) => {
|
|
12
|
+
o.multiple ? h((t) => t.includes(e) ? t.filter((s) => s !== e) : [...t, e]) : h((t) => t.includes(e) ? [] : [e]);
|
|
13
|
+
};
|
|
14
|
+
return (() => {
|
|
15
|
+
var e = O();
|
|
16
|
+
return n(e, c(_, {
|
|
17
|
+
get each() {
|
|
18
|
+
return o.items;
|
|
19
|
+
},
|
|
20
|
+
children: (t) => (() => {
|
|
21
|
+
var s = D(), a = s.firstChild, m = a.firstChild, v = m.firstChild;
|
|
22
|
+
return a.$$click = () => $(t.id), n(m, c(y, {
|
|
23
|
+
get class() {
|
|
24
|
+
return `w-3.5 h-3.5 text-surface-500 dark:text-surface-400 transition-transform duration-200 ${i(t.id) ? "rotate-90" : ""}`;
|
|
25
|
+
}
|
|
26
|
+
}), v), n(v, () => t.title), n(a, c(I, {
|
|
27
|
+
get class() {
|
|
28
|
+
return `w-3.5 h-3.5 text-surface-400 dark:text-surface-500 transition-transform duration-200 ${i(t.id) ? "rotate-180" : ""}`;
|
|
29
|
+
}
|
|
30
|
+
}), null), n(s, c(C, {
|
|
31
|
+
get when() {
|
|
32
|
+
return i(t.id);
|
|
33
|
+
},
|
|
34
|
+
get children() {
|
|
35
|
+
var r = A(), l = r.firstChild;
|
|
36
|
+
return n(l, () => t.content), d(() => u(r, "id", `accordion-content-${t.id}`)), r;
|
|
37
|
+
}
|
|
38
|
+
}), null), d((r) => {
|
|
39
|
+
var l = i(t.id), g = `accordion-content-${t.id}`;
|
|
40
|
+
return l !== r.e && u(a, "aria-expanded", r.e = l), g !== r.t && u(a, "aria-controls", r.t = g), r;
|
|
41
|
+
}, {
|
|
42
|
+
e: void 0,
|
|
43
|
+
t: void 0
|
|
44
|
+
}), s;
|
|
45
|
+
})()
|
|
46
|
+
})), d(() => b(e, `space-y-1.5 ${o.class ?? ""}`)), e;
|
|
47
|
+
})();
|
|
48
|
+
};
|
|
49
|
+
w(["click"]);
|
|
50
|
+
export {
|
|
51
|
+
F as Accordion
|
|
52
|
+
};
|
|
53
|
+
//# sourceMappingURL=Accordion.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Accordion.js","sources":["../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import { type Component, For, Show, createSignal } from 'solid-js';\nimport { ChevronDownIcon, ChevronRightIcon } from '../shared/icons';\nimport type { AccordionProps } from './types';\n\nexport const Accordion: Component<AccordionProps> = (props) => {\n const getDefaultOpen = () => {\n const defaults: string[] = [];\n for (const item of props.items) {\n if (item.defaultOpen) {\n defaults.push(item.id);\n }\n }\n return defaults;\n };\n\n const [openItems, setOpenItems] = createSignal<string[]>(getDefaultOpen());\n\n const isOpen = (id: string) => openItems().includes(id);\n\n const toggle = (id: string) => {\n if (props.multiple) {\n setOpenItems((prev) => (prev.includes(id) ? prev.filter((i) => i !== id) : [...prev, id]));\n } else {\n setOpenItems((prev) => (prev.includes(id) ? [] : [id]));\n }\n };\n\n return (\n <div class={`space-y-1.5 ${props.class ?? ''}`}>\n <For each={props.items}>\n {(item) => (\n <div class=\"glass-card rounded-lg overflow-hidden\">\n <button\n type=\"button\"\n onClick={() => toggle(item.id)}\n class=\"w-full flex items-center justify-between px-3 py-2.5 hover:bg-black/[0.02] dark:hover:bg-white/[0.02] transition-colors\"\n aria-expanded={isOpen(item.id)}\n aria-controls={`accordion-content-${item.id}`}\n >\n <div class=\"flex items-center gap-2 text-left\">\n <ChevronRightIcon\n class={`w-3.5 h-3.5 text-surface-500 dark:text-surface-400 transition-transform duration-200 ${isOpen(item.id) ? 'rotate-90' : ''}`}\n />\n <span class=\"text-xs font-medium text-surface-700 dark:text-surface-200\">\n {item.title}\n </span>\n </div>\n <ChevronDownIcon\n class={`w-3.5 h-3.5 text-surface-400 dark:text-surface-500 transition-transform duration-200 ${isOpen(item.id) ? 'rotate-180' : ''}`}\n />\n </button>\n\n <Show when={isOpen(item.id)}>\n <div\n id={`accordion-content-${item.id}`}\n class=\"px-3 pb-3 border-t border-surface-200 dark:border-white/5 animate-in fade-in slide-in-from-top-2 duration-200\"\n >\n <div class=\"pt-3\">{item.content}</div>\n </div>\n </Show>\n </div>\n )}\n </For>\n </div>\n );\n};\n"],"names":["Accordion","props","getDefaultOpen","defaults","item","items","defaultOpen","push","id","openItems","setOpenItems","createSignal","isOpen","includes","toggle","multiple","prev","filter","i","_el$","_tmpl$","_$insert","_$createComponent","For","each","children","_el$2","_tmpl$3","_el$3","firstChild","_el$4","_el$5","$$click","ChevronRightIcon","title","ChevronDownIcon","Show","when","_el$6","_tmpl$2","_el$7","content","_$effect","_$setAttribute","_p$","_v$","_v$2","e","t","undefined","_$className","class","_$delegateEvents"],"mappings":";;;;AAIO,MAAMA,IAAwCC,CAAAA,MAAU;AAC7D,QAAMC,IAAiBA,MAAM;AAC3B,UAAMC,IAAqB,CAAA;AAC3B,eAAWC,KAAQH,EAAMI;AACvB,MAAID,EAAKE,eACPH,EAASI,KAAKH,EAAKI,EAAE;AAGzB,WAAOL;AAAAA,EACT,GAEM,CAACM,GAAWC,CAAY,IAAIC,EAAuBT,GAAgB,GAEnEU,IAASA,CAACJ,MAAeC,EAAAA,EAAYI,SAASL,CAAE,GAEhDM,IAASA,CAACN,MAAe;AAC7B,IAAIP,EAAMc,WACRL,EAAcM,CAAAA,MAAUA,EAAKH,SAASL,CAAE,IAAIQ,EAAKC,OAAQC,CAAAA,MAAMA,MAAMV,CAAE,IAAI,CAAC,GAAGQ,GAAMR,CAAE,CAAE,IAEzFE,EAAcM,CAAAA,MAAUA,EAAKH,SAASL,CAAE,IAAI,CAAA,IAAK,CAACA,CAAE,CAAE;AAAA,EAE1D;AAEA,UAAA,MAAA;AAAA,QAAAW,IAAAC,EAAAA;AAAAC,WAAAA,EAAAF,GAAAG,EAEKC,GAAG;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEvB,EAAMI;AAAAA,MAAK;AAAA,MAAAoB,UAClBrB,QAAI,MAAA;AAAA,YAAAsB,IAAAC,KAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC,YAAAE,IAAAD,EAAAD;AAAAD,eAAAA,EAAAI,UAIS,MAAMlB,EAAOV,EAAKI,EAAE,GAACa,EAAAS,GAAAR,EAM3BW,GAAgB;AAAA,UAAA,IAAA,QAAA;AAAA,mBACR,wFAAwFrB,EAAOR,EAAKI,EAAE,IAAI,cAAc,EAAE;AAAA,UAAE;AAAA,QAAA,CAAA,GAAAuB,CAAA,GAAAV,EAAAU,GAAA,MAGlI3B,EAAK8B,KAAK,GAAAb,EAAAO,GAAAN,EAGda,GAAe;AAAA,UAAA,IAAA,QAAA;AAAA,mBACP,wFAAwFvB,EAAOR,EAAKI,EAAE,IAAI,eAAe,EAAE;AAAA,UAAE;AAAA,QAAA,CAAA,GAAA,IAAA,GAAAa,EAAAK,GAAAJ,EAIvIc,GAAI;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAEzB,EAAOR,EAAKI,EAAE;AAAA,UAAC;AAAA,UAAA,IAAAiB,WAAA;AAAA,gBAAAa,IAAAC,EAAAA,GAAAC,IAAAF,EAAAT;AAAAR,mBAAAA,EAAAmB,GAAA,MAKJpC,EAAKqC,OAAO,GAAAC,EAAA,MAAAC,EAAAL,SAH3B,qBAAqBlC,EAAKI,EAAE,EAAE,CAAA,GAAA8B;AAAAA,UAAA;AAAA,QAAA,CAAA,GAAA,IAAA,GAAAI,EAAAE,CAAAA,MAAA;AAAA,cAAAC,IAlBrBjC,EAAOR,EAAKI,EAAE,GAACsC,IACf,qBAAqB1C,EAAKI,EAAE;AAAEqC,iBAAAA,MAAAD,EAAAG,KAAAJ,EAAAf,GAAA,iBAAAgB,EAAAG,IAAAF,CAAA,GAAAC,MAAAF,EAAAI,KAAAL,EAAAf,GAAA,iBAAAgB,EAAAI,IAAAF,CAAA,GAAAF;AAAAA,QAAA,GAAA;AAAA,UAAAG,GAAAE;AAAAA,UAAAD,GAAAC;AAAAA,QAAAA,CAAA,GAAAvB;AAAAA,MAAA,GAAA;AAAA,IAAA,CAwBlD,CAAA,GAAAgB,EAAA,MAAAQ,EAAA/B,GAjCO,eAAelB,EAAMkD,SAAS,EAAE,EAAE,CAAA,GAAAhC;AAAAA,EAAA,GAAA;AAqClD;AAAEiC,EAAA,CAAA,OAAA,CAAA;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAsB,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"AccordionPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAsB,MAAM,UAAU,CAAC;AAE9D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,kDAAkD;AAClD,eAAO,MAAM,cAAc,EAAE,SAAS,CAAC,mBAAmB,CA6BzD,CAAC"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { template as f, insert as r, createComponent as s, effect as m, className as h, setAttribute as v, delegateEvents as x } from "solid-js/web";
|
|
2
|
+
import { createSignal as g, Show as b } from "solid-js";
|
|
3
|
+
import { ChevronRightIcon as p, ChevronDownIcon as $ } from "../shared/icons/ChevronIcon.js";
|
|
4
|
+
var w = /* @__PURE__ */ f('<div class="px-3 pb-3 border-t border-surface-200 dark:border-white/5 animate-in fade-in slide-in-from-top-2 duration-200"><div class=pt-3>'), k = /* @__PURE__ */ f('<div><button type=button class="w-full flex items-center justify-between px-3 py-2.5 hover:bg-black/[0.02] dark:hover:bg-white/[0.02] transition-colors"><div class="flex items-center gap-2 text-left"><span class="text-xs font-medium text-surface-700 dark:text-surface-200">');
|
|
5
|
+
const A = (a) => {
|
|
6
|
+
const [t, u] = g(a.defaultOpen ?? !1);
|
|
7
|
+
return (() => {
|
|
8
|
+
var n = k(), i = n.firstChild, o = i.firstChild, c = o.firstChild;
|
|
9
|
+
return i.$$click = () => u(!t()), r(o, s(p, {
|
|
10
|
+
get class() {
|
|
11
|
+
return `w-3.5 h-3.5 text-surface-500 dark:text-surface-400 transition-transform duration-200 ${t() ? "rotate-90" : ""}`;
|
|
12
|
+
}
|
|
13
|
+
}), c), r(c, () => a.title), r(i, s($, {
|
|
14
|
+
get class() {
|
|
15
|
+
return `w-3.5 h-3.5 text-surface-400 dark:text-surface-500 transition-transform duration-200 ${t() ? "rotate-180" : ""}`;
|
|
16
|
+
}
|
|
17
|
+
}), null), r(n, s(b, {
|
|
18
|
+
get when() {
|
|
19
|
+
return t();
|
|
20
|
+
},
|
|
21
|
+
get children() {
|
|
22
|
+
var e = w(), l = e.firstChild;
|
|
23
|
+
return r(l, () => a.children), e;
|
|
24
|
+
}
|
|
25
|
+
}), null), m((e) => {
|
|
26
|
+
var l = `glass-card rounded-lg overflow-hidden ${a.class ?? ""}`, d = t();
|
|
27
|
+
return l !== e.e && h(n, e.e = l), d !== e.t && v(i, "aria-expanded", e.t = d), e;
|
|
28
|
+
}, {
|
|
29
|
+
e: void 0,
|
|
30
|
+
t: void 0
|
|
31
|
+
}), n;
|
|
32
|
+
})();
|
|
33
|
+
};
|
|
34
|
+
x(["click"]);
|
|
35
|
+
export {
|
|
36
|
+
A as AccordionPanel
|
|
37
|
+
};
|
|
38
|
+
//# sourceMappingURL=AccordionPanel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccordionPanel.js","sources":["../../../src/components/Accordion/AccordionPanel.tsx"],"sourcesContent":["import { type Component, Show, createSignal } from 'solid-js';\nimport { ChevronDownIcon, ChevronRightIcon } from '../shared/icons';\nimport type { AccordionPanelProps } from './types';\n\n/** Single accordion panel for simple use cases */\nexport const AccordionPanel: Component<AccordionPanelProps> = (props) => {\n const [open, setOpen] = createSignal(props.defaultOpen ?? false);\n\n return (\n <div class={`glass-card rounded-lg overflow-hidden ${props.class ?? ''}`}>\n <button\n type=\"button\"\n onClick={() => setOpen(!open())}\n class=\"w-full flex items-center justify-between px-3 py-2.5 hover:bg-black/[0.02] dark:hover:bg-white/[0.02] transition-colors\"\n aria-expanded={open()}\n >\n <div class=\"flex items-center gap-2 text-left\">\n <ChevronRightIcon\n class={`w-3.5 h-3.5 text-surface-500 dark:text-surface-400 transition-transform duration-200 ${open() ? 'rotate-90' : ''}`}\n />\n <span class=\"text-xs font-medium text-surface-700 dark:text-surface-200\">{props.title}</span>\n </div>\n <ChevronDownIcon\n class={`w-3.5 h-3.5 text-surface-400 dark:text-surface-500 transition-transform duration-200 ${open() ? 'rotate-180' : ''}`}\n />\n </button>\n\n <Show when={open()}>\n <div class=\"px-3 pb-3 border-t border-surface-200 dark:border-white/5 animate-in fade-in slide-in-from-top-2 duration-200\">\n <div class=\"pt-3\">{props.children}</div>\n </div>\n </Show>\n </div>\n );\n};\n"],"names":["AccordionPanel","props","open","setOpen","createSignal","defaultOpen","_el$","_tmpl$2","_el$2","firstChild","_el$3","_el$4","$$click","_$insert","_$createComponent","ChevronRightIcon","title","ChevronDownIcon","Show","when","children","_el$5","_tmpl$","_el$6","_$effect","_p$","_v$","class","_v$2","e","_$className","t","_$setAttribute","undefined","_$delegateEvents"],"mappings":";;;;AAKO,MAAMA,IAAkDC,CAAAA,MAAU;AACvE,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAaH,EAAMI,eAAe,EAAK;AAE/D,UAAA,MAAA;AAAA,QAAAC,IAAAC,KAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC,YAAAE,IAAAD,EAAAD;AAAAD,WAAAA,EAAAI,UAIe,MAAMT,EAAQ,CAACD,GAAM,GAACW,EAAAH,GAAAI,EAK5BC,GAAgB;AAAA,MAAA,IAAA,QAAA;AAAA,eACR,wFAAwFb,EAAAA,IAAS,cAAc,EAAE;AAAA,MAAE;AAAA,IAAA,CAAA,GAAAS,CAAA,GAAAE,EAAAF,GAAA,MAElDV,EAAMe,KAAK,GAAAH,EAAAL,GAAAM,EAEtFG,GAAe;AAAA,MAAA,IAAA,QAAA;AAAA,eACP,wFAAwFf,EAAAA,IAAS,eAAe,EAAE;AAAA,MAAE;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAW,EAAAP,GAAAQ,EAI9HI,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEjB,EAAAA;AAAAA,MAAM;AAAA,MAAA,IAAAkB,WAAA;AAAA,YAAAC,IAAAC,EAAAA,GAAAC,IAAAF,EAAAZ;AAAAI,eAAAA,EAAAU,GAAA,MAEKtB,EAAMmB,QAAQ,GAAAC;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAG,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IApB3B,yCAAyCzB,EAAM0B,SAAS,EAAE,IAAEC,IAKrD1B,EAAAA;AAAMwB,aAAAA,MAAAD,EAAAI,KAAAC,EAAAxB,GAAAmB,EAAAI,IAAAH,CAAA,GAAAE,MAAAH,EAAAM,KAAAC,EAAAxB,GAAA,iBAAAiB,EAAAM,IAAAH,CAAA,GAAAH;AAAAA,IAAA,GAAA;AAAA,MAAAI,GAAAI;AAAAA,MAAAF,GAAAE;AAAAA,IAAAA,CAAA,GAAA3B;AAAAA,EAAA,GAAA;AAoB7B;AAAE4B,EAAA,CAAA,OAAA,CAAA;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAQ,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAQ,MAAM,UAAU,CAAC;AAShD,OAAO,KAAK,EAAE,UAAU,EAAa,MAAM,SAAS,CAAC;AAsBrD,eAAO,MAAM,KAAK,EAAE,SAAS,CAAC,UAAU,CAwCvC,CAAC"}
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import { template as s, insert as n, createComponent as r, addEventListener as m, effect as v, className as g, delegateEvents as x } from "solid-js/web";
|
|
2
|
+
import { Show as l } from "solid-js";
|
|
3
|
+
import { CloseIcon as b } from "../shared/icons/CloseIcon.js";
|
|
4
|
+
import { ALERT_COLORS as w } from "../../constants/colors.js";
|
|
5
|
+
import { InfoIcon as k } from "../shared/icons/InfoIcon.js";
|
|
6
|
+
import { CheckIcon as $ } from "../shared/icons/CheckIcon.js";
|
|
7
|
+
import { WarningIcon as C } from "../shared/icons/WarningIcon.js";
|
|
8
|
+
import { ErrorIcon as y } from "../shared/icons/ErrorIcon.js";
|
|
9
|
+
var _ = /* @__PURE__ */ s('<h3 class="text-sm font-semibold text-surface-900 dark:text-surface-100 mb-1">'), I = /* @__PURE__ */ s('<button type=button class="flex-shrink-0 p-1.5 rounded-lg text-surface-400 hover:text-surface-600 dark:hover:text-surface-200 hover:bg-black/5 dark:hover:bg-white/5 transition-colors"aria-label=Close>'), E = /* @__PURE__ */ s('<div role=alert><div class="flex items-start gap-3"><div></div><div class="flex-1 min-w-0"><div class="text-sm text-surface-700 dark:text-surface-300">');
|
|
10
|
+
const L = (e) => r(l, {
|
|
11
|
+
get when() {
|
|
12
|
+
return e.type === "info";
|
|
13
|
+
},
|
|
14
|
+
get fallback() {
|
|
15
|
+
return r(l, {
|
|
16
|
+
get when() {
|
|
17
|
+
return e.type === "success";
|
|
18
|
+
},
|
|
19
|
+
get fallback() {
|
|
20
|
+
return r(l, {
|
|
21
|
+
get when() {
|
|
22
|
+
return e.type === "warning";
|
|
23
|
+
},
|
|
24
|
+
get fallback() {
|
|
25
|
+
return r(y, {
|
|
26
|
+
class: "w-5 h-5"
|
|
27
|
+
});
|
|
28
|
+
},
|
|
29
|
+
get children() {
|
|
30
|
+
return r(C, {
|
|
31
|
+
class: "w-5 h-5"
|
|
32
|
+
});
|
|
33
|
+
}
|
|
34
|
+
});
|
|
35
|
+
},
|
|
36
|
+
get children() {
|
|
37
|
+
return r($, {
|
|
38
|
+
class: "w-5 h-5"
|
|
39
|
+
});
|
|
40
|
+
}
|
|
41
|
+
});
|
|
42
|
+
},
|
|
43
|
+
get children() {
|
|
44
|
+
return r(k, {
|
|
45
|
+
class: "w-5 h-5"
|
|
46
|
+
});
|
|
47
|
+
}
|
|
48
|
+
}), T = (e) => {
|
|
49
|
+
const c = () => w[e.type];
|
|
50
|
+
return (() => {
|
|
51
|
+
var i = E(), o = i.firstChild, a = o.firstChild, u = a.nextSibling, d = u.firstChild;
|
|
52
|
+
return n(a, r(l, {
|
|
53
|
+
get when() {
|
|
54
|
+
return e.icon;
|
|
55
|
+
},
|
|
56
|
+
get fallback() {
|
|
57
|
+
return r(L, {
|
|
58
|
+
get type() {
|
|
59
|
+
return e.type;
|
|
60
|
+
}
|
|
61
|
+
});
|
|
62
|
+
},
|
|
63
|
+
get children() {
|
|
64
|
+
return e.icon;
|
|
65
|
+
}
|
|
66
|
+
})), n(u, r(l, {
|
|
67
|
+
get when() {
|
|
68
|
+
return e.title;
|
|
69
|
+
},
|
|
70
|
+
get children() {
|
|
71
|
+
var t = _();
|
|
72
|
+
return n(t, () => e.title), t;
|
|
73
|
+
}
|
|
74
|
+
}), d), n(d, () => e.children), n(o, r(l, {
|
|
75
|
+
get when() {
|
|
76
|
+
return e.onClose;
|
|
77
|
+
},
|
|
78
|
+
get children() {
|
|
79
|
+
var t = I();
|
|
80
|
+
return m(t, "click", e.onClose, !0), n(t, r(b, {
|
|
81
|
+
class: "w-4 h-4"
|
|
82
|
+
})), t;
|
|
83
|
+
}
|
|
84
|
+
}), null), v((t) => {
|
|
85
|
+
var f = `glass-card border-l-4 ${c().border} ${c().bg} p-4 rounded-xl ${e.class ?? ""}`, h = `flex-shrink-0 w-8 h-8 rounded-lg ${c().iconBg} ${c().icon} flex items-center justify-center`;
|
|
86
|
+
return f !== t.e && g(i, t.e = f), h !== t.t && g(a, t.t = h), t;
|
|
87
|
+
}, {
|
|
88
|
+
e: void 0,
|
|
89
|
+
t: void 0
|
|
90
|
+
}), i;
|
|
91
|
+
})();
|
|
92
|
+
};
|
|
93
|
+
x(["click"]);
|
|
94
|
+
export {
|
|
95
|
+
T as Alert
|
|
96
|
+
};
|
|
97
|
+
//# sourceMappingURL=Alert.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Alert.js","sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import { type Component, Show } from 'solid-js';\nimport { ALERT_COLORS } from '../../constants';\nimport {\n CheckIcon,\n CloseIcon,\n ErrorIcon,\n InfoIcon,\n WarningIcon,\n} from '../shared/icons';\nimport type { AlertProps, AlertType } from './types';\n\nconst DefaultIcon: Component<{ type: AlertType }> = (props) => (\n <Show\n when={props.type === 'info'}\n fallback={\n <Show\n when={props.type === 'success'}\n fallback={\n <Show when={props.type === 'warning'} fallback={<ErrorIcon class=\"w-5 h-5\" />}>\n <WarningIcon class=\"w-5 h-5\" />\n </Show>\n }\n >\n <CheckIcon class=\"w-5 h-5\" />\n </Show>\n }\n >\n <InfoIcon class=\"w-5 h-5\" />\n </Show>\n);\n\nexport const Alert: Component<AlertProps> = (props) => {\n const styles = () => ALERT_COLORS[props.type];\n\n return (\n <div\n class={`glass-card border-l-4 ${styles().border} ${styles().bg} p-4 rounded-xl ${props.class ?? ''}`}\n role=\"alert\"\n >\n <div class=\"flex items-start gap-3\">\n {/* Icon */}\n <div\n class={`flex-shrink-0 w-8 h-8 rounded-lg ${styles().iconBg} ${styles().icon} flex items-center justify-center`}\n >\n <Show when={props.icon} fallback={<DefaultIcon type={props.type} />}>\n {props.icon}\n </Show>\n </div>\n\n {/* Content */}\n <div class=\"flex-1 min-w-0\">\n <Show when={props.title}>\n <h3 class=\"text-sm font-semibold text-surface-900 dark:text-surface-100 mb-1\">{props.title}</h3>\n </Show>\n <div class=\"text-sm text-surface-700 dark:text-surface-300\">{props.children}</div>\n </div>\n\n {/* Close button */}\n <Show when={props.onClose}>\n <button\n type=\"button\"\n onClick={props.onClose}\n class=\"flex-shrink-0 p-1.5 rounded-lg text-surface-400 hover:text-surface-600 dark:hover:text-surface-200 hover:bg-black/5 dark:hover:bg-white/5 transition-colors\"\n aria-label=\"Close\"\n >\n <CloseIcon class=\"w-4 h-4\" />\n </button>\n </Show>\n </div>\n </div>\n );\n};\n"],"names":["DefaultIcon","props","_$createComponent","Show","when","type","fallback","ErrorIcon","children","WarningIcon","CheckIcon","InfoIcon","Alert","styles","ALERT_COLORS","_el$","_tmpl$3","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$6","_$insert","icon","title","_el$5","_tmpl$","onClose","_el$7","_tmpl$2","_$addEventListener","CloseIcon","_$effect","_p$","_v$","border","bg","class","_v$2","iconBg","e","_$className","t","undefined","_$delegateEvents"],"mappings":"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"}
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
import { template as h, insert as f, createComponent as $, effect as c, setAttribute as u, className as m } from "solid-js/web";
|
|
2
|
+
import { createSignal as k, createMemo as b, Show as y } from "solid-js";
|
|
3
|
+
var j = /* @__PURE__ */ h('<img class="w-full h-full object-cover">'), z = /* @__PURE__ */ h("<div>"), A = /* @__PURE__ */ h("<div><span>");
|
|
4
|
+
const E = {
|
|
5
|
+
xs: {
|
|
6
|
+
container: "w-6 h-6",
|
|
7
|
+
text: "text-[0.5rem]"
|
|
8
|
+
},
|
|
9
|
+
sm: {
|
|
10
|
+
container: "w-8 h-8",
|
|
11
|
+
text: "text-xs"
|
|
12
|
+
},
|
|
13
|
+
md: {
|
|
14
|
+
container: "w-10 h-10",
|
|
15
|
+
text: "text-sm"
|
|
16
|
+
},
|
|
17
|
+
lg: {
|
|
18
|
+
container: "w-12 h-12",
|
|
19
|
+
text: "text-base"
|
|
20
|
+
},
|
|
21
|
+
xl: {
|
|
22
|
+
container: "w-16 h-16",
|
|
23
|
+
text: "text-lg"
|
|
24
|
+
}
|
|
25
|
+
}, v = ["bg-blue-500", "bg-emerald-500", "bg-violet-500", "bg-amber-500", "bg-rose-500", "bg-cyan-500", "bg-fuchsia-500", "bg-lime-500"], I = (e) => {
|
|
26
|
+
let t = 0;
|
|
27
|
+
for (let a = 0; a < e.length; a++)
|
|
28
|
+
t = e.charCodeAt(a) + ((t << 5) - t);
|
|
29
|
+
const i = Math.abs(t) % v.length;
|
|
30
|
+
return v[i];
|
|
31
|
+
}, S = (e) => {
|
|
32
|
+
const t = e.trim().split(/\s+/);
|
|
33
|
+
return t.length === 1 ? t[0].slice(0, 2).toUpperCase() : (t[0][0] + t[t.length - 1][0]).toUpperCase();
|
|
34
|
+
}, N = (e) => {
|
|
35
|
+
const [t, i] = k(!1), a = () => e.size ?? "md", d = () => E[a()], x = b(() => S(e.name)), w = b(() => e.fallbackColor ?? I(e.name)), C = () => e.src && !t();
|
|
36
|
+
return (() => {
|
|
37
|
+
var o = z();
|
|
38
|
+
return f(o, $(y, {
|
|
39
|
+
get when() {
|
|
40
|
+
return C();
|
|
41
|
+
},
|
|
42
|
+
get fallback() {
|
|
43
|
+
return (() => {
|
|
44
|
+
var r = A(), n = r.firstChild;
|
|
45
|
+
return f(n, x), c((l) => {
|
|
46
|
+
var s = `w-full h-full flex items-center justify-center font-semibold text-white ${w()}`, g = d().text;
|
|
47
|
+
return s !== l.e && m(r, l.e = s), g !== l.t && m(n, l.t = g), l;
|
|
48
|
+
}, {
|
|
49
|
+
e: void 0,
|
|
50
|
+
t: void 0
|
|
51
|
+
}), r;
|
|
52
|
+
})();
|
|
53
|
+
},
|
|
54
|
+
get children() {
|
|
55
|
+
var r = j();
|
|
56
|
+
return r.addEventListener("error", () => i(!0)), c((n) => {
|
|
57
|
+
var l = e.src, s = e.alt ?? e.name;
|
|
58
|
+
return l !== n.e && u(r, "src", n.e = l), s !== n.t && u(r, "alt", n.t = s), n;
|
|
59
|
+
}, {
|
|
60
|
+
e: void 0,
|
|
61
|
+
t: void 0
|
|
62
|
+
}), r;
|
|
63
|
+
}
|
|
64
|
+
})), c(() => m(o, `relative inline-flex items-center justify-center rounded-full overflow-hidden border-2 border-white/30 dark:border-white/10 shadow-sm ${d().container} ${e.class ?? ""}`)), o;
|
|
65
|
+
})();
|
|
66
|
+
};
|
|
67
|
+
export {
|
|
68
|
+
N as Avatar
|
|
69
|
+
};
|
|
70
|
+
//# sourceMappingURL=Avatar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Avatar.js","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import type { Component } from 'solid-js';\nimport { Show, createMemo, createSignal } from 'solid-js';\nimport type { AvatarProps, AvatarSize } from './types';\n\nconst sizeStyles: Record<AvatarSize, { container: string; text: string }> = {\n xs: { container: 'w-6 h-6', text: 'text-[0.5rem]' },\n sm: { container: 'w-8 h-8', text: 'text-xs' },\n md: { container: 'w-10 h-10', text: 'text-sm' },\n lg: { container: 'w-12 h-12', text: 'text-base' },\n xl: { container: 'w-16 h-16', text: 'text-lg' },\n};\n\n// Color palette for fallback backgrounds\nconst fallbackColors = [\n 'bg-blue-500',\n 'bg-emerald-500',\n 'bg-violet-500',\n 'bg-amber-500',\n 'bg-rose-500',\n 'bg-cyan-500',\n 'bg-fuchsia-500',\n 'bg-lime-500',\n];\n\n// Generate a consistent color based on name\nconst getColorFromName = (name: string): string => {\n let hash = 0;\n for (let i = 0; i < name.length; i++) {\n hash = name.charCodeAt(i) + ((hash << 5) - hash);\n }\n const index = Math.abs(hash) % fallbackColors.length;\n return fallbackColors[index];\n};\n\n// Generate initials from name\nconst getInitials = (name: string): string => {\n const parts = name.trim().split(/\\s+/);\n if (parts.length === 1) {\n return parts[0].slice(0, 2).toUpperCase();\n }\n return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();\n};\n\nexport const Avatar: Component<AvatarProps> = (props) => {\n const [imageError, setImageError] = createSignal(false);\n const size = () => props.size ?? 'md';\n const styles = () => sizeStyles[size()];\n\n const initials = createMemo(() => getInitials(props.name));\n const fallbackBg = createMemo(() => props.fallbackColor ?? getColorFromName(props.name));\n\n const showImage = () => props.src && !imageError();\n\n return (\n <div\n class={`relative inline-flex items-center justify-center rounded-full overflow-hidden border-2 border-white/30 dark:border-white/10 shadow-sm ${styles().container} ${props.class ?? ''}`}\n >\n <Show\n when={showImage()}\n fallback={\n <div\n class={`w-full h-full flex items-center justify-center font-semibold text-white ${fallbackBg()}`}\n >\n <span class={styles().text}>{initials()}</span>\n </div>\n }\n >\n <img\n src={props.src}\n alt={props.alt ?? props.name}\n class=\"w-full h-full object-cover\"\n onError={() => setImageError(true)}\n />\n </Show>\n </div>\n );\n};\n"],"names":["sizeStyles","xs","container","text","sm","md","lg","xl","fallbackColors","getColorFromName","name","hash","i","length","charCodeAt","index","Math","abs","getInitials","parts","trim","split","slice","toUpperCase","Avatar","props","imageError","setImageError","createSignal","size","styles","initials","createMemo","fallbackBg","fallbackColor","showImage","src","_el$","_tmpl$2","_$insert","_$createComponent","Show","when","fallback","_el$3","_tmpl$3","_el$4","firstChild","_$effect","_p$","_v$3","_v$4","e","_$className","t","undefined","children","_el$2","_tmpl$","addEventListener","_v$","_v$2","alt","_$setAttribute","class"],"mappings":";;;AAIA,MAAMA,IAAsE;AAAA,EAC1EC,IAAI;AAAA,IAAEC,WAAW;AAAA,IAAWC,MAAM;AAAA,EAAA;AAAA,EAClCC,IAAI;AAAA,IAAEF,WAAW;AAAA,IAAWC,MAAM;AAAA,EAAA;AAAA,EAClCE,IAAI;AAAA,IAAEH,WAAW;AAAA,IAAaC,MAAM;AAAA,EAAA;AAAA,EACpCG,IAAI;AAAA,IAAEJ,WAAW;AAAA,IAAaC,MAAM;AAAA,EAAA;AAAA,EACpCI,IAAI;AAAA,IAAEL,WAAW;AAAA,IAAaC,MAAM;AAAA,EAAA;AACtC,GAGMK,IAAiB,CACrB,eACA,kBACA,iBACA,gBACA,eACA,eACA,kBACA,aAAa,GAITC,IAAmBA,CAACC,MAAyB;AACjD,MAAIC,IAAO;AACX,WAASC,IAAI,GAAGA,IAAIF,EAAKG,QAAQD;AAC/BD,IAAAA,IAAOD,EAAKI,WAAWF,CAAC,MAAMD,KAAQ,KAAKA;AAE7C,QAAMI,IAAQC,KAAKC,IAAIN,CAAI,IAAIH,EAAeK;AAC9C,SAAOL,EAAeO,CAAK;AAC7B,GAGMG,IAAcA,CAACR,MAAyB;AAC5C,QAAMS,IAAQT,EAAKU,KAAAA,EAAOC,MAAM,KAAK;AACrC,SAAIF,EAAMN,WAAW,IACZM,EAAM,CAAC,EAAEG,MAAM,GAAG,CAAC,EAAEC,YAAAA,KAEtBJ,EAAM,CAAC,EAAE,CAAC,IAAIA,EAAMA,EAAMN,SAAS,CAAC,EAAE,CAAC,GAAGU,YAAAA;AACpD,GAEaC,IAAkCC,CAAAA,MAAU;AACvD,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAa,EAAK,GAChDC,IAAOA,MAAMJ,EAAMI,QAAQ,MAC3BC,IAASA,MAAM9B,EAAW6B,GAAM,GAEhCE,IAAWC,EAAW,MAAMd,EAAYO,EAAMf,IAAI,CAAC,GACnDuB,IAAaD,EAAW,MAAMP,EAAMS,iBAAiBzB,EAAiBgB,EAAMf,IAAI,CAAC,GAEjFyB,IAAYA,MAAMV,EAAMW,OAAO,CAACV,EAAAA;AAEtC,UAAA,MAAA;AAAA,QAAAW,IAAAC,EAAAA;AAAAC,WAAAA,EAAAF,GAAAG,EAIKC,GAAI;AAAA,MAAA,IACHC,OAAI;AAAA,eAAEP,EAAAA;AAAAA,MAAW;AAAA,MAAA,IACjBQ,WAAQ;AAAA,gBAAA,MAAA;AAAA,cAAAC,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG;AAAAR,iBAAAA,EAAAO,GAIyBf,CAAQ,GAAAiB,EAAAC,CAAAA,MAAA;AAAA,gBAAAC,IAF9B,2EAA2EjB,EAAAA,CAAY,IAAEkB,IAEnFrB,IAAS3B;AAAI+C,mBAAAA,MAAAD,EAAAG,KAAAC,EAAAT,GAAAK,EAAAG,IAAAF,CAAA,GAAAC,MAAAF,EAAAK,KAAAD,EAAAP,GAAAG,EAAAK,IAAAH,CAAA,GAAAF;AAAAA,UAAA,GAAA;AAAA,YAAAG,GAAAG;AAAAA,YAAAD,GAAAC;AAAAA,UAAAA,CAAA,GAAAX;AAAAA,QAAA,GAAA;AAAA,MAAA;AAAA,MAAA,IAAAY,WAAA;AAAA,YAAAC,IAAAC,EAAAA;AAAAD,eAAAA,EAAAE,iBAAA,SAQnB,MAAMhC,EAAc,EAAI,CAAC,GAAAqB,EAAAC,CAAAA,MAAA;AAAA,cAAAW,IAH7BnC,EAAMW,KAAGyB,IACTpC,EAAMqC,OAAOrC,EAAMf;AAAIkD,iBAAAA,MAAAX,EAAAG,KAAAW,EAAAN,GAAA,OAAAR,EAAAG,IAAAQ,CAAA,GAAAC,MAAAZ,EAAAK,KAAAS,EAAAN,GAAA,OAAAR,EAAAK,IAAAO,CAAA,GAAAZ;AAAAA,QAAA,GAAA;AAAA,UAAAG,GAAAG;AAAAA,UAAAD,GAAAC;AAAAA,QAAAA,CAAA,GAAAE;AAAAA,MAAA;AAAA,IAAA,CAAA,CAAA,GAAAT,QAAAK,EAAAhB,GAdzB,yIAAyIP,EAAAA,EAAS5B,SAAS,IAAIuB,EAAMuC,SAAS,EAAE,EAAE,CAAA,GAAA3B;AAAAA,EAAA,GAAA;AAqB/L;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAQ1C,OAAO,KAAK,EAAE,UAAU,EAA2B,MAAM,SAAS,CAAC;AAiBnE,eAAO,MAAM,KAAK,EAAE,SAAS,CAAC,UAAU,CAoBvC,CAAC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { template as i, insert as l, effect as m, className as c } from "solid-js/web";
|
|
2
|
+
import { HTTP_METHOD_COLORS as d, getFilledClasses as r, SEMANTIC_COLORS_FILLED as f } from "../../constants/colors.js";
|
|
3
|
+
var u = /* @__PURE__ */ i("<span>");
|
|
4
|
+
const x = {
|
|
5
|
+
default: "default",
|
|
6
|
+
success: "success",
|
|
7
|
+
warning: "warning",
|
|
8
|
+
error: "error",
|
|
9
|
+
info: "info"
|
|
10
|
+
}, g = {
|
|
11
|
+
sm: "px-1.5 py-0.5 text-[0.625rem]",
|
|
12
|
+
md: "px-2 py-0.5 text-xs",
|
|
13
|
+
lg: "px-2.5 py-1 text-sm"
|
|
14
|
+
}, _ = (e) => {
|
|
15
|
+
const n = () => e.variant ?? "default", s = () => e.size ?? "md", o = () => {
|
|
16
|
+
if (n() === "method" && e.method) {
|
|
17
|
+
const a = d[e.method];
|
|
18
|
+
return r(a);
|
|
19
|
+
}
|
|
20
|
+
const t = x[n()];
|
|
21
|
+
return r(f[t]);
|
|
22
|
+
};
|
|
23
|
+
return (() => {
|
|
24
|
+
var t = u();
|
|
25
|
+
return l(t, () => e.children), m(() => c(t, `inline-flex items-center font-semibold rounded-md ${g[s()]} ${o()} ${e.class ?? ""}`)), t;
|
|
26
|
+
})();
|
|
27
|
+
};
|
|
28
|
+
export {
|
|
29
|
+
_ as Badge
|
|
30
|
+
};
|
|
31
|
+
//# sourceMappingURL=Badge.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Badge.js","sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import type { Component } from 'solid-js';\nimport {\n SEMANTIC_COLORS_FILLED,\n HTTP_METHOD_COLORS,\n getFilledClasses,\n type SemanticColor,\n type HttpMethodColor,\n} from '../../constants';\nimport type { BadgeProps, BadgeSize, BadgeVariant } from './types';\n\n/** Map badge variants to semantic color keys */\nconst variantToColor: Record<Exclude<BadgeVariant, 'method'>, SemanticColor> = {\n default: 'default',\n success: 'success',\n warning: 'warning',\n error: 'error',\n info: 'info',\n};\n\nconst sizeStyles: Record<BadgeSize, string> = {\n sm: 'px-1.5 py-0.5 text-[0.625rem]',\n md: 'px-2 py-0.5 text-xs',\n lg: 'px-2.5 py-1 text-sm',\n};\n\nexport const Badge: Component<BadgeProps> = (props) => {\n const variant = () => props.variant ?? 'default';\n const size = () => props.size ?? 'md';\n\n const getVariantStyle = () => {\n if (variant() === 'method' && props.method) {\n const methodColor = HTTP_METHOD_COLORS[props.method as HttpMethodColor];\n return getFilledClasses(methodColor);\n }\n const colorKey = variantToColor[variant() as Exclude<BadgeVariant, 'method'>];\n return getFilledClasses(SEMANTIC_COLORS_FILLED[colorKey]);\n };\n\n return (\n <span\n class={`inline-flex items-center font-semibold rounded-md ${sizeStyles[size()]} ${getVariantStyle()} ${props.class ?? ''}`}\n >\n {props.children}\n </span>\n );\n};\n"],"names":["variantToColor","default","success","warning","error","info","sizeStyles","sm","md","lg","Badge","props","variant","size","getVariantStyle","method","methodColor","HTTP_METHOD_COLORS","getFilledClasses","colorKey","SEMANTIC_COLORS_FILLED","_el$","_tmpl$","_$insert","children","_$effect","_$className","class"],"mappings":";;;AAWA,MAAMA,IAAyE;AAAA,EAC7EC,SAAS;AAAA,EACTC,SAAS;AAAA,EACTC,SAAS;AAAA,EACTC,OAAO;AAAA,EACPC,MAAM;AACR,GAEMC,IAAwC;AAAA,EAC5CC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,IAAI;AACN,GAEaC,IAAgCC,CAAAA,MAAU;AACrD,QAAMC,IAAUA,MAAMD,EAAMC,WAAW,WACjCC,IAAOA,MAAMF,EAAME,QAAQ,MAE3BC,IAAkBA,MAAM;AAC5B,QAAIF,EAAAA,MAAc,YAAYD,EAAMI,QAAQ;AAC1C,YAAMC,IAAcC,EAAmBN,EAAMI,MAAyB;AACtE,aAAOG,EAAiBF,CAAW;AAAA,IACrC;AACA,UAAMG,IAAWnB,EAAeY,GAA4C;AAC5E,WAAOM,EAAiBE,EAAuBD,CAAQ,CAAC;AAAA,EAC1D;AAEA,UAAA,MAAA;AAAA,QAAAE,IAAAC,EAAAA;AAAAC,WAAAA,EAAAF,GAAA,MAIKV,EAAMa,QAAQ,GAAAC,EAAA,MAAAC,EAAAL,GAFR,qDAAqDf,EAAWO,GAAM,CAAC,IAAIC,EAAAA,CAAiB,IAAIH,EAAMgB,SAAS,EAAE,EAAE,CAAA,GAAAN;AAAAA,EAAA,GAAA;AAKhI;"}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import { template as a, insert as r, createComponent as l, effect as i, className as $, setAttribute as d, addEventListener as h, delegateEvents as p } from "solid-js/web";
|
|
2
|
+
import { For as _, Show as o } from "solid-js";
|
|
3
|
+
var v = /* @__PURE__ */ a('<span class="mx-2 text-surface-400 dark:text-surface-600"aria-hidden=true>/'), k = /* @__PURE__ */ a('<span class="w-4 h-4 mr-1.5 flex items-center justify-center">'), g = /* @__PURE__ */ a("<span>"), b = /* @__PURE__ */ a('<span class="flex items-center text-sm font-medium text-surface-900 dark:text-surface-100"aria-current=page>'), C = /* @__PURE__ */ a('<a class="flex items-center text-sm text-surface-500 dark:text-surface-400 hover:text-surface-700 dark:hover:text-surface-200 transition-colors">'), w = /* @__PURE__ */ a('<button type=button class="flex items-center text-sm text-surface-500 dark:text-surface-400 hover:text-surface-700 dark:hover:text-surface-200 transition-colors">'), y = /* @__PURE__ */ a('<span class="flex items-center text-sm text-surface-500 dark:text-surface-400">'), B = /* @__PURE__ */ a('<nav aria-label=Breadcrumb><ol class="flex items-center">'), D = /* @__PURE__ */ a('<li class="flex items-center">');
|
|
4
|
+
const E = () => v(), j = (s) => {
|
|
5
|
+
const f = (t) => t === s.items.length - 1, m = (t, c) => {
|
|
6
|
+
const u = f(c), n = [l(o, {
|
|
7
|
+
get when() {
|
|
8
|
+
return t.icon;
|
|
9
|
+
},
|
|
10
|
+
get children() {
|
|
11
|
+
var e = k();
|
|
12
|
+
return r(e, () => t.icon), e;
|
|
13
|
+
}
|
|
14
|
+
}), (() => {
|
|
15
|
+
var e = g();
|
|
16
|
+
return r(e, () => t.label), e;
|
|
17
|
+
})()];
|
|
18
|
+
return u ? (() => {
|
|
19
|
+
var e = b();
|
|
20
|
+
return r(e, n), e;
|
|
21
|
+
})() : t.href ? (() => {
|
|
22
|
+
var e = C();
|
|
23
|
+
return e.$$click = (x) => {
|
|
24
|
+
t.onClick && (x.preventDefault(), t.onClick());
|
|
25
|
+
}, r(e, n), i(() => d(e, "href", t.href)), e;
|
|
26
|
+
})() : t.onClick ? (() => {
|
|
27
|
+
var e = w();
|
|
28
|
+
return h(e, "click", t.onClick, !0), r(e, n), e;
|
|
29
|
+
})() : (() => {
|
|
30
|
+
var e = y();
|
|
31
|
+
return r(e, n), e;
|
|
32
|
+
})();
|
|
33
|
+
};
|
|
34
|
+
return (() => {
|
|
35
|
+
var t = B(), c = t.firstChild;
|
|
36
|
+
return r(c, l(_, {
|
|
37
|
+
get each() {
|
|
38
|
+
return s.items;
|
|
39
|
+
},
|
|
40
|
+
children: (u, n) => (() => {
|
|
41
|
+
var e = D();
|
|
42
|
+
return r(e, () => m(u, n()), null), r(e, l(o, {
|
|
43
|
+
get when() {
|
|
44
|
+
return !f(n());
|
|
45
|
+
},
|
|
46
|
+
get children() {
|
|
47
|
+
return s.separator ?? l(E, {});
|
|
48
|
+
}
|
|
49
|
+
}), null), e;
|
|
50
|
+
})()
|
|
51
|
+
})), i(() => $(t, `flex items-center ${s.class ?? ""}`)), t;
|
|
52
|
+
})();
|
|
53
|
+
};
|
|
54
|
+
p(["click"]);
|
|
55
|
+
export {
|
|
56
|
+
j as Breadcrumb
|
|
57
|
+
};
|
|
58
|
+
//# sourceMappingURL=Breadcrumb.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Breadcrumb.js","sources":["../../../src/components/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import { type Component, For, Show } from 'solid-js';\nimport type { BreadcrumbItem, BreadcrumbProps } from './types';\n\nconst DefaultSeparator: Component = () => (\n <span class=\"mx-2 text-surface-400 dark:text-surface-600\" aria-hidden=\"true\">\n /\n </span>\n);\n\nexport const Breadcrumb: Component<BreadcrumbProps> = (props) => {\n const isLast = (index: number) => index === props.items.length - 1;\n\n const renderItem = (item: BreadcrumbItem, index: number) => {\n const isCurrentPage = isLast(index);\n\n const content = (\n <>\n <Show when={item.icon}>\n <span class=\"w-4 h-4 mr-1.5 flex items-center justify-center\">{item.icon}</span>\n </Show>\n <span>{item.label}</span>\n </>\n );\n\n if (isCurrentPage) {\n // Current page (last item) - not clickable\n return (\n <span\n class=\"flex items-center text-sm font-medium text-surface-900 dark:text-surface-100\"\n aria-current=\"page\"\n >\n {content}\n </span>\n );\n }\n\n if (item.href) {\n return (\n <a\n href={item.href}\n class=\"flex items-center text-sm text-surface-500 dark:text-surface-400 hover:text-surface-700 dark:hover:text-surface-200 transition-colors\"\n onClick={(e) => {\n if (item.onClick) {\n e.preventDefault();\n item.onClick();\n }\n }}\n >\n {content}\n </a>\n );\n }\n\n if (item.onClick) {\n return (\n <button\n type=\"button\"\n onClick={item.onClick}\n class=\"flex items-center text-sm text-surface-500 dark:text-surface-400 hover:text-surface-700 dark:hover:text-surface-200 transition-colors\"\n >\n {content}\n </button>\n );\n }\n\n // Non-clickable item\n return (\n <span class=\"flex items-center text-sm text-surface-500 dark:text-surface-400\">{content}</span>\n );\n };\n\n return (\n <nav class={`flex items-center ${props.class ?? ''}`} aria-label=\"Breadcrumb\">\n <ol class=\"flex items-center\">\n <For each={props.items}>\n {(item, index) => (\n <li class=\"flex items-center\">\n {renderItem(item, index())}\n <Show when={!isLast(index())}>{props.separator ?? <DefaultSeparator />}</Show>\n </li>\n )}\n </For>\n </ol>\n </nav>\n );\n};\n"],"names":["DefaultSeparator","_tmpl$","Breadcrumb","props","isLast","index","items","length","renderItem","item","isCurrentPage","content","_$createComponent","Show","when","icon","children","_el$2","_tmpl$2","_$insert","_el$3","_tmpl$3","label","_el$4","_tmpl$4","href","_el$5","_tmpl$5","$$click","e","onClick","preventDefault","_$effect","_$setAttribute","_el$6","_tmpl$6","_$addEventListener","_el$7","_tmpl$7","_el$8","_tmpl$8","_el$9","firstChild","For","each","_el$0","_tmpl$9","separator","_$className","class","_$delegateEvents"],"mappings":";;;AAGA,MAAMA,IAA8BA,MAAAC,EAAAA,GAMvBC,IAA0CC,CAAAA,MAAU;AAC/D,QAAMC,IAASA,CAACC,MAAkBA,MAAUF,EAAMG,MAAMC,SAAS,GAE3DC,IAAaA,CAACC,GAAsBJ,MAAkB;AAC1D,UAAMK,IAAgBN,EAAOC,CAAK,GAE5BM,IAAO,CAAAC,EAERC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEL,EAAKM;AAAAA,MAAI;AAAA,MAAA,IAAAC,WAAA;AAAA,YAAAC,IAAAC,EAAAA;AAAAC,eAAAA,EAAAF,GAAA,MAC4CR,EAAKM,IAAI,GAAAE;AAAAA,MAAA;AAAA,IAAA,CAAA,IAAA,MAAA;AAAA,UAAAG,IAAAC,EAAAA;AAAAF,aAAAA,EAAAC,GAAA,MAEnEX,EAAKa,KAAK,GAAAF;AAAAA,IAAA,IAAA;AAIrB,WAAIV,KAEF,MAAA;AAAA,UAAAa,IAAAC,EAAAA;AAAAL,aAAAA,EAAAI,GAKKZ,CAAO,GAAAY;AAAAA,IAAA,GAAA,IAKVd,EAAKgB,QACP,MAAA;AAAA,UAAAC,IAAAC,EAAAA;AAAAD,aAAAA,EAAAE,UAIcC,CAAAA,MAAM;AACd,QAAIpB,EAAKqB,YACPD,EAAEE,eAAAA,GACFtB,EAAKqB,QAAAA;AAAAA,MAET,GAACX,EAAAO,GAEAf,CAAO,GAAAqB,QAAAC,EAAAP,GAAA,QATFjB,EAAKgB,IAAI,CAAA,GAAAC;AAAAA,IAAA,GAAA,IAcjBjB,EAAKqB,WACP,MAAA;AAAA,UAAAI,IAAAC,EAAAA;AAAAC,aAAAA,EAAAF,GAAA,SAGazB,EAAKqB,SAAO,EAAA,GAAAX,EAAAe,GAGpBvB,CAAO,GAAAuB;AAAAA,IAAA,GAAA,KAMd,MAAA;AAAA,UAAAG,IAAAC,EAAAA;AAAAnB,aAAAA,EAAAkB,GACkF1B,CAAO,GAAA0B;AAAAA,IAAA,GAAA;AAAA,EAE3F;AAEA,UAAA,MAAA;AAAA,QAAAE,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG;AAAAvB,WAAAA,EAAAsB,GAAA7B,EAGO+B,GAAG;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEzC,EAAMG;AAAAA,MAAK;AAAA,MAAAU,UACnBA,CAACP,GAAMJ,OAAK,MAAA;AAAA,YAAAwC,IAAAC,EAAAA;AAAA3B,eAAAA,EAAA0B,GAAA,MAERrC,EAAWC,GAAMJ,EAAAA,CAAO,GAAC,IAAA,GAAAc,EAAA0B,GAAAjC,EACzBC,GAAI;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAE,CAACV,EAAOC,GAAO;AAAA,UAAC;AAAA,UAAA,IAAAW,WAAA;AAAA,mBAAGb,EAAM4C,aAASnC,EAAKZ,GAAgB,CAAA,CAAA;AAAA,UAAG;AAAA,QAAA,CAAA,GAAA,IAAA,GAAA6C;AAAAA,MAAA,GAAA;AAAA,IAAA,CAEzE,CAAA,GAAAb,EAAA,MAAAgB,EAAAT,GARK,qBAAqBpC,EAAM8C,SAAS,EAAE,EAAE,CAAA,GAAAV;AAAAA,EAAA,GAAA;AAaxD;AAAEW,EAAA,CAAA,OAAA,CAAA;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAG1C,OAAO,KAAK,EAAE,WAAW,EAA6B,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAG1C,OAAO,KAAK,EAAE,WAAW,EAA6B,MAAM,SAAS,CAAC;AAiBtE,eAAO,MAAM,MAAM,EAAE,SAAS,CAAC,WAAW,CAmBzC,CAAC"}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import { template as s, addEventListener as g, insert as r, createComponent as i, memo as m, effect as v, setAttribute as f, className as h, delegateEvents as y } from "solid-js/web";
|
|
2
|
+
import { Show as a } from "solid-js";
|
|
3
|
+
import { Spinner as b } from "./Spinner.js";
|
|
4
|
+
var x = /* @__PURE__ */ s("<button>");
|
|
5
|
+
const w = {
|
|
6
|
+
primary: "btn-primary",
|
|
7
|
+
secondary: "btn-secondary",
|
|
8
|
+
tertiary: "btn-tertiary",
|
|
9
|
+
ghost: "btn-ghost",
|
|
10
|
+
danger: "btn-danger"
|
|
11
|
+
}, z = {
|
|
12
|
+
sm: "!px-2.5 !py-1.5 !text-xs gap-1.5",
|
|
13
|
+
md: "!px-5 !py-2.5 !text-sm gap-2",
|
|
14
|
+
lg: "!px-6 !py-3 !text-base gap-2.5"
|
|
15
|
+
}, $ = (t) => {
|
|
16
|
+
const o = () => t.variant ?? "primary", l = () => t.size ?? "md";
|
|
17
|
+
return (() => {
|
|
18
|
+
var e = x();
|
|
19
|
+
return g(e, "click", t.onClick, !0), r(e, i(a, {
|
|
20
|
+
get when() {
|
|
21
|
+
return t.loading;
|
|
22
|
+
},
|
|
23
|
+
get children() {
|
|
24
|
+
return i(b, {
|
|
25
|
+
get size() {
|
|
26
|
+
return l();
|
|
27
|
+
}
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
}), null), r(e, i(a, {
|
|
31
|
+
get when() {
|
|
32
|
+
return m(() => !t.loading)() && t.leftIcon;
|
|
33
|
+
},
|
|
34
|
+
get children() {
|
|
35
|
+
return t.leftIcon;
|
|
36
|
+
}
|
|
37
|
+
}), null), r(e, () => t.children, null), r(e, i(a, {
|
|
38
|
+
get when() {
|
|
39
|
+
return t.rightIcon;
|
|
40
|
+
},
|
|
41
|
+
get children() {
|
|
42
|
+
return t.rightIcon;
|
|
43
|
+
}
|
|
44
|
+
}), null), v((n) => {
|
|
45
|
+
var c = t.type ?? "button", u = `${w[o()]} ${z[l()]} inline-flex items-center justify-center focus:outline-none focus-ring ${t.fullWidth ? "w-full" : ""} ${t.class ?? ""}`, d = t.disabled || t.loading;
|
|
46
|
+
return c !== n.e && f(e, "type", n.e = c), u !== n.t && h(e, n.t = u), d !== n.a && (e.disabled = n.a = d), n;
|
|
47
|
+
}, {
|
|
48
|
+
e: void 0,
|
|
49
|
+
t: void 0,
|
|
50
|
+
a: void 0
|
|
51
|
+
}), e;
|
|
52
|
+
})();
|
|
53
|
+
};
|
|
54
|
+
y(["click"]);
|
|
55
|
+
export {
|
|
56
|
+
$ as Button
|
|
57
|
+
};
|
|
58
|
+
//# sourceMappingURL=Button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import type { Component } from 'solid-js';\nimport { Show } from 'solid-js';\nimport { Spinner } from './Spinner';\nimport type { ButtonProps, ButtonSize, ButtonVariant } from './types';\n\nconst variantClasses: Record<ButtonVariant, string> = {\n primary: 'btn-primary',\n secondary: 'btn-secondary',\n tertiary: 'btn-tertiary',\n ghost: 'btn-ghost',\n danger: 'btn-danger',\n};\n\n// Size classes with !important to override .btn-* CSS padding\nconst sizeClasses: Record<ButtonSize, string> = {\n sm: '!px-2.5 !py-1.5 !text-xs gap-1.5',\n md: '!px-5 !py-2.5 !text-sm gap-2',\n lg: '!px-6 !py-3 !text-base gap-2.5',\n};\n\nexport const Button: Component<ButtonProps> = (props) => {\n const variant = () => props.variant ?? 'primary';\n const size = () => props.size ?? 'md';\n\n return (\n <button\n type={props.type ?? 'button'}\n class={`${variantClasses[variant()]} ${sizeClasses[size()]} inline-flex items-center justify-center focus:outline-none focus-ring ${props.fullWidth ? 'w-full' : ''} ${props.class ?? ''}`}\n onClick={props.onClick}\n disabled={props.disabled || props.loading}\n >\n <Show when={props.loading}>\n <Spinner size={size()} />\n </Show>\n <Show when={!props.loading && props.leftIcon}>{props.leftIcon}</Show>\n {props.children}\n <Show when={props.rightIcon}>{props.rightIcon}</Show>\n </button>\n );\n};\n"],"names":["variantClasses","primary","secondary","tertiary","ghost","danger","sizeClasses","sm","md","lg","Button","props","variant","size","_el$","_tmpl$","_$addEventListener","onClick","_$insert","_$createComponent","Show","when","loading","children","Spinner","_$memo","leftIcon","rightIcon","_$effect","_p$","_v$","type","_v$2","fullWidth","class","_v$3","disabled","e","_$setAttribute","t","_$className","a","undefined","_$delegateEvents"],"mappings":";;;;AAKA,MAAMA,IAAgD;AAAA,EACpDC,SAAS;AAAA,EACTC,WAAW;AAAA,EACXC,UAAU;AAAA,EACVC,OAAO;AAAA,EACPC,QAAQ;AACV,GAGMC,IAA0C;AAAA,EAC9CC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,IAAI;AACN,GAEaC,IAAkCC,CAAAA,MAAU;AACvD,QAAMC,IAAUA,MAAMD,EAAMC,WAAW,WACjCC,IAAOA,MAAMF,EAAME,QAAQ;AAEjC,UAAA,MAAA;AAAA,QAAAC,IAAAC,EAAAA;AAAAC,WAAAA,EAAAF,GAAA,SAIaH,EAAMM,SAAO,EAAA,GAAAC,EAAAJ,GAAAK,EAGrBC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEV,EAAMW;AAAAA,MAAO;AAAA,MAAA,IAAAC,WAAA;AAAA,eAAAJ,EACtBK,GAAO;AAAA,UAAA,IAACX,OAAI;AAAA,mBAAEA,EAAAA;AAAAA,UAAM;AAAA,QAAA,CAAA;AAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAK,EAAAJ,GAAAK,EAEtBC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEI,SAACd,EAAMW,OAAO,EAAA,KAAIX,EAAMe;AAAAA,MAAQ;AAAA,MAAA,IAAAH,WAAA;AAAA,eAAGZ,EAAMe;AAAAA,MAAQ;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAR,EAAAJ,GAAA,MAC5DH,EAAMY,UAAQ,IAAA,GAAAL,EAAAJ,GAAAK,EACdC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEV,EAAMgB;AAAAA,MAAS;AAAA,MAAA,IAAAJ,WAAA;AAAA,eAAGZ,EAAMgB;AAAAA,MAAS;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAC,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IAVvCnB,EAAMoB,QAAQ,UAAQC,IACrB,GAAGhC,EAAeY,EAAAA,CAAS,CAAC,IAAIN,EAAYO,EAAAA,CAAM,CAAC,0EAA0EF,EAAMsB,YAAY,WAAW,EAAE,IAAItB,EAAMuB,SAAS,EAAE,IAAEC,IAEhLxB,EAAMyB,YAAYzB,EAAMW;AAAOQ,aAAAA,MAAAD,EAAAQ,KAAAC,EAAAxB,GAAA,QAAAe,EAAAQ,IAAAP,CAAA,GAAAE,MAAAH,EAAAU,KAAAC,EAAA1B,GAAAe,EAAAU,IAAAP,CAAA,GAAAG,MAAAN,EAAAY,MAAA3B,EAAAsB,WAAAP,EAAAY,IAAAN,IAAAN;AAAAA,IAAA,GAAA;AAAA,MAAAQ,GAAAK;AAAAA,MAAAH,GAAAG;AAAAA,MAAAD,GAAAC;AAAAA,IAAAA,CAAA,GAAA5B;AAAAA,EAAA,GAAA;AAU/C;AAAE6B,EAAA,CAAA,OAAA,CAAA;"}
|