@opencode-ai/ui 0.0.0-dev-202609071625 → 0.0.0-dev-19265
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/dist/actions/button/button.d.ts +10 -0
- package/dist/actions/icon-button/icon-button.d.ts +11 -0
- package/dist/actions/split-button/split-button.d.ts +5 -0
- package/dist/components/card.d.ts +1 -1
- package/dist/components/list.d.ts +1 -1
- package/dist/components/scroll-view.d.ts +14 -4
- package/dist/context/i18n.d.ts +10 -7
- package/dist/context/marked-base.d.ts +3 -0
- package/dist/context/marked-parser.d.ts +1 -2
- package/dist/{components → data-display/accordion}/accordion.d.ts +6 -6
- package/dist/{v2/components/avatar-v2.d.ts → data-display/avatar/avatar.d.ts} +1 -1
- package/dist/data-display/badge/badge.d.ts +7 -0
- package/dist/{components → data-display/diff-changes}/diff-changes.d.ts +2 -1
- package/dist/data-display/keybind/keybind.d.ts +7 -0
- package/dist/{v2/components/line-comment-v2.d.ts → data-display/line-comment/line-comment.d.ts} +9 -9
- package/dist/{v2/components/project-avatar-v2.d.ts → data-display/project-avatar/project-avatar.d.ts} +1 -1
- package/dist/feedback/loader/loader.d.ts +3 -0
- package/dist/{components → feedback/progress-circle}/progress-circle.d.ts +2 -0
- package/dist/feedback/toast/toast.d.ts +57 -0
- package/dist/{components → forms/checkbox}/checkbox.d.ts +2 -2
- package/dist/{v2/components/field-v2.d.ts → forms/field/field.d.ts} +4 -10
- package/dist/forms/radio/radio.d.ts +16 -0
- package/dist/{v2/components/select-v2.d.ts → forms/select/select.d.ts} +5 -6
- package/dist/{components → forms/switch}/switch.d.ts +4 -2
- package/dist/{v2/components/text-input-v2.d.ts → forms/text-input/text-input.d.ts} +3 -3
- package/dist/forms/textarea/textarea.d.ts +7 -0
- package/dist/hooks/use-filtered-list.d.ts +9 -0
- package/dist/i18n/ar.d.ts +0 -2
- package/dist/i18n/bg.d.ts +0 -2
- package/dist/i18n/br.d.ts +0 -2
- package/dist/i18n/bs.d.ts +0 -2
- package/dist/i18n/da.d.ts +0 -2
- package/dist/i18n/de.d.ts +0 -2
- package/dist/i18n/en.d.ts +244 -1
- package/dist/i18n/es.d.ts +0 -2
- package/dist/i18n/fr.d.ts +0 -2
- package/dist/i18n/he.d.ts +197 -0
- package/dist/i18n/ja.d.ts +0 -2
- package/dist/i18n/km.d.ts +0 -2
- package/dist/i18n/ko.d.ts +0 -2
- package/dist/i18n/lo.d.ts +0 -2
- package/dist/i18n/mk.d.ts +0 -2
- package/dist/i18n/mn.d.ts +0 -2
- package/dist/i18n/my.d.ts +0 -2
- package/dist/i18n/pl.d.ts +0 -2
- package/dist/i18n/ru.d.ts +0 -2
- package/dist/i18n/sr.d.ts +0 -2
- package/dist/i18n/tg.d.ts +0 -2
- package/dist/i18n/th.d.ts +0 -2
- package/dist/i18n/tr.d.ts +0 -2
- package/dist/i18n/zh.d.ts +0 -2
- package/dist/i18n/zht.d.ts +0 -2
- package/dist/{components/icon.d.ts → icons/icon/additional-icons.d.ts} +8 -8
- package/dist/{v2/components → icons/icon}/icon.d.ts +60 -1
- package/dist/layout/divider/divider.d.ts +5 -0
- package/dist/navigation/menu/menu.d.ts +59 -0
- package/dist/{v2/components/segmented-control-v2.d.ts → navigation/segmented-control/segmented-control.d.ts} +5 -5
- package/dist/{components → navigation/tabs}/tabs.d.ts +15 -8
- package/dist/{v2/components/dialog-v2.d.ts → overlays/dialog/dialog.d.ts} +1 -2
- package/dist/overlays/tooltip/tooltip.d.ts +15 -0
- package/dist/{components → typography/text-shimmer}/text-shimmer.d.ts +1 -0
- package/dist/typography/wordmark/wordmark.d.ts +5 -0
- package/package.json +141 -35
- package/src/{v2/components/button-v2.css → actions/button/button.css} +30 -0
- package/src/{components → actions/button}/button.tsx +19 -11
- package/src/{v2/components/icon-button-v2.css → actions/icon-button/icon-button.css} +27 -9
- package/src/actions/icon-button/icon-button.tsx +32 -0
- package/src/{v2/components/split-button-v2.css → actions/split-button/split-button.css} +2 -6
- package/src/{v2/components/split-button-v2.tsx → actions/split-button/split-button.tsx} +4 -4
- package/src/components/animated-number.css +29 -11
- package/src/components/animated-number.tsx +2 -2
- package/src/components/card.css +2 -23
- package/src/components/card.tsx +4 -4
- package/src/components/collapsible.tsx +2 -2
- package/src/components/dock-surface.css +2 -9
- package/src/components/image-preview.tsx +3 -2
- package/src/components/list.css +5 -5
- package/src/components/list.tsx +7 -5
- package/src/components/popover.tsx +3 -2
- package/src/components/scroll-view.css +36 -4
- package/src/components/scroll-view.tsx +153 -88
- package/src/components/sticky-accordion-header.tsx +1 -1
- package/src/components/text-field.tsx +12 -4
- package/src/context/dialog.tsx +1 -0
- package/src/context/i18n.tsx +17 -14
- package/src/context/marked-base.tsx +27 -0
- package/src/context/marked-parser.tsx +3 -13
- package/src/{components → data-display/accordion}/accordion.css +7 -33
- package/src/{components → data-display/accordion}/accordion.tsx +14 -14
- package/src/{v2/components/avatar-v2.tsx → data-display/avatar/avatar.tsx} +1 -1
- package/src/{v2/components/badge-v2.css → data-display/badge/badge.css} +19 -0
- package/src/{v2/components/badge-v2.tsx → data-display/badge/badge.tsx} +6 -4
- package/src/{components → data-display/diff-changes}/diff-changes.css +22 -19
- package/src/{v2/components/diff-changes-v2.tsx → data-display/diff-changes/diff-changes.tsx} +7 -2
- package/src/{v2/components/keybind-v2.css → data-display/keybind/keybind.css} +1 -1
- package/src/{v2/components/keybind-v2.tsx → data-display/keybind/keybind.tsx} +3 -3
- package/src/{v2/components/line-comment-v2.css → data-display/line-comment/line-comment.css} +4 -4
- package/src/{v2/components/line-comment-v2.tsx → data-display/line-comment/line-comment.tsx} +17 -15
- package/src/{v2/components/project-avatar-v2.css → data-display/project-avatar/project-avatar.css} +4 -4
- package/src/{v2/components/project-avatar-v2.tsx → data-display/project-avatar/project-avatar.tsx} +1 -1
- package/src/{v2/components/loader-v2.tsx → feedback/loader/loader.tsx} +2 -2
- package/src/feedback/progress-circle/progress-circle.css +28 -0
- package/src/feedback/progress-circle/progress-circle.tsx +64 -0
- package/src/{v2/components/toast-v2.tsx → feedback/toast/toast.tsx} +60 -58
- package/src/{components → forms/checkbox}/checkbox.css +1 -7
- package/src/{components → forms/checkbox}/checkbox.tsx +13 -13
- package/src/{v2/components/field-v2.css → forms/field/field.css} +1 -1
- package/src/{v2/components/field-v2.tsx → forms/field/field.tsx} +9 -11
- package/src/{v2/components/radio-v2.tsx → forms/radio/radio.tsx} +30 -20
- package/src/{v2/components/select-v2.css → forms/select/select.css} +2 -8
- package/src/{v2/components/select-v2.tsx → forms/select/select.tsx} +42 -32
- package/src/{v2/components/switch-v2.css → forms/switch/switch.css} +110 -0
- package/src/forms/switch/switch.tsx +34 -0
- package/src/{v2/components/text-input-v2.css → forms/text-input/text-input.css} +3 -3
- package/src/{v2/components/text-input-v2.tsx → forms/text-input/text-input.tsx} +4 -4
- package/src/{v2/components/textarea-v2.tsx → forms/textarea/textarea.tsx} +3 -3
- package/src/hooks/create-auto-scroll.tsx +20 -0
- package/src/i18n/am.ts +7 -9
- package/src/i18n/ar.ts +7 -9
- package/src/i18n/az.ts +7 -9
- package/src/i18n/bg.ts +7 -9
- package/src/i18n/bn.ts +7 -9
- package/src/i18n/br.ts +7 -9
- package/src/i18n/bs.ts +7 -9
- package/src/i18n/ca.ts +7 -9
- package/src/i18n/cs.ts +7 -9
- package/src/i18n/da.ts +7 -9
- package/src/i18n/de.ts +1 -3
- package/src/i18n/dv.ts +7 -9
- package/src/i18n/dz.ts +5 -7
- package/src/i18n/el.ts +7 -9
- package/src/i18n/en.ts +61 -12
- package/src/i18n/es.ts +6 -8
- package/src/i18n/et.ts +7 -9
- package/src/i18n/fa.ts +7 -9
- package/src/i18n/fi.ts +7 -9
- package/src/i18n/fo.ts +7 -9
- package/src/i18n/fr.ts +6 -8
- package/src/i18n/he.ts +199 -0
- package/src/i18n/hi.ts +7 -9
- package/src/i18n/hr.ts +7 -9
- package/src/i18n/hu.ts +7 -9
- package/src/i18n/hy.ts +7 -9
- package/src/i18n/id.ts +7 -9
- package/src/i18n/is.ts +7 -9
- package/src/i18n/it.ts +7 -9
- package/src/i18n/ja.ts +7 -9
- package/src/i18n/ka.ts +7 -9
- package/src/i18n/km.ts +7 -9
- package/src/i18n/ko.ts +7 -9
- package/src/i18n/lo.ts +7 -9
- package/src/i18n/lt.ts +7 -9
- package/src/i18n/lv.ts +7 -9
- package/src/i18n/mk.ts +7 -9
- package/src/i18n/mn.ts +7 -9
- package/src/i18n/ms.ts +7 -9
- package/src/i18n/my.ts +7 -9
- package/src/i18n/ne.ts +7 -9
- package/src/i18n/nl.ts +7 -9
- package/src/i18n/no.ts +7 -9
- package/src/i18n/pa.ts +7 -9
- package/src/i18n/pl.ts +7 -9
- package/src/i18n/ro.ts +7 -9
- package/src/i18n/ru.ts +7 -9
- package/src/i18n/si.ts +7 -9
- package/src/i18n/sk.ts +7 -9
- package/src/i18n/sl.ts +7 -9
- package/src/i18n/sq.ts +7 -9
- package/src/i18n/sr.ts +7 -9
- package/src/i18n/sv.ts +7 -9
- package/src/i18n/tg.ts +7 -9
- package/src/i18n/th.ts +7 -9
- package/src/i18n/tk.ts +7 -9
- package/src/i18n/tr.ts +7 -9
- package/src/i18n/uk.ts +7 -9
- package/src/i18n/ur.ts +7 -9
- package/src/i18n/uz.ts +7 -9
- package/src/i18n/vi.ts +7 -9
- package/src/i18n/zh.ts +7 -9
- package/src/i18n/zht.ts +7 -9
- package/src/{components/icon.tsx → icons/icon/additional-icons.ts} +9 -75
- package/src/icons/icon/icon.css +3 -0
- package/src/{v2/components → icons/icon}/icon.tsx +96 -12
- package/src/{v2/components/divider-v2.tsx → layout/divider/divider.tsx} +3 -3
- package/src/{v2/components/menu-v2.css → navigation/menu/menu.css} +124 -2
- package/src/{v2/components/menu-v2.tsx → navigation/menu/menu.tsx} +96 -32
- package/src/{v2/components/segmented-control-v2.css → navigation/segmented-control/segmented-control.css} +1 -1
- package/src/{v2/components/segmented-control-v2.tsx → navigation/segmented-control/segmented-control.tsx} +9 -8
- package/src/{v2/components/tabs-v2.css → navigation/tabs/tabs-current.css} +25 -10
- package/src/{components → navigation/tabs}/tabs.css +53 -232
- package/src/navigation/tabs/tabs.tsx +194 -0
- package/src/{v2/components/dialog-v2.css → overlays/dialog/dialog.css} +3 -0
- package/src/{v2/components/dialog-v2.tsx → overlays/dialog/dialog.tsx} +11 -13
- package/src/{v2/components/tooltip-v2.css → overlays/tooltip/tooltip.css} +33 -0
- package/src/{v2/components/tooltip-v2.tsx → overlays/tooltip/tooltip.tsx} +24 -17
- package/src/styles/base.css +5 -0
- package/src/{v2/components/file-tree-v2.css → styles/file-tree.css} +64 -3
- package/src/styles/index.css +4 -20
- package/src/styles/tailwind/colors.css +2 -0
- package/src/styles/tailwind/index.css +18 -1
- package/src/styles/theme.css +2 -2
- package/src/{v2/styles → styles/tokens}/colors.css +8 -8
- package/src/{v2/styles → styles/tokens}/theme.css +23 -16
- package/src/theme/context.tsx +19 -11
- package/src/theme/themes/oc-2.json +50 -19
- package/src/theme/v2/default-primitives.ts +8 -8
- package/src/theme/v2/foreground.ts +1 -0
- package/src/theme/v2/mapping.ts +7 -1
- package/src/{components → typography/text-shimmer}/text-shimmer.css +2 -1
- package/src/{components → typography/text-shimmer}/text-shimmer.tsx +1 -0
- package/src/typography/wordmark/wordmark.tsx +39 -0
- package/dist/components/avatar.d.ts +0 -9
- package/dist/components/button.d.ts +0 -9
- package/dist/components/dialog.d.ts +0 -12
- package/dist/components/dropdown-menu.d.ts +0 -80
- package/dist/components/icon-button.d.ts +0 -10
- package/dist/components/keybind.d.ts +0 -6
- package/dist/components/radio-group.d.ts +0 -16
- package/dist/components/select.d.ts +0 -21
- package/dist/components/tag.d.ts +0 -5
- package/dist/components/toast.d.ts +0 -56
- package/dist/components/tooltip.d.ts +0 -17
- package/dist/v2/components/accordion-v2.d.ts +0 -26
- package/dist/v2/components/badge-v2.d.ts +0 -6
- package/dist/v2/components/button-v2.d.ts +0 -10
- package/dist/v2/components/checkbox-v2.d.ts +0 -10
- package/dist/v2/components/diff-changes-v2.d.ts +0 -11
- package/dist/v2/components/divider-v2.d.ts +0 -5
- package/dist/v2/components/icon-button-v2.d.ts +0 -11
- package/dist/v2/components/inline-input-v2.d.ts +0 -21
- package/dist/v2/components/keybind-v2.d.ts +0 -7
- package/dist/v2/components/loader-v2.d.ts +0 -3
- package/dist/v2/components/menu-v2.d.ts +0 -52
- package/dist/v2/components/progress-circle-v2.d.ts +0 -8
- package/dist/v2/components/radio-v2.d.ts +0 -16
- package/dist/v2/components/split-button-v2.d.ts +0 -5
- package/dist/v2/components/switch-v2.d.ts +0 -7
- package/dist/v2/components/tabs-v2.d.ts +0 -34
- package/dist/v2/components/text-shimmer-v2.d.ts +0 -9
- package/dist/v2/components/textarea-v2.d.ts +0 -7
- package/dist/v2/components/toast-v2.d.ts +0 -57
- package/dist/v2/components/tooltip-v2.d.ts +0 -13
- package/dist/v2/components/wordmark-v2.d.ts +0 -2
- package/src/components/avatar.css +0 -49
- package/src/components/avatar.tsx +0 -55
- package/src/components/button.css +0 -194
- package/src/components/dialog.css +0 -181
- package/src/components/dialog.tsx +0 -72
- package/src/components/diff-changes.tsx +0 -115
- package/src/components/dropdown-menu.css +0 -135
- package/src/components/dropdown-menu.tsx +0 -308
- package/src/components/icon-button.css +0 -181
- package/src/components/icon-button.tsx +0 -29
- package/src/components/icon.css +0 -39
- package/src/components/keybind.css +0 -18
- package/src/components/keybind.tsx +0 -20
- package/src/components/progress-circle.css +0 -16
- package/src/components/progress-circle.tsx +0 -64
- package/src/components/radio-group.css +0 -187
- package/src/components/radio-group.tsx +0 -83
- package/src/components/select.css +0 -201
- package/src/components/select.tsx +0 -174
- package/src/components/switch.css +0 -136
- package/src/components/switch.tsx +0 -29
- package/src/components/tabs.tsx +0 -126
- package/src/components/tag.css +0 -37
- package/src/components/tag.tsx +0 -22
- package/src/components/toast.css +0 -236
- package/src/components/toast.tsx +0 -185
- package/src/components/tooltip.css +0 -74
- package/src/components/tooltip.tsx +0 -163
- package/src/v2/components/accordion-v2.css +0 -139
- package/src/v2/components/accordion-v2.tsx +0 -86
- package/src/v2/components/button-v2.tsx +0 -35
- package/src/v2/components/checkbox-v2.css +0 -184
- package/src/v2/components/checkbox-v2.tsx +0 -65
- package/src/v2/components/diff-changes-v2.css +0 -26
- package/src/v2/components/icon-button-v2.tsx +0 -37
- package/src/v2/components/inline-input-v2.css +0 -225
- package/src/v2/components/inline-input-v2.tsx +0 -107
- package/src/v2/components/progress-circle-v2.css +0 -13
- package/src/v2/components/progress-circle-v2.tsx +0 -52
- package/src/v2/components/switch-v2.tsx +0 -28
- package/src/v2/components/tabs-v2.tsx +0 -149
- package/src/v2/components/text-shimmer-v2.css +0 -125
- package/src/v2/components/text-shimmer-v2.tsx +0 -63
- package/src/v2/components/wordmark-v2.tsx +0 -71
- /package/dist/{components → forms/inline-input}/inline-input.d.ts +0 -0
- /package/dist/{v2/components → navigation}/tab-state-indicator.d.ts +0 -0
- /package/src/{v2/components/avatar-v2.css → data-display/avatar/avatar.css} +0 -0
- /package/src/{v2/components/loader-v2.css → feedback/loader/loader.css} +0 -0
- /package/src/{v2/components/toast-v2.css → feedback/toast/toast.css} +0 -0
- /package/src/{components → forms/inline-input}/inline-input.css +0 -0
- /package/src/{components → forms/inline-input}/inline-input.tsx +0 -0
- /package/src/{v2/components/radio-v2.css → forms/radio/radio.css} +0 -0
- /package/src/{v2/components/textarea-v2.css → forms/textarea/textarea.css} +0 -0
- /package/src/{v2/components/divider-v2.css → layout/divider/divider.css} +0 -0
- /package/src/{v2/components → navigation}/tab-state-indicator.tsx +0 -0
- /package/src/{v2/styles/tailwind.css → styles/tokens/index.css} +0 -0
package/src/theme/context.tsx
CHANGED
|
@@ -84,8 +84,9 @@ const names: Record<string, string> = {
|
|
|
84
84
|
}
|
|
85
85
|
const oc2Theme = oc2ThemeJson as DesktopTheme
|
|
86
86
|
|
|
87
|
-
function
|
|
88
|
-
|
|
87
|
+
function resolveStoredTheme(id: string | null | undefined, registered?: Record<string, DesktopTheme>) {
|
|
88
|
+
if (id === "oc-2" || (id && (knownThemes().has(id) || registered?.[id]))) return id
|
|
89
|
+
return "oc-2"
|
|
89
90
|
}
|
|
90
91
|
|
|
91
92
|
function read(key: string) {
|
|
@@ -177,7 +178,12 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
|
|
|
177
178
|
defaultTheme?: string
|
|
178
179
|
onThemeApplied?: (theme: DesktopTheme, mode: "light" | "dark", scheme: ColorScheme) => void
|
|
179
180
|
}) => {
|
|
180
|
-
const
|
|
181
|
+
const rawTheme = read(STORAGE_KEYS.THEME_ID) ?? props.defaultTheme
|
|
182
|
+
const themeId = resolveStoredTheme(rawTheme)
|
|
183
|
+
if (rawTheme && rawTheme !== themeId) {
|
|
184
|
+
write(STORAGE_KEYS.THEME_ID, themeId)
|
|
185
|
+
clear()
|
|
186
|
+
}
|
|
181
187
|
const colorScheme = (read(STORAGE_KEYS.COLOR_SCHEME) as ColorScheme | null) ?? "system"
|
|
182
188
|
const mode = colorScheme === "system" ? getSystemMode() : colorScheme
|
|
183
189
|
const [store, setStore] = createStore({
|
|
@@ -194,7 +200,7 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
|
|
|
194
200
|
const loads = new Map<string, Promise<DesktopTheme | undefined>>()
|
|
195
201
|
|
|
196
202
|
const load = (id: string) => {
|
|
197
|
-
const next =
|
|
203
|
+
const next = id
|
|
198
204
|
if (!next) return Promise.resolve(undefined)
|
|
199
205
|
const hit = store.themes[next]
|
|
200
206
|
if (hit) return Promise.resolve(hit)
|
|
@@ -233,9 +239,11 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
|
|
|
233
239
|
|
|
234
240
|
const onStorage = (e: StorageEvent) => {
|
|
235
241
|
if (e.key === STORAGE_KEYS.THEME_ID && e.newValue) {
|
|
236
|
-
const next =
|
|
237
|
-
if (
|
|
238
|
-
|
|
242
|
+
const next = resolveStoredTheme(e.newValue, store.themes)
|
|
243
|
+
if (next !== e.newValue) {
|
|
244
|
+
write(STORAGE_KEYS.THEME_ID, next)
|
|
245
|
+
clear()
|
|
246
|
+
}
|
|
239
247
|
setStore("themeId", next)
|
|
240
248
|
if (next === "oc-2") {
|
|
241
249
|
clear()
|
|
@@ -262,8 +270,8 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
|
|
|
262
270
|
}
|
|
263
271
|
makeEventListener(mediaQuery, "change", onMedia)
|
|
264
272
|
|
|
265
|
-
const rawTheme = read(STORAGE_KEYS.THEME_ID)
|
|
266
|
-
const savedTheme =
|
|
273
|
+
const rawTheme = read(STORAGE_KEYS.THEME_ID) ?? props.defaultTheme
|
|
274
|
+
const savedTheme = resolveStoredTheme(rawTheme, store.themes)
|
|
267
275
|
const savedScheme = (read(STORAGE_KEYS.COLOR_SCHEME) as ColorScheme | null) ?? "system"
|
|
268
276
|
if (rawTheme && rawTheme !== savedTheme) {
|
|
269
277
|
write(STORAGE_KEYS.THEME_ID, savedTheme)
|
|
@@ -285,7 +293,7 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
|
|
|
285
293
|
})
|
|
286
294
|
|
|
287
295
|
const setTheme = (id: string) => {
|
|
288
|
-
const next =
|
|
296
|
+
const next = id
|
|
289
297
|
if (!next) {
|
|
290
298
|
console.warn(`Theme "${id}" not found`)
|
|
291
299
|
return
|
|
@@ -325,7 +333,7 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
|
|
|
325
333
|
setColorScheme,
|
|
326
334
|
registerTheme: (theme: DesktopTheme) => setStore("themes", theme.id, theme),
|
|
327
335
|
previewTheme: (id: string) => {
|
|
328
|
-
const next =
|
|
336
|
+
const next = id
|
|
329
337
|
if (!next) return
|
|
330
338
|
if (next !== "oc-2" && !knownThemes().has(next) && !store.themes[next]) return
|
|
331
339
|
setStore("previewThemeId", next)
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
"border-weak-base": "#DBDBDB",
|
|
26
26
|
"border-weaker-base": "#E8E8E8",
|
|
27
27
|
"icon-base": "#8F8F8F",
|
|
28
|
-
"icon-weak-base": "
|
|
28
|
+
"icon-weak-base": "C7C7C7",
|
|
29
29
|
"surface-raised-base": "#F3F3F3",
|
|
30
30
|
"surface-raised-base-hover": "#EDEDED",
|
|
31
31
|
"surface-base": "#F8F8F8",
|
|
@@ -120,18 +120,18 @@
|
|
|
120
120
|
"v2-cyan-1000": "#005a6eff",
|
|
121
121
|
"v2-cyan-1100": "#004756ff",
|
|
122
122
|
"v2-cyan-1200": "#00353fff",
|
|
123
|
-
"v2-blue-100": "#
|
|
124
|
-
"v2-blue-200": "#
|
|
123
|
+
"v2-blue-100": "#f5f8ffff",
|
|
124
|
+
"v2-blue-200": "#ecf1feff",
|
|
125
125
|
"v2-blue-300": "#c3d4fdff",
|
|
126
126
|
"v2-blue-400": "#a2bcffff",
|
|
127
127
|
"v2-blue-500": "#7698fdff",
|
|
128
128
|
"v2-blue-600": "#3b5cf6ff",
|
|
129
|
-
"v2-blue-700": "#
|
|
130
|
-
"v2-blue-800": "#
|
|
131
|
-
"v2-blue-900": "#
|
|
132
|
-
"v2-blue-1000": "#
|
|
133
|
-
"v2-blue-1100": "#
|
|
134
|
-
"v2-blue-1200": "#
|
|
129
|
+
"v2-blue-700": "#0b34f4ff",
|
|
130
|
+
"v2-blue-800": "#3250dfff",
|
|
131
|
+
"v2-blue-900": "#2c47c8ff",
|
|
132
|
+
"v2-blue-1000": "#263fa9ff",
|
|
133
|
+
"v2-blue-1100": "#22388fff",
|
|
134
|
+
"v2-blue-1200": "#021945ff",
|
|
135
135
|
"v2-purple-100": "#ebecfeff",
|
|
136
136
|
"v2-purple-200": "#d5d5fcff",
|
|
137
137
|
"v2-purple-300": "#b9b8f5ff",
|
|
@@ -164,8 +164,10 @@
|
|
|
164
164
|
"v2-background-bg-layer-04": "var(--v2-grey-400)",
|
|
165
165
|
"v2-background-bg-inverse": "var(--v2-grey-1100)",
|
|
166
166
|
"v2-background-bg-contrast": "var(--v2-grey-1000)",
|
|
167
|
+
"v2-background-bg-icon-button-contrast": "var(--v2-background-bg-contrast)",
|
|
167
168
|
"v2-background-bg-button-neutral": "var(--v2-grey-50)",
|
|
168
169
|
"v2-background-bg-accent": "var(--v2-blue-600)",
|
|
170
|
+
"v2-background-bg-code-path": "var(--v2-cyan-100)",
|
|
169
171
|
"v2-text-text-base": "var(--v2-grey-1100)",
|
|
170
172
|
"v2-text-text-muted": "var(--v2-grey-700)",
|
|
171
173
|
"v2-text-text-faint": "var(--v2-grey-600)",
|
|
@@ -174,8 +176,10 @@
|
|
|
174
176
|
"v2-text-text-accent": "var(--v2-blue-600)",
|
|
175
177
|
"v2-text-text-accent-hover": "var(--v2-blue-700)",
|
|
176
178
|
"v2-text-text-code-accent": "var(--v2-blue-900)",
|
|
179
|
+
"v2-text-text-code-path": "var(--v2-blue-900)",
|
|
177
180
|
"v2-icon-icon-base": "var(--v2-grey-800)",
|
|
178
181
|
"v2-icon-icon-muted": "var(--v2-grey-600)",
|
|
182
|
+
"v2-icon-icon-faint": "var(--v2-grey-500)",
|
|
179
183
|
"v2-icon-icon-inverse": "var(--v2-grey-50)",
|
|
180
184
|
"v2-icon-icon-contrast": "var(--v2-grey-100)",
|
|
181
185
|
"v2-icon-icon-accent": "var(--v2-blue-600)",
|
|
@@ -204,9 +208,20 @@
|
|
|
204
208
|
"v2-state-bg-danger": "var(--v2-red-100)",
|
|
205
209
|
"v2-state-fg-danger": "var(--v2-red-800)",
|
|
206
210
|
"v2-state-border-danger": "var(--v2-red-300)",
|
|
207
|
-
"v2-state-bg-info": "var(--v2-blue-
|
|
211
|
+
"v2-state-bg-info": "var(--v2-blue-200)",
|
|
208
212
|
"v2-state-fg-info": "var(--v2-blue-800)",
|
|
209
213
|
"v2-state-border-info": "var(--v2-blue-300)",
|
|
214
|
+
"v2-agent-plan-solid": "var(--v2-pink-800)",
|
|
215
|
+
"v2-agent-plan-border": "rgba(200, 61, 139, 0.2)",
|
|
216
|
+
"v2-agent-plan-background": "rgba(253, 236, 243, 0.1)",
|
|
217
|
+
"v2-agent-build-solid": "var(--v2-blue-800)",
|
|
218
|
+
"v2-agent-build-border": "rgba(44, 71, 200, 0.1)",
|
|
219
|
+
"v2-agent-build-background": "rgba(236, 241, 254, 0.1)",
|
|
220
|
+
"v2-agent-explore-solid": "var(--v2-yellow-900)",
|
|
221
|
+
"v2-agent-explore-border": "rgba(203, 159, 52, 0.2)",
|
|
222
|
+
"v2-agent-explore-background": "rgba(254, 250, 236, 0.1)",
|
|
223
|
+
"v2-agent-review-solid": "var(--v2-green-800)",
|
|
224
|
+
"v2-agent-writer-solid": "var(--v2-purple-700)",
|
|
210
225
|
"v2-avatar-bg-orange": "#ee7330ff",
|
|
211
226
|
"v2-avatar-border-orange": "#d16427ff",
|
|
212
227
|
"v2-avatar-bg-yellow": "#e7af36ff",
|
|
@@ -235,7 +250,8 @@
|
|
|
235
250
|
"v2-elevation-switch-on": "inset 0px 2px 2px 0px var(--v2-alpha-dark-10), inset 0px 1px 1px 0px var(--v2-alpha-dark-10), inset 0px 0px 0px 0.5px var(--v2-alpha-dark-20)",
|
|
236
251
|
"v2-illustration-illustration-layer-01": "var(--v2-grey-300)",
|
|
237
252
|
"v2-illustration-illustration-layer-02": "var(--v2-grey-400)",
|
|
238
|
-
"v2-illustration-illustration-layer-03": "var(--v2-grey-500)"
|
|
253
|
+
"v2-illustration-illustration-layer-03": "var(--v2-grey-500)",
|
|
254
|
+
"v2-font-family-code": "var(--font-family-mono)"
|
|
239
255
|
}
|
|
240
256
|
},
|
|
241
257
|
"dark": {
|
|
@@ -355,18 +371,18 @@
|
|
|
355
371
|
"v2-cyan-1000": "#005a6eff",
|
|
356
372
|
"v2-cyan-1100": "#004756ff",
|
|
357
373
|
"v2-cyan-1200": "#00353fff",
|
|
358
|
-
"v2-blue-100": "#
|
|
359
|
-
"v2-blue-200": "#
|
|
374
|
+
"v2-blue-100": "#f5f8ffff",
|
|
375
|
+
"v2-blue-200": "#ecf1feff",
|
|
360
376
|
"v2-blue-300": "#c3d4fdff",
|
|
361
377
|
"v2-blue-400": "#a2bcffff",
|
|
362
378
|
"v2-blue-500": "#7698fdff",
|
|
363
379
|
"v2-blue-600": "#3b5cf6ff",
|
|
364
|
-
"v2-blue-700": "#
|
|
365
|
-
"v2-blue-800": "#
|
|
366
|
-
"v2-blue-900": "#
|
|
367
|
-
"v2-blue-1000": "#
|
|
368
|
-
"v2-blue-1100": "#
|
|
369
|
-
"v2-blue-1200": "#
|
|
380
|
+
"v2-blue-700": "#0b34f4ff",
|
|
381
|
+
"v2-blue-800": "#3250dfff",
|
|
382
|
+
"v2-blue-900": "#2c47c8ff",
|
|
383
|
+
"v2-blue-1000": "#263fa9ff",
|
|
384
|
+
"v2-blue-1100": "#22388fff",
|
|
385
|
+
"v2-blue-1200": "#021945ff",
|
|
370
386
|
"v2-purple-100": "#ebecfeff",
|
|
371
387
|
"v2-purple-200": "#d5d5fcff",
|
|
372
388
|
"v2-purple-300": "#b9b8f5ff",
|
|
@@ -399,8 +415,10 @@
|
|
|
399
415
|
"v2-background-bg-layer-04": "var(--v2-grey-700)",
|
|
400
416
|
"v2-background-bg-inverse": "var(--v2-grey-50)",
|
|
401
417
|
"v2-background-bg-contrast": "var(--v2-grey-700)",
|
|
418
|
+
"v2-background-bg-icon-button-contrast": "var(--v2-grey-400)",
|
|
402
419
|
"v2-background-bg-button-neutral": "var(--v2-alpha-light-6)",
|
|
403
420
|
"v2-background-bg-accent": "var(--v2-blue-600)",
|
|
421
|
+
"v2-background-bg-code-path": "var(--v2-cyan-1200)",
|
|
404
422
|
"v2-text-text-base": "var(--v2-grey-100)",
|
|
405
423
|
"v2-text-text-muted": "var(--v2-grey-500)",
|
|
406
424
|
"v2-text-text-faint": "var(--v2-grey-600)",
|
|
@@ -409,8 +427,10 @@
|
|
|
409
427
|
"v2-text-text-accent": "var(--v2-blue-400)",
|
|
410
428
|
"v2-text-text-accent-hover": "var(--v2-blue-300)",
|
|
411
429
|
"v2-text-text-code-accent": "var(--v2-blue-400)",
|
|
430
|
+
"v2-text-text-code-path": "var(--v2-blue-300)",
|
|
412
431
|
"v2-icon-icon-base": "var(--v2-grey-400)",
|
|
413
432
|
"v2-icon-icon-muted": "var(--v2-grey-600)",
|
|
433
|
+
"v2-icon-icon-faint": "var(--v2-grey-500)",
|
|
414
434
|
"v2-icon-icon-inverse": "var(--v2-grey-1100)",
|
|
415
435
|
"v2-icon-icon-contrast": "var(--v2-grey-100)",
|
|
416
436
|
"v2-icon-icon-accent": "var(--v2-blue-400)",
|
|
@@ -442,6 +462,17 @@
|
|
|
442
462
|
"v2-state-bg-info": "var(--v2-blue-1200)",
|
|
443
463
|
"v2-state-fg-info": "var(--v2-blue-500)",
|
|
444
464
|
"v2-state-border-info": "var(--v2-blue-900)",
|
|
465
|
+
"v2-agent-plan-solid": "var(--v2-pink-400)",
|
|
466
|
+
"v2-agent-plan-border": "rgba(247, 153, 198, 0.2)",
|
|
467
|
+
"v2-agent-plan-background": "rgba(170, 53, 118, 0.05)",
|
|
468
|
+
"v2-agent-build-solid": "var(--v2-blue-300)",
|
|
469
|
+
"v2-agent-build-border": "rgba(162, 188, 255, 0.2)",
|
|
470
|
+
"v2-agent-build-background": "rgba(38, 63, 169, 0.05)",
|
|
471
|
+
"v2-agent-explore-solid": "var(--v2-yellow-300)",
|
|
472
|
+
"v2-agent-explore-border": "rgba(243, 218, 155, 0.2)",
|
|
473
|
+
"v2-agent-explore-background": "rgba(172, 136, 51, 0.05)",
|
|
474
|
+
"v2-agent-review-solid": "var(--v2-green-300)",
|
|
475
|
+
"v2-agent-writer-solid": "var(--v2-purple-400)",
|
|
445
476
|
"v2-avatar-bg-orange": "#723d22ff",
|
|
446
477
|
"v2-avatar-border-orange": "#ff8648ff",
|
|
447
478
|
"v2-avatar-bg-yellow": "#68552bff",
|
|
@@ -75,18 +75,18 @@ export const V2_PRIMITIVES_DEFAULT: Record<string, V2ColorValue> = {
|
|
|
75
75
|
"v2-cyan-1000": "#005a6eff",
|
|
76
76
|
"v2-cyan-1100": "#004756ff",
|
|
77
77
|
"v2-cyan-1200": "#00353fff",
|
|
78
|
-
"v2-blue-100": "#
|
|
79
|
-
"v2-blue-200": "#
|
|
78
|
+
"v2-blue-100": "#f5f8ffff",
|
|
79
|
+
"v2-blue-200": "#ecf1feff",
|
|
80
80
|
"v2-blue-300": "#c3d4fdff",
|
|
81
81
|
"v2-blue-400": "#a2bcffff",
|
|
82
82
|
"v2-blue-500": "#7698fdff",
|
|
83
83
|
"v2-blue-600": "#3b5cf6ff",
|
|
84
|
-
"v2-blue-700": "#
|
|
85
|
-
"v2-blue-800": "#
|
|
86
|
-
"v2-blue-900": "#
|
|
87
|
-
"v2-blue-1000": "#
|
|
88
|
-
"v2-blue-1100": "#
|
|
89
|
-
"v2-blue-1200": "#
|
|
84
|
+
"v2-blue-700": "#0b34f4ff",
|
|
85
|
+
"v2-blue-800": "#3250dfff",
|
|
86
|
+
"v2-blue-900": "#2c47c8ff",
|
|
87
|
+
"v2-blue-1000": "#263fa9ff",
|
|
88
|
+
"v2-blue-1100": "#22388fff",
|
|
89
|
+
"v2-blue-1200": "#021945ff",
|
|
90
90
|
"v2-purple-100": "#ebecfeff",
|
|
91
91
|
"v2-purple-200": "#d5d5fcff",
|
|
92
92
|
"v2-purple-300": "#b9b8f5ff",
|
|
@@ -52,6 +52,7 @@ export function mapV2Foreground(
|
|
|
52
52
|
"v2-text-text-faint": shift(body, { l: isDark ? -0.2 : 0.21, c: isDark ? 0.78 : 0.72 }),
|
|
53
53
|
"v2-icon-icon-base": greyRef(pickGrey(primitives, bgBase, 7, isDark ? 400 : 800)),
|
|
54
54
|
"v2-icon-icon-muted": greyRef(pickGrey(primitives, bgBase, 3, 600)),
|
|
55
|
+
"v2-icon-icon-faint": greyRef(pickGrey(primitives, bgBase, 1.5, 500)),
|
|
55
56
|
"v2-icon-icon-inverse": greyRef(pickGrey(primitives, bgInverse, 7, inverseTarget)),
|
|
56
57
|
"v2-icon-icon-contrast": greyRef(pickGrey(primitives, bgContrast, 7, 100)),
|
|
57
58
|
"v2-icon-icon-accent": isDark ? "var(--v2-blue-400)" : "var(--v2-blue-600)",
|
package/src/theme/v2/mapping.ts
CHANGED
|
@@ -40,13 +40,16 @@ const light: Record<string, V2ColorValue> = {
|
|
|
40
40
|
"v2-background-bg-layer-04": ref("v2-grey-600"),
|
|
41
41
|
"v2-background-bg-inverse": ref("v2-grey-1000"),
|
|
42
42
|
"v2-background-bg-contrast": ref("v2-grey-900"),
|
|
43
|
+
"v2-background-bg-icon-button-contrast": ref("v2-background-bg-contrast"),
|
|
43
44
|
"v2-background-bg-button-neutral": ref("v2-grey-100"),
|
|
44
45
|
"v2-background-bg-accent": ref("v2-blue-600"),
|
|
46
|
+
"v2-background-bg-code-path": ref("v2-cyan-100"),
|
|
45
47
|
"v2-text-text-inverse": ref("v2-grey-100"),
|
|
46
48
|
"v2-text-text-contrast": ref("v2-grey-100"),
|
|
47
49
|
"v2-text-text-accent": ref("v2-blue-600"),
|
|
48
50
|
"v2-text-text-accent-hover": ref("v2-blue-700"),
|
|
49
51
|
"v2-text-text-code-accent": ref("v2-blue-900"),
|
|
52
|
+
"v2-text-text-code-path": ref("v2-blue-900"),
|
|
50
53
|
"v2-border-border-muted": ref("v2-alpha-dark-8"),
|
|
51
54
|
"v2-border-border-base": ref("v2-alpha-dark-10"),
|
|
52
55
|
"v2-border-border-strong": ref("v2-alpha-dark-20"),
|
|
@@ -71,7 +74,7 @@ const light: Record<string, V2ColorValue> = {
|
|
|
71
74
|
"v2-state-bg-danger": ref("v2-red-100"),
|
|
72
75
|
"v2-state-fg-danger": ref("v2-red-800"),
|
|
73
76
|
"v2-state-border-danger": ref("v2-red-300"),
|
|
74
|
-
"v2-state-bg-info": ref("v2-blue-
|
|
77
|
+
"v2-state-bg-info": ref("v2-blue-200"),
|
|
75
78
|
"v2-state-fg-info": ref("v2-blue-800"),
|
|
76
79
|
"v2-state-border-info": ref("v2-blue-300"),
|
|
77
80
|
...lightAgentTokens,
|
|
@@ -105,13 +108,16 @@ const dark: Record<string, V2ColorValue> = {
|
|
|
105
108
|
"v2-background-bg-layer-04": ref("v2-grey-400"),
|
|
106
109
|
"v2-background-bg-inverse": ref("v2-grey-100"),
|
|
107
110
|
"v2-background-bg-contrast": ref("v2-grey-700"),
|
|
111
|
+
"v2-background-bg-icon-button-contrast": ref("v2-grey-400"),
|
|
108
112
|
"v2-background-bg-button-neutral": ref("v2-alpha-light-6"),
|
|
109
113
|
"v2-background-bg-accent": ref("v2-blue-600"),
|
|
114
|
+
"v2-background-bg-code-path": ref("v2-cyan-1200"),
|
|
110
115
|
"v2-text-text-inverse": ref("v2-grey-1000"),
|
|
111
116
|
"v2-text-text-contrast": ref("v2-grey-100"),
|
|
112
117
|
"v2-text-text-accent": ref("v2-blue-400"),
|
|
113
118
|
"v2-text-text-accent-hover": ref("v2-blue-300"),
|
|
114
119
|
"v2-text-text-code-accent": ref("v2-blue-400"),
|
|
120
|
+
"v2-text-text-code-path": ref("v2-blue-300"),
|
|
115
121
|
"v2-border-border-muted": ref("v2-alpha-light-8"),
|
|
116
122
|
"v2-border-border-base": ref("v2-alpha-light-10"),
|
|
117
123
|
"v2-border-border-strong": ref("v2-alpha-light-20"),
|
|
@@ -5,7 +5,8 @@
|
|
|
5
5
|
--text-shimmer-index: 0;
|
|
6
6
|
--text-shimmer-angle: 90deg;
|
|
7
7
|
--text-shimmer-spread: 5.2ch;
|
|
8
|
-
--text-shimmer-
|
|
8
|
+
--text-shimmer-gutter: calc(var(--text-shimmer-spread) + 1ch);
|
|
9
|
+
--text-shimmer-size: calc(200% + var(--text-shimmer-gutter) + var(--text-shimmer-gutter));
|
|
9
10
|
--text-shimmer-base-color: var(--text-weak);
|
|
10
11
|
--text-shimmer-peak-color: var(--text-strong);
|
|
11
12
|
--text-shimmer-sweep: linear-gradient(
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { createUniqueId, type ComponentProps } from "solid-js"
|
|
2
|
+
|
|
3
|
+
export function Wordmark(props: Pick<ComponentProps<"svg">, "class"> & { fade?: boolean; muted?: boolean }) {
|
|
4
|
+
const mask = createUniqueId()
|
|
5
|
+
const maskGradient = createUniqueId()
|
|
6
|
+
|
|
7
|
+
return (
|
|
8
|
+
<svg
|
|
9
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
10
|
+
viewBox="0 0 720 129"
|
|
11
|
+
fill="none"
|
|
12
|
+
classList={{ [props.class ?? ""]: !!props.class }}
|
|
13
|
+
>
|
|
14
|
+
<g opacity={props.muted === false ? 1 : 0.6} class="[[data-color-scheme=dark]_&]:opacity-100">
|
|
15
|
+
<g mask={props.fade === false ? undefined : `url(#${mask})`}>
|
|
16
|
+
<g opacity={props.muted === false ? 1 : 0.16 * 0.7} fill="currentColor">
|
|
17
|
+
<path d="M55.3846 36.4286H18.4615V91.7143H55.3846V36.4286ZM73.8462 110.143H0V18H73.8462V110.143Z" />
|
|
18
|
+
<path d="M110.462 91.7143H147.385V36.4286H110.462V91.7143ZM165.846 110.143H110.462V128.571H92V18H165.846V110.143Z" />
|
|
19
|
+
<path d="M258.846 73.2857H203.462V91.7143H258.846V110.143H185V18H258.846V73.2857ZM203.462 54.8571H240.385V36.4286H203.462V54.8571Z" />
|
|
20
|
+
<path d="M332.385 36.4286H295.462V110.143H277V18H332.385V36.4286ZM350.846 110.143H332.385V36.4286H350.846V110.143Z" />
|
|
21
|
+
<path d="M442.846 36.4286H387.462V91.7143H442.846V110.143H369V18H442.846V36.4286Z" />
|
|
22
|
+
<path d="M517.385 36.4286H480.462V91.7143H517.385V36.4286ZM535.846 110.143H462V18H535.846V110.143Z" />
|
|
23
|
+
<path d="M609.385 36.8571H572.462V92.1429H609.385V36.8571ZM627.846 110.571H554V18.4286H609.385V0H627.846V110.571Z" />
|
|
24
|
+
<path d="M664.462 36.4286V54.8571H701.385V36.4286H664.462ZM719.846 73.2857H664.462V91.7143H719.846V110.143H646V18H719.846V73.2857Z" />
|
|
25
|
+
</g>
|
|
26
|
+
</g>
|
|
27
|
+
</g>
|
|
28
|
+
<defs>
|
|
29
|
+
<mask id={mask} style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="720" height="129">
|
|
30
|
+
<rect width="720" height="129" fill={`url(#${maskGradient})`} />
|
|
31
|
+
</mask>
|
|
32
|
+
<linearGradient id={maskGradient} x1="360" y1="68" x2="360" y2="129" gradientUnits="userSpaceOnUse">
|
|
33
|
+
<stop stop-color="white" stop-opacity="0.7" />
|
|
34
|
+
<stop offset="1" stop-color="white" stop-opacity="0" />
|
|
35
|
+
</linearGradient>
|
|
36
|
+
</defs>
|
|
37
|
+
</svg>
|
|
38
|
+
)
|
|
39
|
+
}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { type ComponentProps } from "solid-js";
|
|
2
|
-
export interface AvatarProps extends ComponentProps<"div"> {
|
|
3
|
-
fallback: string;
|
|
4
|
-
src?: string;
|
|
5
|
-
background?: string;
|
|
6
|
-
foreground?: string;
|
|
7
|
-
size?: "small" | "normal" | "large";
|
|
8
|
-
}
|
|
9
|
-
export declare function Avatar(props: AvatarProps): import("solid-js").JSX.Element;
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { Button as Kobalte } from "@kobalte/core/button";
|
|
2
|
-
import { type ComponentProps } from "solid-js";
|
|
3
|
-
import { IconProps } from "./icon";
|
|
4
|
-
export interface ButtonProps extends ComponentProps<typeof Kobalte>, Pick<ComponentProps<"button">, "class" | "classList" | "children"> {
|
|
5
|
-
size?: "small" | "normal" | "large";
|
|
6
|
-
variant?: "primary" | "secondary" | "ghost";
|
|
7
|
-
icon?: IconProps["name"];
|
|
8
|
-
}
|
|
9
|
-
export declare function Button(props: ButtonProps): import("solid-js").JSX.Element;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { ComponentProps, JSXElement, ParentProps } from "solid-js";
|
|
2
|
-
export interface DialogProps extends ParentProps {
|
|
3
|
-
title?: JSXElement;
|
|
4
|
-
description?: JSXElement;
|
|
5
|
-
action?: JSXElement;
|
|
6
|
-
size?: "normal" | "large" | "x-large";
|
|
7
|
-
class?: ComponentProps<"div">["class"];
|
|
8
|
-
classList?: ComponentProps<"div">["classList"];
|
|
9
|
-
fit?: boolean;
|
|
10
|
-
transition?: boolean;
|
|
11
|
-
}
|
|
12
|
-
export declare function Dialog(props: DialogProps): import("solid-js").JSX.Element;
|
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
import { DropdownMenu as Kobalte } from "@kobalte/core/dropdown-menu";
|
|
2
|
-
import type { ComponentProps, ParentProps } from "solid-js";
|
|
3
|
-
export interface DropdownMenuProps extends ComponentProps<typeof Kobalte> {
|
|
4
|
-
}
|
|
5
|
-
export interface DropdownMenuTriggerProps extends ComponentProps<typeof Kobalte.Trigger> {
|
|
6
|
-
}
|
|
7
|
-
export interface DropdownMenuIconProps extends ComponentProps<typeof Kobalte.Icon> {
|
|
8
|
-
}
|
|
9
|
-
export interface DropdownMenuPortalProps extends ComponentProps<typeof Kobalte.Portal> {
|
|
10
|
-
}
|
|
11
|
-
export interface DropdownMenuContentProps extends ComponentProps<typeof Kobalte.Content> {
|
|
12
|
-
}
|
|
13
|
-
export interface DropdownMenuArrowProps extends ComponentProps<typeof Kobalte.Arrow> {
|
|
14
|
-
}
|
|
15
|
-
export interface DropdownMenuSeparatorProps extends ComponentProps<typeof Kobalte.Separator> {
|
|
16
|
-
}
|
|
17
|
-
export interface DropdownMenuGroupProps extends ComponentProps<typeof Kobalte.Group> {
|
|
18
|
-
}
|
|
19
|
-
export interface DropdownMenuGroupLabelProps extends ComponentProps<typeof Kobalte.GroupLabel> {
|
|
20
|
-
}
|
|
21
|
-
export interface DropdownMenuItemProps extends ComponentProps<typeof Kobalte.Item> {
|
|
22
|
-
}
|
|
23
|
-
export interface DropdownMenuItemLabelProps extends ComponentProps<typeof Kobalte.ItemLabel> {
|
|
24
|
-
}
|
|
25
|
-
export interface DropdownMenuItemDescriptionProps extends ComponentProps<typeof Kobalte.ItemDescription> {
|
|
26
|
-
}
|
|
27
|
-
export interface DropdownMenuItemIndicatorProps extends ComponentProps<typeof Kobalte.ItemIndicator> {
|
|
28
|
-
}
|
|
29
|
-
export interface DropdownMenuRadioGroupProps extends ComponentProps<typeof Kobalte.RadioGroup> {
|
|
30
|
-
}
|
|
31
|
-
export interface DropdownMenuRadioItemProps extends ComponentProps<typeof Kobalte.RadioItem> {
|
|
32
|
-
}
|
|
33
|
-
export interface DropdownMenuCheckboxItemProps extends ComponentProps<typeof Kobalte.CheckboxItem> {
|
|
34
|
-
}
|
|
35
|
-
export interface DropdownMenuSubProps extends ComponentProps<typeof Kobalte.Sub> {
|
|
36
|
-
}
|
|
37
|
-
export interface DropdownMenuSubTriggerProps extends ComponentProps<typeof Kobalte.SubTrigger> {
|
|
38
|
-
}
|
|
39
|
-
export interface DropdownMenuSubContentProps extends ComponentProps<typeof Kobalte.SubContent> {
|
|
40
|
-
}
|
|
41
|
-
declare function DropdownMenuRoot(props: DropdownMenuProps): import("solid-js").JSX.Element;
|
|
42
|
-
declare function DropdownMenuTrigger(props: ParentProps<DropdownMenuTriggerProps>): import("solid-js").JSX.Element;
|
|
43
|
-
declare function DropdownMenuIcon(props: ParentProps<DropdownMenuIconProps>): import("solid-js").JSX.Element;
|
|
44
|
-
declare function DropdownMenuPortal(props: DropdownMenuPortalProps): import("solid-js").JSX.Element;
|
|
45
|
-
declare function DropdownMenuContent(props: ParentProps<DropdownMenuContentProps>): import("solid-js").JSX.Element;
|
|
46
|
-
declare function DropdownMenuArrow(props: DropdownMenuArrowProps): import("solid-js").JSX.Element;
|
|
47
|
-
declare function DropdownMenuSeparator(props: DropdownMenuSeparatorProps): import("solid-js").JSX.Element;
|
|
48
|
-
declare function DropdownMenuGroup(props: ParentProps<DropdownMenuGroupProps>): import("solid-js").JSX.Element;
|
|
49
|
-
declare function DropdownMenuGroupLabel(props: ParentProps<DropdownMenuGroupLabelProps>): import("solid-js").JSX.Element;
|
|
50
|
-
declare function DropdownMenuItem(props: ParentProps<DropdownMenuItemProps>): import("solid-js").JSX.Element;
|
|
51
|
-
declare function DropdownMenuItemLabel(props: ParentProps<DropdownMenuItemLabelProps>): import("solid-js").JSX.Element;
|
|
52
|
-
declare function DropdownMenuItemDescription(props: ParentProps<DropdownMenuItemDescriptionProps>): import("solid-js").JSX.Element;
|
|
53
|
-
declare function DropdownMenuItemIndicator(props: ParentProps<DropdownMenuItemIndicatorProps>): import("solid-js").JSX.Element;
|
|
54
|
-
declare function DropdownMenuRadioGroup(props: ParentProps<DropdownMenuRadioGroupProps>): import("solid-js").JSX.Element;
|
|
55
|
-
declare function DropdownMenuRadioItem(props: ParentProps<DropdownMenuRadioItemProps>): import("solid-js").JSX.Element;
|
|
56
|
-
declare function DropdownMenuCheckboxItem(props: ParentProps<DropdownMenuCheckboxItemProps>): import("solid-js").JSX.Element;
|
|
57
|
-
declare function DropdownMenuSub(props: DropdownMenuSubProps): import("solid-js").JSX.Element;
|
|
58
|
-
declare function DropdownMenuSubTrigger(props: ParentProps<DropdownMenuSubTriggerProps>): import("solid-js").JSX.Element;
|
|
59
|
-
declare function DropdownMenuSubContent(props: ParentProps<DropdownMenuSubContentProps>): import("solid-js").JSX.Element;
|
|
60
|
-
export declare const DropdownMenu: typeof DropdownMenuRoot & {
|
|
61
|
-
Trigger: typeof DropdownMenuTrigger;
|
|
62
|
-
Icon: typeof DropdownMenuIcon;
|
|
63
|
-
Portal: typeof DropdownMenuPortal;
|
|
64
|
-
Content: typeof DropdownMenuContent;
|
|
65
|
-
Arrow: typeof DropdownMenuArrow;
|
|
66
|
-
Separator: typeof DropdownMenuSeparator;
|
|
67
|
-
Group: typeof DropdownMenuGroup;
|
|
68
|
-
GroupLabel: typeof DropdownMenuGroupLabel;
|
|
69
|
-
Item: typeof DropdownMenuItem;
|
|
70
|
-
ItemLabel: typeof DropdownMenuItemLabel;
|
|
71
|
-
ItemDescription: typeof DropdownMenuItemDescription;
|
|
72
|
-
ItemIndicator: typeof DropdownMenuItemIndicator;
|
|
73
|
-
RadioGroup: typeof DropdownMenuRadioGroup;
|
|
74
|
-
RadioItem: typeof DropdownMenuRadioItem;
|
|
75
|
-
CheckboxItem: typeof DropdownMenuCheckboxItem;
|
|
76
|
-
Sub: typeof DropdownMenuSub;
|
|
77
|
-
SubTrigger: typeof DropdownMenuSubTrigger;
|
|
78
|
-
SubContent: typeof DropdownMenuSubContent;
|
|
79
|
-
};
|
|
80
|
-
export {};
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { Button as Kobalte } from "@kobalte/core/button";
|
|
2
|
-
import { type ComponentProps } from "solid-js";
|
|
3
|
-
import { IconProps } from "./icon";
|
|
4
|
-
export interface IconButtonProps extends ComponentProps<typeof Kobalte> {
|
|
5
|
-
icon: IconProps["name"];
|
|
6
|
-
size?: "small" | "normal" | "large";
|
|
7
|
-
iconSize?: IconProps["size"];
|
|
8
|
-
variant?: "primary" | "secondary" | "ghost";
|
|
9
|
-
}
|
|
10
|
-
export declare function IconButton(props: ComponentProps<"button"> & IconButtonProps): import("solid-js").JSX.Element;
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import type { ComponentProps, ParentProps } from "solid-js";
|
|
2
|
-
export interface KeybindProps extends ParentProps {
|
|
3
|
-
class?: string;
|
|
4
|
-
classList?: ComponentProps<"span">["classList"];
|
|
5
|
-
}
|
|
6
|
-
export declare function Keybind(props: KeybindProps): import("solid-js").JSX.Element;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { SegmentedControl as Kobalte } from "@kobalte/core/segmented-control";
|
|
2
|
-
import type { ComponentProps, JSX } from "solid-js";
|
|
3
|
-
export type RadioGroupProps<T> = Omit<ComponentProps<typeof Kobalte>, "value" | "defaultValue" | "onChange" | "children"> & {
|
|
4
|
-
options: T[];
|
|
5
|
-
current?: T;
|
|
6
|
-
defaultValue?: T;
|
|
7
|
-
value?: (x: T) => string;
|
|
8
|
-
label?: (x: T) => JSX.Element | string;
|
|
9
|
-
onSelect?: (value: T | undefined) => void;
|
|
10
|
-
class?: ComponentProps<"div">["class"];
|
|
11
|
-
classList?: ComponentProps<"div">["classList"];
|
|
12
|
-
size?: "small" | "medium";
|
|
13
|
-
fill?: boolean;
|
|
14
|
-
pad?: "none" | "normal";
|
|
15
|
-
};
|
|
16
|
-
export declare function RadioGroup<T>(props: RadioGroupProps<T>): JSX.Element;
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { Select as Kobalte } from "@kobalte/core/select";
|
|
2
|
-
import { type ComponentProps, type JSX } from "solid-js";
|
|
3
|
-
import { ButtonProps } from "./button";
|
|
4
|
-
export type SelectProps<T> = Omit<ComponentProps<typeof Kobalte<T>>, "value" | "onSelect" | "children"> & {
|
|
5
|
-
placeholder?: string;
|
|
6
|
-
options: T[];
|
|
7
|
-
current?: T;
|
|
8
|
-
value?: (x: T) => string;
|
|
9
|
-
label?: (x: T) => string;
|
|
10
|
-
groupBy?: (x: T) => string;
|
|
11
|
-
valueClass?: ComponentProps<"div">["class"];
|
|
12
|
-
onSelect?: (value: T | undefined) => void;
|
|
13
|
-
onHighlight?: (value: T | undefined) => (() => void) | void;
|
|
14
|
-
class?: ComponentProps<"div">["class"];
|
|
15
|
-
classList?: ComponentProps<"div">["classList"];
|
|
16
|
-
children?: (item: T | undefined) => JSX.Element;
|
|
17
|
-
triggerStyle?: JSX.CSSProperties;
|
|
18
|
-
triggerVariant?: "settings";
|
|
19
|
-
triggerProps?: Record<string, string | number | boolean | undefined>;
|
|
20
|
-
};
|
|
21
|
-
export declare function Select<T>(props: SelectProps<T> & Omit<ButtonProps, "children">): JSX.Element;
|
package/dist/components/tag.d.ts
DELETED
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
import { Toast as Kobalte, toaster } from "@kobalte/core/toast";
|
|
2
|
-
import type { ToastRootProps, ToastCloseButtonProps, ToastTitleProps, ToastDescriptionProps } from "@kobalte/core/toast";
|
|
3
|
-
import type { ComponentProps, JSX } from "solid-js";
|
|
4
|
-
import { type IconProps } from "./icon";
|
|
5
|
-
export interface ToastRegionProps extends ComponentProps<typeof Kobalte.Region> {
|
|
6
|
-
}
|
|
7
|
-
declare function ToastRegion(props: ToastRegionProps): JSX.Element;
|
|
8
|
-
export interface ToastRootComponentProps extends ToastRootProps {
|
|
9
|
-
class?: string;
|
|
10
|
-
classList?: ComponentProps<"li">["classList"];
|
|
11
|
-
children?: JSX.Element;
|
|
12
|
-
}
|
|
13
|
-
declare function ToastRoot(props: ToastRootComponentProps): JSX.Element;
|
|
14
|
-
declare function ToastIcon(props: {
|
|
15
|
-
name: IconProps["name"];
|
|
16
|
-
}): JSX.Element;
|
|
17
|
-
declare function ToastContent(props: ComponentProps<"div">): JSX.Element;
|
|
18
|
-
declare function ToastTitle(props: ToastTitleProps & ComponentProps<"div">): JSX.Element;
|
|
19
|
-
declare function ToastDescription(props: ToastDescriptionProps & ComponentProps<"div">): JSX.Element;
|
|
20
|
-
declare function ToastActions(props: ComponentProps<"div">): JSX.Element;
|
|
21
|
-
declare function ToastCloseButton(props: ToastCloseButtonProps & ComponentProps<"button">): JSX.Element;
|
|
22
|
-
declare function ToastProgressTrack(props: ComponentProps<typeof Kobalte.ProgressTrack>): JSX.Element;
|
|
23
|
-
declare function ToastProgressFill(props: ComponentProps<typeof Kobalte.ProgressFill>): JSX.Element;
|
|
24
|
-
export declare const Toast: typeof ToastRoot & {
|
|
25
|
-
Region: typeof ToastRegion;
|
|
26
|
-
Icon: typeof ToastIcon;
|
|
27
|
-
Content: typeof ToastContent;
|
|
28
|
-
Title: typeof ToastTitle;
|
|
29
|
-
Description: typeof ToastDescription;
|
|
30
|
-
Actions: typeof ToastActions;
|
|
31
|
-
CloseButton: typeof ToastCloseButton;
|
|
32
|
-
ProgressTrack: typeof ToastProgressTrack;
|
|
33
|
-
ProgressFill: typeof ToastProgressFill;
|
|
34
|
-
};
|
|
35
|
-
export { toaster };
|
|
36
|
-
export type ToastVariant = "default" | "success" | "error" | "loading";
|
|
37
|
-
export interface ToastAction {
|
|
38
|
-
label: string;
|
|
39
|
-
onClick: "dismiss" | (() => void);
|
|
40
|
-
}
|
|
41
|
-
export interface ToastOptions {
|
|
42
|
-
title?: string;
|
|
43
|
-
description?: string;
|
|
44
|
-
icon?: IconProps["name"];
|
|
45
|
-
variant?: ToastVariant;
|
|
46
|
-
duration?: number;
|
|
47
|
-
persistent?: boolean;
|
|
48
|
-
actions?: ToastAction[];
|
|
49
|
-
}
|
|
50
|
-
export declare function showToast(options: ToastOptions | string): number;
|
|
51
|
-
export interface ToastPromiseOptions<T, U = unknown> {
|
|
52
|
-
loading?: JSX.Element;
|
|
53
|
-
success?: (data: T) => JSX.Element;
|
|
54
|
-
error?: (error: U) => JSX.Element;
|
|
55
|
-
}
|
|
56
|
-
export declare function showPromiseToast<T, U = unknown>(promise: Promise<T> | (() => Promise<T>), options: ToastPromiseOptions<T, U>): number;
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { Tooltip as KobalteTooltip } from "@kobalte/core/tooltip";
|
|
2
|
-
import { type JSX } from "solid-js";
|
|
3
|
-
import type { ComponentProps } from "solid-js";
|
|
4
|
-
export interface TooltipProps extends ComponentProps<typeof KobalteTooltip> {
|
|
5
|
-
value: JSX.Element;
|
|
6
|
-
class?: string;
|
|
7
|
-
contentClass?: string;
|
|
8
|
-
contentStyle?: JSX.CSSProperties;
|
|
9
|
-
inactive?: boolean;
|
|
10
|
-
forceOpen?: boolean;
|
|
11
|
-
}
|
|
12
|
-
export interface TooltipKeybindProps extends Omit<TooltipProps, "value"> {
|
|
13
|
-
title: string;
|
|
14
|
-
keybind: string;
|
|
15
|
-
}
|
|
16
|
-
export declare function TooltipKeybind(props: TooltipKeybindProps): JSX.Element;
|
|
17
|
-
export declare function Tooltip(props: TooltipProps): JSX.Element;
|