@opencode-ai/ui 0.0.0-dev-202608212222 → 0.0.0-dev-17880
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 +3 -3
- package/dist/context/i18n.d.ts +10 -7
- 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} +4 -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/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 +209 -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 +16 -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 +14 -0
- package/dist/{components → typography/text-shimmer}/text-shimmer.d.ts +1 -0
- package/dist/typography/wordmark/wordmark.d.ts +2 -0
- package/package.json +131 -13
- package/src/{components → actions/button}/button.tsx +10 -11
- package/src/actions/icon-button/icon-button.tsx +32 -0
- package/src/{v2/components/split-button-v2.css → actions/split-button/split-button.css} +1 -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 +1 -1
- 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/provider-icon.tsx +1 -1
- package/src/components/scroll-view.tsx +5 -20
- package/src/components/sticky-accordion-header.tsx +1 -1
- package/src/components/text-field.tsx +12 -4
- package/src/context/i18n.tsx +17 -14
- package/src/{components → data-display/accordion}/accordion.css +1 -26
- 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.tsx → data-display/line-comment/line-comment.tsx} +17 -15
- 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.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} +38 -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.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 +0 -2
- package/src/i18n/ar.ts +0 -2
- package/src/i18n/az.ts +0 -2
- package/src/i18n/bg.ts +0 -2
- package/src/i18n/bn.ts +0 -2
- package/src/i18n/br.ts +0 -2
- package/src/i18n/bs.ts +0 -2
- package/src/i18n/ca.ts +0 -2
- package/src/i18n/cs.ts +0 -2
- package/src/i18n/da.ts +0 -2
- package/src/i18n/de.ts +0 -2
- package/src/i18n/dv.ts +0 -2
- package/src/i18n/dz.ts +0 -2
- package/src/i18n/el.ts +0 -2
- package/src/i18n/en.ts +18 -4
- package/src/i18n/es.ts +0 -2
- package/src/i18n/et.ts +0 -2
- package/src/i18n/fa.ts +0 -2
- package/src/i18n/fi.ts +0 -2
- package/src/i18n/fo.ts +0 -2
- package/src/i18n/fr.ts +0 -2
- package/src/i18n/he.ts +199 -0
- package/src/i18n/hi.ts +0 -2
- package/src/i18n/hr.ts +0 -2
- package/src/i18n/hu.ts +0 -2
- package/src/i18n/hy.ts +0 -2
- package/src/i18n/id.ts +0 -2
- package/src/i18n/is.ts +0 -2
- package/src/i18n/it.ts +0 -2
- package/src/i18n/ja.ts +0 -2
- package/src/i18n/ka.ts +0 -2
- package/src/i18n/km.ts +0 -2
- package/src/i18n/ko.ts +0 -2
- package/src/i18n/lo.ts +0 -2
- package/src/i18n/lt.ts +0 -2
- package/src/i18n/lv.ts +0 -2
- package/src/i18n/mk.ts +0 -2
- package/src/i18n/mn.ts +0 -2
- package/src/i18n/ms.ts +0 -2
- package/src/i18n/my.ts +0 -2
- package/src/i18n/ne.ts +0 -2
- package/src/i18n/nl.ts +0 -2
- package/src/i18n/no.ts +0 -2
- package/src/i18n/pa.ts +0 -2
- package/src/i18n/pl.ts +0 -2
- package/src/i18n/ro.ts +0 -2
- package/src/i18n/ru.ts +0 -2
- package/src/i18n/si.ts +0 -2
- package/src/i18n/sk.ts +0 -2
- package/src/i18n/sl.ts +0 -2
- package/src/i18n/sq.ts +0 -2
- package/src/i18n/sr.ts +0 -2
- package/src/i18n/sv.ts +0 -2
- package/src/i18n/tg.ts +0 -2
- package/src/i18n/th.ts +0 -2
- package/src/i18n/tk.ts +0 -2
- package/src/i18n/tr.ts +0 -2
- package/src/i18n/uk.ts +0 -2
- package/src/i18n/ur.ts +0 -2
- package/src/i18n/uz.ts +0 -2
- package/src/i18n/vi.ts +0 -2
- package/src/i18n/zh.ts +0 -2
- package/src/i18n/zht.ts +0 -2
- package/src/{components/icon.tsx → icons/icon/additional-icons.ts} +8 -74
- package/src/icons/icon/icon.css +3 -0
- package/src/{v2/components → icons/icon}/icon.tsx +42 -9
- package/src/{v2/components/divider-v2.tsx → layout/divider/divider.tsx} +3 -3
- package/src/{v2/components/menu-v2.css → navigation/menu/menu.css} +121 -0
- package/src/{v2/components/menu-v2.tsx → navigation/menu/menu.tsx} +96 -32
- 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} +24 -9
- package/src/{components → navigation/tabs}/tabs.css +39 -229
- 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} +26 -0
- package/src/{v2/components/tooltip-v2.tsx → overlays/tooltip/tooltip.tsx} +18 -14
- package/src/styles/index.css +4 -20
- package/src/styles/tailwind/index.css +15 -1
- package/src/{v2/styles → styles/tokens}/theme.css +0 -12
- package/src/theme/context.tsx +19 -11
- package/src/theme/themes/oc-2.json +1 -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/{v2/components/wordmark-v2.tsx → typography/wordmark/wordmark.tsx} +1 -1
- 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/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/button-v2.css → actions/button/button.css} +0 -0
- /package/src/{v2/components/icon-button-v2.css → actions/icon-button/icon-button.css} +0 -0
- /package/src/{v2/components/avatar-v2.css → data-display/avatar/avatar.css} +0 -0
- /package/src/{v2/components/line-comment-v2.css → data-display/line-comment/line-comment.css} +0 -0
- /package/src/{v2/components/project-avatar-v2.css → data-display/project-avatar/project-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/{v2/components/field-v2.css → forms/field/field.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/text-input-v2.css → forms/text-input/text-input.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/segmented-control-v2.css → navigation/segmented-control/segmented-control.css} +0 -0
- /package/src/{v2/components → navigation}/tab-state-indicator.tsx +0 -0
- /package/src/{v2/components/file-tree-v2.css → styles/file-tree.css} +0 -0
- /package/src/{v2/styles → styles/tokens}/colors.css +0 -0
- /package/src/{v2/styles/tailwind.css → styles/tokens/index.css} +0 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { CloseButton, Content, Description, Title } from "@kobalte/core/dialog"
|
|
2
2
|
import { type ComponentProps, type JSXElement, type ParentProps, Show, children, splitProps } from "solid-js"
|
|
3
3
|
import { useI18n } from "../../context/i18n"
|
|
4
|
-
import "./dialog
|
|
4
|
+
import "./dialog.css"
|
|
5
5
|
|
|
6
6
|
export interface DialogProps extends ParentProps {
|
|
7
7
|
size?: "normal" | "large" | "x-large"
|
|
@@ -36,7 +36,7 @@ export function DialogBody(props: ParentProps & { class?: ComponentProps<"div">[
|
|
|
36
36
|
}
|
|
37
37
|
|
|
38
38
|
export function DialogTitle(props: ParentProps) {
|
|
39
|
-
return <
|
|
39
|
+
return <Title data-slot="dialog-header-title">{props.children}</Title>
|
|
40
40
|
}
|
|
41
41
|
|
|
42
42
|
export function DialogTitleGroup(props: DialogTitleGroupProps) {
|
|
@@ -45,8 +45,8 @@ export function DialogTitleGroup(props: DialogTitleGroupProps) {
|
|
|
45
45
|
|
|
46
46
|
return (
|
|
47
47
|
<div data-slot="dialog-title-group">
|
|
48
|
-
<Show when={title()}>{(t) => <
|
|
49
|
-
<
|
|
48
|
+
<Show when={title()}>{(t) => <Title data-slot="dialog-title">{t()}</Title>}</Show>
|
|
49
|
+
<Description data-slot="dialog-description">{description()}</Description>
|
|
50
50
|
</div>
|
|
51
51
|
)
|
|
52
52
|
}
|
|
@@ -59,8 +59,8 @@ export function DialogHeader(props: DialogHeaderProps) {
|
|
|
59
59
|
return (
|
|
60
60
|
<div data-slot="dialog-header" data-hide-close={hideClose() ? "" : undefined}>
|
|
61
61
|
{local.children}
|
|
62
|
-
{!hideClose()
|
|
63
|
-
<
|
|
62
|
+
<Show when={!hideClose()}>
|
|
63
|
+
<CloseButton data-slot="dialog-close-button" aria-label={local.closeLabel ?? i18n.t("ui.common.close")}>
|
|
64
64
|
<svg
|
|
65
65
|
width="16"
|
|
66
66
|
height="16"
|
|
@@ -75,8 +75,8 @@ export function DialogHeader(props: DialogHeaderProps) {
|
|
|
75
75
|
stroke-linejoin="round"
|
|
76
76
|
/>
|
|
77
77
|
</svg>
|
|
78
|
-
</
|
|
79
|
-
|
|
78
|
+
</CloseButton>
|
|
79
|
+
</Show>
|
|
80
80
|
</div>
|
|
81
81
|
)
|
|
82
82
|
}
|
|
@@ -92,7 +92,7 @@ export function Dialog(props: DialogProps) {
|
|
|
92
92
|
data-size={local.size || "normal"}
|
|
93
93
|
>
|
|
94
94
|
<div data-slot="dialog-container" class={local.containerClass}>
|
|
95
|
-
<
|
|
95
|
+
<Content
|
|
96
96
|
data-slot="dialog-content"
|
|
97
97
|
classList={{
|
|
98
98
|
...local.classList,
|
|
@@ -108,10 +108,8 @@ export function Dialog(props: DialogProps) {
|
|
|
108
108
|
}}
|
|
109
109
|
>
|
|
110
110
|
{local.children}
|
|
111
|
-
</
|
|
111
|
+
</Content>
|
|
112
112
|
</div>
|
|
113
113
|
</div>
|
|
114
114
|
)
|
|
115
115
|
}
|
|
116
|
-
|
|
117
|
-
export const DialogV2 = Dialog
|
|
@@ -39,6 +39,32 @@
|
|
|
39
39
|
}
|
|
40
40
|
}
|
|
41
41
|
|
|
42
|
+
[data-component="tooltip-v2"][data-appearance="standard"] {
|
|
43
|
+
display: block;
|
|
44
|
+
max-width: 320px;
|
|
45
|
+
padding: 2px 8px;
|
|
46
|
+
border: 1px solid var(--border-weak-base, rgba(0, 0, 0, 0.07));
|
|
47
|
+
border-radius: var(--radius-sm);
|
|
48
|
+
background: var(--surface-float-base);
|
|
49
|
+
color: var(--text-invert-strong);
|
|
50
|
+
box-shadow: var(--shadow-md);
|
|
51
|
+
font-family: var(--font-family-sans);
|
|
52
|
+
font-size: var(--font-size-small);
|
|
53
|
+
font-style: normal;
|
|
54
|
+
font-weight: var(--font-weight-medium);
|
|
55
|
+
line-height: var(--line-height-large);
|
|
56
|
+
letter-spacing: var(--letter-spacing-normal);
|
|
57
|
+
font-variant-numeric: normal;
|
|
58
|
+
font-variation-settings: normal;
|
|
59
|
+
user-select: text;
|
|
60
|
+
animation: none;
|
|
61
|
+
|
|
62
|
+
&[data-closed]:not([data-force-open="true"]) {
|
|
63
|
+
opacity: 0;
|
|
64
|
+
animation: none;
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
|
|
42
68
|
@keyframes tooltipV2In {
|
|
43
69
|
from {
|
|
44
70
|
opacity: 0;
|
|
@@ -1,11 +1,12 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { Content, Portal, Root, Trigger } from "@kobalte/core/tooltip"
|
|
2
2
|
import { createEffect, Match, onCleanup, splitProps, Switch, type JSX } from "solid-js"
|
|
3
3
|
import type { ComponentProps } from "solid-js"
|
|
4
4
|
import { createStore } from "solid-js/store"
|
|
5
|
-
import "./tooltip
|
|
5
|
+
import "./tooltip.css"
|
|
6
6
|
|
|
7
|
-
export interface
|
|
7
|
+
export interface TooltipProps extends ComponentProps<typeof Root> {
|
|
8
8
|
value: JSX.Element
|
|
9
|
+
appearance?: "standard" | "compact"
|
|
9
10
|
class?: string
|
|
10
11
|
contentClass?: string
|
|
11
12
|
contentStyle?: JSX.CSSProperties
|
|
@@ -13,7 +14,7 @@ export interface TooltipV2Props extends ComponentProps<typeof KobalteTooltip> {
|
|
|
13
14
|
forceOpen?: boolean
|
|
14
15
|
}
|
|
15
16
|
|
|
16
|
-
export function
|
|
17
|
+
export function Tooltip(props: TooltipProps) {
|
|
17
18
|
let ref: HTMLDivElement | undefined
|
|
18
19
|
const [state, setState] = createStore({
|
|
19
20
|
open: false,
|
|
@@ -22,6 +23,7 @@ export function TooltipV2(props: TooltipV2Props) {
|
|
|
22
23
|
})
|
|
23
24
|
const [local, others] = splitProps(props, [
|
|
24
25
|
"children",
|
|
26
|
+
"appearance",
|
|
25
27
|
"class",
|
|
26
28
|
"contentClass",
|
|
27
29
|
"contentStyle",
|
|
@@ -32,6 +34,7 @@ export function TooltipV2(props: TooltipV2Props) {
|
|
|
32
34
|
])
|
|
33
35
|
|
|
34
36
|
const close = () => setState("open", false)
|
|
37
|
+
const controlled = () => local.forceOpen !== undefined
|
|
35
38
|
|
|
36
39
|
const inside = () => {
|
|
37
40
|
const active = document.activeElement
|
|
@@ -86,16 +89,16 @@ export function TooltipV2(props: TooltipV2Props) {
|
|
|
86
89
|
<Switch>
|
|
87
90
|
<Match when={local.inactive}>{local.children}</Match>
|
|
88
91
|
<Match when={true}>
|
|
89
|
-
<
|
|
92
|
+
<Root
|
|
90
93
|
gutter={4}
|
|
91
94
|
openDelay={400}
|
|
92
95
|
skipDelayDuration={300}
|
|
93
96
|
{...others}
|
|
94
97
|
closeDelay={0}
|
|
95
98
|
ignoreSafeArea={local.ignoreSafeArea ?? true}
|
|
96
|
-
open={local.forceOpen
|
|
99
|
+
open={controlled() ? local.forceOpen : state.open}
|
|
97
100
|
onOpenChange={(open) => {
|
|
98
|
-
if (
|
|
101
|
+
if (controlled()) return
|
|
99
102
|
if (state.block && open) return
|
|
100
103
|
if (justClickedTrigger) {
|
|
101
104
|
justClickedTrigger = false
|
|
@@ -104,7 +107,7 @@ export function TooltipV2(props: TooltipV2Props) {
|
|
|
104
107
|
setState("open", open)
|
|
105
108
|
}}
|
|
106
109
|
>
|
|
107
|
-
<
|
|
110
|
+
<Trigger
|
|
108
111
|
ref={ref}
|
|
109
112
|
as="div"
|
|
110
113
|
data-component="tooltip-v2-trigger"
|
|
@@ -118,14 +121,15 @@ export function TooltipV2(props: TooltipV2Props) {
|
|
|
118
121
|
onFocusOut={() => requestAnimationFrame(() => drop())}
|
|
119
122
|
>
|
|
120
123
|
{local.children}
|
|
121
|
-
</
|
|
122
|
-
<
|
|
123
|
-
<
|
|
124
|
+
</Trigger>
|
|
125
|
+
<Portal>
|
|
126
|
+
<Content
|
|
124
127
|
ref={(el) => {
|
|
125
128
|
const theme = ref?.closest("[data-theme]")?.getAttribute("data-theme")
|
|
126
129
|
if (theme) el.setAttribute("data-theme", theme)
|
|
127
130
|
}}
|
|
128
131
|
data-component="tooltip-v2"
|
|
132
|
+
data-appearance={local.appearance ?? "compact"}
|
|
129
133
|
data-placement={props.placement}
|
|
130
134
|
data-force-open={local.forceOpen}
|
|
131
135
|
class={local.contentClass}
|
|
@@ -138,9 +142,9 @@ export function TooltipV2(props: TooltipV2Props) {
|
|
|
138
142
|
}}
|
|
139
143
|
>
|
|
140
144
|
{local.value}
|
|
141
|
-
</
|
|
142
|
-
</
|
|
143
|
-
</
|
|
145
|
+
</Content>
|
|
146
|
+
</Portal>
|
|
147
|
+
</Root>
|
|
144
148
|
</Match>
|
|
145
149
|
</Switch>
|
|
146
150
|
)
|
package/src/styles/index.css
CHANGED
|
@@ -6,47 +6,31 @@
|
|
|
6
6
|
@import "./base.css" layer(base);
|
|
7
7
|
@import "katex/dist/katex.min.css" layer(base);
|
|
8
8
|
|
|
9
|
-
@import "../
|
|
9
|
+
@import "../data-display/accordion/accordion.css" layer(components);
|
|
10
10
|
@import "../components/animated-number.css" layer(components);
|
|
11
11
|
@import "../components/app-icon.css" layer(components);
|
|
12
|
-
@import "../components/avatar.css" layer(components);
|
|
13
|
-
@import "../components/button.css" layer(components);
|
|
14
12
|
@import "../components/card.css" layer(components);
|
|
15
|
-
@import "../
|
|
13
|
+
@import "../forms/checkbox/checkbox.css" layer(components);
|
|
16
14
|
@import "../components/collapsible.css" layer(components);
|
|
17
|
-
@import "../components/diff-changes.css" layer(components);
|
|
18
15
|
@import "../components/context-menu.css" layer(components);
|
|
19
|
-
@import "../components/dropdown-menu.css" layer(components);
|
|
20
|
-
@import "../components/dialog.css" layer(components);
|
|
21
16
|
@import "../components/file-icon.css" layer(components);
|
|
22
17
|
@import "../components/hover-card.css" layer(components);
|
|
23
18
|
@import "../components/provider-icon.css" layer(components);
|
|
24
19
|
@import "../components/dock-surface.css" layer(components);
|
|
25
|
-
@import "../components/icon.css" layer(components);
|
|
26
|
-
@import "../components/icon-button.css" layer(components);
|
|
27
20
|
@import "../components/image-preview.css" layer(components);
|
|
28
|
-
@import "../
|
|
21
|
+
@import "../forms/inline-input/inline-input.css" layer(components);
|
|
29
22
|
@import "../components/text-field.css" layer(components);
|
|
30
|
-
@import "../components/inline-input.css" layer(components);
|
|
31
23
|
@import "../components/list.css" layer(components);
|
|
32
24
|
@import "../components/logo.css" layer(components);
|
|
33
25
|
@import "../components/popover.css" layer(components);
|
|
34
26
|
@import "../components/progress.css" layer(components);
|
|
35
|
-
@import "../components/progress-circle.css" layer(components);
|
|
36
|
-
@import "../components/radio-group.css" layer(components);
|
|
37
27
|
@import "../components/resize-handle.css" layer(components);
|
|
38
|
-
@import "../components/select.css" layer(components);
|
|
39
28
|
@import "../components/spinner.css" layer(components);
|
|
40
|
-
@import "../components/switch.css" layer(components);
|
|
41
29
|
@import "../components/scroll-view.css" layer(components);
|
|
42
30
|
@import "../components/sticky-accordion-header.css" layer(components);
|
|
43
|
-
@import "../
|
|
44
|
-
@import "../components/tag.css" layer(components);
|
|
31
|
+
@import "../navigation/tabs/tabs.css" layer(components);
|
|
45
32
|
@import "../components/text-reveal.css" layer(components);
|
|
46
33
|
@import "../components/text-strikethrough.css" layer(components);
|
|
47
|
-
@import "../components/text-shimmer.css" layer(components);
|
|
48
|
-
@import "../components/toast.css" layer(components);
|
|
49
|
-
@import "../components/tooltip.css" layer(components);
|
|
50
34
|
@import "../components/typewriter.css" layer(components);
|
|
51
35
|
|
|
52
36
|
@import "./utilities.css" layer(utilities);
|
|
@@ -1,7 +1,21 @@
|
|
|
1
1
|
@layer theme, base, components, utilities;
|
|
2
2
|
|
|
3
3
|
@import "tailwindcss/theme.css" layer(theme);
|
|
4
|
-
@import "tailwindcss/utilities.css" layer(utilities) source(
|
|
4
|
+
@import "tailwindcss/utilities.css" layer(utilities) source(none);
|
|
5
|
+
@source "../../../../app/src";
|
|
6
|
+
@source "../../../../app/index.html";
|
|
7
|
+
@source not "../../../../app/src/i18n";
|
|
8
|
+
@source not "../../../../app/src/**/*.test.{ts,tsx}";
|
|
9
|
+
@source "../../../../desktop/src/renderer";
|
|
10
|
+
@source not "../../../../desktop/src/renderer/**/*.test.{ts,tsx}";
|
|
11
|
+
@source "../../../../enterprise/src";
|
|
12
|
+
@source "../../../../session-ui/src";
|
|
13
|
+
@source not "../../../../session-ui/src/**/*.test.{ts,tsx}";
|
|
14
|
+
@source "../../../../storybook";
|
|
15
|
+
@source "../../../src";
|
|
16
|
+
@source not "../../../src/assets";
|
|
17
|
+
@source not "../../../src/i18n";
|
|
18
|
+
@source not "../../../src/**/*.test.{ts,tsx}";
|
|
5
19
|
@import "./utilities.css";
|
|
6
20
|
|
|
7
21
|
@import "../index.css";
|
|
@@ -1,16 +1,4 @@
|
|
|
1
1
|
@layer theme {
|
|
2
|
-
html[data-theme="oc-2"] body:not([data-new-layout]) {
|
|
3
|
-
--text-diff-add-base: light-dark(#167517, #c4ffc0);
|
|
4
|
-
--text-diff-delete-base: light-dark(#fa3012, #ec2f14);
|
|
5
|
-
--syntax-comment: light-dark(#7a7a7a, #8f8f8f);
|
|
6
|
-
--syntax-keyword: light-dark(#a753ae, #edb2f1);
|
|
7
|
-
--syntax-string: #00ceb9;
|
|
8
|
-
--syntax-primitive: light-dark(#034cff, #8cb0ff);
|
|
9
|
-
--syntax-property: light-dark(#a753ae, #fab283);
|
|
10
|
-
--syntax-type: light-dark(#8a6f00, #fcd53a);
|
|
11
|
-
--syntax-critical: light-dark(#ff8c00, #fab283);
|
|
12
|
-
}
|
|
13
|
-
|
|
14
2
|
:root {
|
|
15
3
|
color-scheme: light;
|
|
16
4
|
|
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",
|
|
@@ -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(
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { createUniqueId, type ComponentProps } from "solid-js"
|
|
2
2
|
|
|
3
|
-
export function
|
|
3
|
+
export function Wordmark(props: Pick<ComponentProps<"svg">, "class">) {
|
|
4
4
|
const mask = createUniqueId()
|
|
5
5
|
const maskGradient = createUniqueId()
|
|
6
6
|
|
|
@@ -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;
|