@rimelight/ui 0.0.33 → 0.0.34
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +157 -157
- package/package.json +105 -105
- package/src/components/astro/RLAAspectRatio.astro +2 -2
- package/src/components/astro/RLAButton.astro +141 -139
- package/src/components/astro/RLAChart.astro +19 -34
- package/src/components/astro/RLAHead.astro +427 -196
- package/src/components/astro/RLAHeader.astro +66 -59
- package/src/components/astro/RLAImage.astro +61 -19
- package/src/components/astro/RLALink.astro +22 -23
- package/src/components/astro/RLALinkGroup.astro +66 -4
- package/src/components/astro/RLALocaleSelector.astro +136 -113
- package/src/components/astro/RLAMain.astro +8 -3
- package/src/components/astro/RLAMarquee.astro +9 -2
- package/src/components/astro/RLANavigationMenu.astro +245 -56
- package/src/components/astro/RLAPagination.astro +2 -4
- package/src/components/astro/RLAProgress.astro +8 -2
- package/src/components/astro/RLASelect.astro +38 -24
- package/src/components/astro/RLASlideover.astro +66 -1
- package/src/components/astro/RLASlider.astro +14 -14
- package/src/components/astro/RLASplitter.astro +14 -2
- package/src/components/astro/RLAStickySurface.astro +9 -2
- package/src/components/vue/RLVCheckbox.vue +68 -68
- package/src/components/vue/RLVForm.vue +44 -44
- package/src/components/vue/RLVFormField.vue +58 -58
- package/src/components/vue/RLVInput.vue +93 -93
- package/src/components/vue/RLVPost.vue +63 -63
- package/src/components/vue/RLVPosts.vue +21 -21
- package/src/components/vue/RLVToast.vue +68 -68
- package/src/components/vue/RLVToaster.vue +29 -29
- package/src/composables/index.ts +3 -3
- package/src/composables/useHeaderStore.ts +13 -14
- package/src/composables/useScrollToTop.ts +62 -62
- package/src/composables/useToast.ts +43 -42
- package/src/config/index.ts +1 -0
- package/src/config/security.ts +220 -0
- package/src/integrations/ui.ts +199 -199
- package/src/middleware/security.ts +75 -15
- package/src/plugins/index.ts +2 -2
- package/src/plugins/starlightDocsApi/index.ts +272 -272
- package/src/presets/defaults.ts +297 -297
- package/src/presets/index.ts +683 -637
- package/src/styles/index.css +160 -160
- package/src/themes/3d-hover.theme.ts +13 -13
- package/src/themes/accordion.theme.ts +13 -13
- package/src/themes/alert.theme.ts +131 -125
- package/src/themes/app.theme.ts +13 -13
- package/src/themes/audio.theme.ts +13 -13
- package/src/themes/avatar.theme.ts +84 -84
- package/src/themes/badge.theme.ts +169 -163
- package/src/themes/banner.theme.ts +13 -13
- package/src/themes/browser-mockup.theme.ts +13 -13
- package/src/themes/button.theme.ts +224 -202
- package/src/themes/calendar.theme.ts +13 -13
- package/src/themes/card.theme.ts +42 -42
- package/src/themes/changelog.theme.ts +13 -13
- package/src/themes/chart.theme.ts +22 -22
- package/src/themes/chat-message.theme.ts +13 -13
- package/src/themes/chat-messages.theme.ts +13 -13
- package/src/themes/chat-palette.theme.ts +13 -13
- package/src/themes/chat-prompt-submit.theme.ts +13 -13
- package/src/themes/chat-prompt.theme.ts +13 -13
- package/src/themes/chat-reasoning.theme.ts +13 -13
- package/src/themes/chat-shimmer.theme.ts +13 -13
- package/src/themes/chat-tool.theme.ts +13 -13
- package/src/themes/chat.theme.ts +13 -13
- package/src/themes/checkbox.theme.ts +50 -50
- package/src/themes/chip.theme.ts +74 -74
- package/src/themes/color-picker.theme.ts +13 -13
- package/src/themes/command-palette.theme.ts +13 -13
- package/src/themes/compare.theme.ts +13 -13
- package/src/themes/confirm.theme.ts +48 -48
- package/src/themes/container.theme.ts +13 -13
- package/src/themes/context-menu.theme.ts +13 -13
- package/src/themes/dashboard-group.theme.ts +13 -13
- package/src/themes/dashboard-navbar.theme.ts +13 -13
- package/src/themes/dashboard-panel.theme.ts +13 -13
- package/src/themes/dashboard-resize-handle.theme.ts +13 -13
- package/src/themes/dashboard-search-button.theme.ts +13 -13
- package/src/themes/dashboard-search.theme.ts +13 -13
- package/src/themes/dashboard-sidebar-collapse.theme.ts +13 -13
- package/src/themes/dashboard-sidebar-toggle.theme.ts +13 -13
- package/src/themes/dashboard-sidebar.theme.ts +13 -13
- package/src/themes/dashboard-toolbar.theme.ts +13 -13
- package/src/themes/dock.theme.ts +13 -13
- package/src/themes/drawer.theme.ts +61 -61
- package/src/themes/dropdown-menu.theme.ts +29 -29
- package/src/themes/editor.theme.ts +13 -13
- package/src/themes/empty.theme.ts +13 -13
- package/src/themes/error.theme.ts +13 -13
- package/src/themes/field-group.theme.ts +24 -24
- package/src/themes/fieldset.theme.ts +13 -13
- package/src/themes/floating-action.theme.ts +13 -13
- package/src/themes/footer.theme.ts +30 -30
- package/src/themes/form.theme.ts +13 -13
- package/src/themes/gallery.theme.ts +13 -13
- package/src/themes/head.theme.ts +13 -13
- package/src/themes/header.theme.ts +45 -46
- package/src/themes/icon.theme.ts +23 -23
- package/src/themes/image.theme.ts +23 -19
- package/src/themes/input-date.theme.ts +13 -13
- package/src/themes/input-menu.theme.ts +35 -35
- package/src/themes/input-number.theme.ts +13 -13
- package/src/themes/input-tags.theme.ts +13 -13
- package/src/themes/input-time.theme.ts +13 -13
- package/src/themes/input.theme.ts +42 -42
- package/src/themes/kbd.theme.ts +95 -89
- package/src/themes/knob.theme.ts +13 -13
- package/src/themes/link-group.theme.ts +32 -32
- package/src/themes/link.theme.ts +13 -13
- package/src/themes/listbox.theme.ts +13 -13
- package/src/themes/locale-selector.theme.ts +49 -49
- package/src/themes/logo.theme.ts +13 -13
- package/src/themes/main.theme.ts +13 -13
- package/src/themes/megamenu.theme.ts +13 -13
- package/src/themes/meter.theme.ts +13 -13
- package/src/themes/navigation-menu.theme.ts +44 -27
- package/src/themes/page-aside.theme.ts +13 -13
- package/src/themes/page-body.theme.ts +13 -13
- package/src/themes/page-header.theme.ts +13 -13
- package/src/themes/page-section.theme.ts +187 -187
- package/src/themes/page.theme.ts +13 -13
- package/src/themes/password.theme.ts +13 -13
- package/src/themes/phone-mockup.theme.ts +13 -13
- package/src/themes/placeholder.theme.ts +15 -15
- package/src/themes/post.theme.ts +33 -33
- package/src/themes/pricing-plan.theme.ts +13 -13
- package/src/themes/pricing-table.theme.ts +13 -13
- package/src/themes/progress.theme.ts +38 -38
- package/src/themes/prose.theme.ts +13 -13
- package/src/themes/qr-code.theme.ts +13 -13
- package/src/themes/quote.theme.ts +13 -13
- package/src/themes/radio-group.theme.ts +13 -13
- package/src/themes/rating.theme.ts +13 -13
- package/src/themes/scroll-area.theme.ts +26 -26
- package/src/themes/scroll-to-top.theme.ts +52 -52
- package/src/themes/select.theme.ts +29 -29
- package/src/themes/separator.theme.ts +147 -147
- package/src/themes/sidebar.theme.ts +38 -38
- package/src/themes/skeleton.theme.ts +21 -21
- package/src/themes/slideover.theme.ts +4 -4
- package/src/themes/slider.theme.ts +36 -36
- package/src/themes/speed-dial.theme.ts +13 -13
- package/src/themes/spinner.theme.ts +34 -34
- package/src/themes/splitter.theme.ts +23 -23
- package/src/themes/spoiler.theme.ts +13 -13
- package/src/themes/stepper.theme.ts +13 -13
- package/src/themes/switch.theme.ts +67 -67
- package/src/themes/table-of-contents.theme.ts +48 -48
- package/src/themes/tabs.theme.ts +52 -52
- package/src/themes/textarea.theme.ts +27 -27
- package/src/themes/theme-selector.theme.ts +15 -15
- package/src/themes/timeline.theme.ts +13 -13
- package/src/themes/toast.theme.ts +31 -31
- package/src/themes/tooltip.theme.ts +28 -28
- package/src/themes/tour.theme.ts +13 -13
- package/src/themes/tree.theme.ts +13 -13
- package/src/themes/user.theme.ts +13 -13
- package/src/themes/video.theme.ts +17 -17
- package/src/themes/watermark.theme.ts +13 -13
- package/src/themes/window-mockup.theme.ts +13 -13
- package/src/types/components/3d-hover.ts +11 -11
- package/src/types/components/alert.ts +2 -2
- package/src/types/components/app.ts +11 -11
- package/src/types/components/audio.ts +11 -11
- package/src/types/components/avatar-group.ts +11 -11
- package/src/types/components/avatar.ts +60 -60
- package/src/types/components/badge.ts +2 -2
- package/src/types/components/banner.ts +11 -11
- package/src/types/components/browser-mockup.ts +11 -11
- package/src/types/components/button.ts +74 -81
- package/src/types/components/calendar.ts +11 -11
- package/src/types/components/changelog.ts +11 -11
- package/src/types/components/chart.ts +2 -1
- package/src/types/components/chat-message.ts +11 -11
- package/src/types/components/chat-messages.ts +11 -11
- package/src/types/components/chat-palette.ts +11 -11
- package/src/types/components/chat-prompt-submit.ts +11 -11
- package/src/types/components/chat-prompt.ts +11 -11
- package/src/types/components/chat-reasoning.ts +11 -11
- package/src/types/components/chat-shimmer.ts +11 -11
- package/src/types/components/chat-tool.ts +11 -11
- package/src/types/components/chat.ts +11 -11
- package/src/types/components/checkbox.ts +2 -2
- package/src/types/components/chip.ts +17 -17
- package/src/types/components/collapsible.ts +2 -1
- package/src/types/components/color-picker.ts +11 -11
- package/src/types/components/command-palette.ts +11 -11
- package/src/types/components/compare.ts +11 -11
- package/src/types/components/container.ts +17 -17
- package/src/types/components/context-menu.ts +11 -11
- package/src/types/components/dashboard-group.ts +11 -11
- package/src/types/components/dashboard-navbar.ts +11 -11
- package/src/types/components/dashboard-panel.ts +11 -11
- package/src/types/components/dashboard-resize-handle.ts +11 -11
- package/src/types/components/dashboard-search-button.ts +11 -11
- package/src/types/components/dashboard-search.ts +11 -11
- package/src/types/components/dashboard-sidebar-collapse.ts +11 -11
- package/src/types/components/dashboard-sidebar-toggle.ts +11 -11
- package/src/types/components/dashboard-sidebar.ts +11 -11
- package/src/types/components/dashboard-toolbar.ts +11 -11
- package/src/types/components/dock.ts +11 -11
- package/src/types/components/dropdown-menu.ts +2 -1
- package/src/types/components/editor.ts +11 -11
- package/src/types/components/empty.ts +11 -11
- package/src/types/components/error.ts +11 -11
- package/src/types/components/fieldset.ts +11 -11
- package/src/types/components/file-upload.ts +2 -1
- package/src/types/components/floating-action.ts +11 -11
- package/src/types/components/form.ts +19 -19
- package/src/types/components/gallery.ts +11 -11
- package/src/types/components/icon.ts +19 -19
- package/src/types/components/image.ts +32 -28
- package/src/types/components/index.ts +134 -135
- package/src/types/components/input-date.ts +11 -11
- package/src/types/components/input-menu.ts +44 -43
- package/src/types/components/input-number.ts +11 -11
- package/src/types/components/input-pin.ts +36 -35
- package/src/types/components/input-tags.ts +11 -11
- package/src/types/components/input-time.ts +11 -11
- package/src/types/components/input.ts +2 -2
- package/src/types/components/knob.ts +11 -11
- package/src/types/components/link-group.ts +45 -23
- package/src/types/components/link.ts +4 -0
- package/src/types/components/listbox.ts +11 -11
- package/src/types/components/locale-selector.ts +33 -33
- package/src/types/components/logo.ts +32 -31
- package/src/types/components/main.ts +17 -17
- package/src/types/components/megamenu.ts +11 -11
- package/src/types/components/meter.ts +11 -11
- package/src/types/components/modal.ts +39 -39
- package/src/types/components/navigation-menu.ts +59 -54
- package/src/types/components/page-aside.ts +11 -11
- package/src/types/components/page-body.ts +11 -11
- package/src/types/components/page-header.ts +11 -11
- package/src/types/components/page.ts +11 -11
- package/src/types/components/password.ts +11 -11
- package/src/types/components/phone-mockup.ts +5 -5
- package/src/types/components/pin-input.ts +11 -11
- package/src/types/components/popover.ts +23 -23
- package/src/types/components/post.ts +35 -35
- package/src/types/components/pricing-plan.ts +11 -11
- package/src/types/components/pricing-table.ts +11 -11
- package/src/types/components/progress.ts +33 -33
- package/src/types/components/prose.ts +11 -11
- package/src/types/components/qr-code.ts +11 -11
- package/src/types/components/radio-group.ts +11 -11
- package/src/types/components/rating.ts +11 -11
- package/src/types/components/scroll-area.ts +23 -23
- package/src/types/components/scroll-to-top.ts +2 -2
- package/src/types/components/select.ts +2 -1
- package/src/types/components/separator.ts +19 -19
- package/src/types/components/sidebar.ts +87 -72
- package/src/types/components/slideover.ts +31 -31
- package/src/types/components/slider.ts +2 -2
- package/src/types/components/speed-dial.ts +11 -11
- package/src/types/components/spinner.ts +25 -25
- package/src/types/components/splitter.ts +19 -19
- package/src/types/components/spoiler.ts +11 -11
- package/src/types/components/stepper.ts +11 -11
- package/src/types/components/sticky-surface.ts +19 -19
- package/src/types/components/switch.ts +41 -41
- package/src/types/components/table-of-contents.ts +17 -17
- package/src/types/components/tabs.ts +2 -1
- package/src/types/components/textarea.ts +2 -1
- package/src/types/components/theme-selector.ts +15 -15
- package/src/types/components/timeline.ts +11 -11
- package/src/types/components/toast.ts +2 -1
- package/src/types/components/tooltip.ts +23 -23
- package/src/types/components/tour.ts +11 -11
- package/src/types/components/tree.ts +11 -11
- package/src/types/components/user.ts +11 -11
- package/src/types/components/watermark.ts +11 -11
- package/src/types/components/window-mockup.ts +11 -11
- package/src/types/theme.ts +10 -0
- package/src/utils/docs.ts +215 -189
- package/src/utils/headerStack.ts +95 -95
- package/src/utils/index.ts +5 -5
- package/src/components/astro/RLABlogPost.astro +0 -7
- package/src/components/astro/RLABlogPosts.astro +0 -9
- package/src/components/astro/RLAPosts.astro +0 -23
- package/src/themes/posts.theme.ts +0 -13
- package/src/types/components/posts.ts +0 -11
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
-
|
|
3
|
-
export const createSpoilerTheme = () =>
|
|
4
|
-
defineTheme({
|
|
5
|
-
slots: ["root"],
|
|
6
|
-
base: {
|
|
7
|
-
root: ""
|
|
8
|
-
},
|
|
9
|
-
variants: {},
|
|
10
|
-
defaultVariants: {}
|
|
11
|
-
})
|
|
12
|
-
|
|
13
|
-
export default createSpoilerTheme()
|
|
1
|
+
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
+
|
|
3
|
+
export const createSpoilerTheme = () =>
|
|
4
|
+
defineTheme({
|
|
5
|
+
slots: ["root"],
|
|
6
|
+
base: {
|
|
7
|
+
root: ""
|
|
8
|
+
},
|
|
9
|
+
variants: {},
|
|
10
|
+
defaultVariants: {}
|
|
11
|
+
})
|
|
12
|
+
|
|
13
|
+
export default createSpoilerTheme()
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
-
|
|
3
|
-
export const createStepperTheme = () =>
|
|
4
|
-
defineTheme({
|
|
5
|
-
slots: ["root"],
|
|
6
|
-
base: {
|
|
7
|
-
root: ""
|
|
8
|
-
},
|
|
9
|
-
variants: {},
|
|
10
|
-
defaultVariants: {}
|
|
11
|
-
})
|
|
12
|
-
|
|
13
|
-
export default createStepperTheme()
|
|
1
|
+
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
+
|
|
3
|
+
export const createStepperTheme = () =>
|
|
4
|
+
defineTheme({
|
|
5
|
+
slots: ["root"],
|
|
6
|
+
base: {
|
|
7
|
+
root: ""
|
|
8
|
+
},
|
|
9
|
+
variants: {},
|
|
10
|
+
defaultVariants: {}
|
|
11
|
+
})
|
|
12
|
+
|
|
13
|
+
export default createStepperTheme()
|
|
@@ -1,67 +1,67 @@
|
|
|
1
|
-
import { defaultColors } from "../presets/defaults"
|
|
2
|
-
import { defineTheme } from "../utils/defineTheme"
|
|
3
|
-
|
|
4
|
-
export const createSwitchTheme = (colors: string[] = defaultColors) =>
|
|
5
|
-
defineTheme({
|
|
6
|
-
slots: ["root", "input", "track", "thumb", "label"],
|
|
7
|
-
base: {
|
|
8
|
-
root: "inline-flex items-center gap-2 cursor-pointer select-none",
|
|
9
|
-
input: "absolute opacity-0 size-0 pointer-events-none peer",
|
|
10
|
-
track: [
|
|
11
|
-
"inline-flex h-5 w-9 shrink-0 items-center rounded-full border-2 border-transparent bg-muted transition-all focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
|
|
12
|
-
"peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
|
|
13
|
-
],
|
|
14
|
-
thumb:
|
|
15
|
-
"pointer-events-none block size-4 rounded-full bg-background shadow-lg ring-0 transition-transform duration-200 translate-x-0",
|
|
16
|
-
label: "text-sm text-foreground leading-none"
|
|
17
|
-
},
|
|
18
|
-
variants: {
|
|
19
|
-
color: Object.fromEntries(
|
|
20
|
-
colors.map((color) => [
|
|
21
|
-
color,
|
|
22
|
-
{
|
|
23
|
-
root: "rl-color-" + color,
|
|
24
|
-
track: `peer-checked:bg-[var(--rl-bg)] focus-within:ring-[var(--rl-ring)]/50`
|
|
25
|
-
}
|
|
26
|
-
])
|
|
27
|
-
),
|
|
28
|
-
size: {
|
|
29
|
-
sm: { track: "h-4 w-7", thumb: "size-3", label: "text-xs" },
|
|
30
|
-
md: { track: "h-5 w-9", thumb: "size-4", label: "text-sm" },
|
|
31
|
-
lg: { track: "h-6 w-11", thumb: "size-5", label: "text-base" }
|
|
32
|
-
},
|
|
33
|
-
checked: {
|
|
34
|
-
true: { thumb: "translate-x-full" },
|
|
35
|
-
false: { thumb: "translate-x-0" }
|
|
36
|
-
},
|
|
37
|
-
theme: {
|
|
38
|
-
flat: { root: "rl-flat" },
|
|
39
|
-
light: { root: "rl-light" },
|
|
40
|
-
dark: { root: "rl-dark" }
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
compoundVariants: [
|
|
44
|
-
{
|
|
45
|
-
size: "sm",
|
|
46
|
-
checked: true,
|
|
47
|
-
classNames: { thumb: "translate-x-3" }
|
|
48
|
-
},
|
|
49
|
-
{
|
|
50
|
-
size: "md",
|
|
51
|
-
checked: true,
|
|
52
|
-
classNames: { thumb: "translate-x-4" }
|
|
53
|
-
},
|
|
54
|
-
{
|
|
55
|
-
size: "lg",
|
|
56
|
-
checked: true,
|
|
57
|
-
classNames: { thumb: "translate-x-5" }
|
|
58
|
-
}
|
|
59
|
-
],
|
|
60
|
-
defaultVariants: {
|
|
61
|
-
color: "primary",
|
|
62
|
-
size: "md",
|
|
63
|
-
checked: false
|
|
64
|
-
}
|
|
65
|
-
})
|
|
66
|
-
|
|
67
|
-
export default createSwitchTheme()
|
|
1
|
+
import { defaultColors } from "../presets/defaults"
|
|
2
|
+
import { defineTheme } from "../utils/defineTheme"
|
|
3
|
+
|
|
4
|
+
export const createSwitchTheme = (colors: string[] = defaultColors) =>
|
|
5
|
+
defineTheme({
|
|
6
|
+
slots: ["root", "input", "track", "thumb", "label"],
|
|
7
|
+
base: {
|
|
8
|
+
root: "inline-flex items-center gap-2 cursor-pointer select-none",
|
|
9
|
+
input: "absolute opacity-0 size-0 pointer-events-none peer",
|
|
10
|
+
track: [
|
|
11
|
+
"inline-flex h-5 w-9 shrink-0 items-center rounded-full border-2 border-transparent bg-muted transition-all focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
|
|
12
|
+
"peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
|
|
13
|
+
],
|
|
14
|
+
thumb:
|
|
15
|
+
"pointer-events-none block size-4 rounded-full bg-background shadow-lg ring-0 transition-transform duration-200 translate-x-0",
|
|
16
|
+
label: "text-sm text-foreground leading-none"
|
|
17
|
+
},
|
|
18
|
+
variants: {
|
|
19
|
+
color: Object.fromEntries(
|
|
20
|
+
colors.map((color) => [
|
|
21
|
+
color,
|
|
22
|
+
{
|
|
23
|
+
root: "rl-color-" + color,
|
|
24
|
+
track: `peer-checked:bg-[var(--rl-bg)] focus-within:ring-[var(--rl-ring)]/50`
|
|
25
|
+
}
|
|
26
|
+
])
|
|
27
|
+
),
|
|
28
|
+
size: {
|
|
29
|
+
sm: { track: "h-4 w-7", thumb: "size-3", label: "text-xs" },
|
|
30
|
+
md: { track: "h-5 w-9", thumb: "size-4", label: "text-sm" },
|
|
31
|
+
lg: { track: "h-6 w-11", thumb: "size-5", label: "text-base" }
|
|
32
|
+
},
|
|
33
|
+
checked: {
|
|
34
|
+
true: { thumb: "translate-x-full" },
|
|
35
|
+
false: { thumb: "translate-x-0" }
|
|
36
|
+
},
|
|
37
|
+
theme: {
|
|
38
|
+
flat: { root: "rl-flat" },
|
|
39
|
+
light: { root: "rl-light" },
|
|
40
|
+
dark: { root: "rl-dark" }
|
|
41
|
+
}
|
|
42
|
+
},
|
|
43
|
+
compoundVariants: [
|
|
44
|
+
{
|
|
45
|
+
size: "sm",
|
|
46
|
+
checked: true,
|
|
47
|
+
classNames: { thumb: "translate-x-3" }
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
size: "md",
|
|
51
|
+
checked: true,
|
|
52
|
+
classNames: { thumb: "translate-x-4" }
|
|
53
|
+
},
|
|
54
|
+
{
|
|
55
|
+
size: "lg",
|
|
56
|
+
checked: true,
|
|
57
|
+
classNames: { thumb: "translate-x-5" }
|
|
58
|
+
}
|
|
59
|
+
],
|
|
60
|
+
defaultVariants: {
|
|
61
|
+
color: "primary",
|
|
62
|
+
size: "md",
|
|
63
|
+
checked: false
|
|
64
|
+
}
|
|
65
|
+
})
|
|
66
|
+
|
|
67
|
+
export default createSwitchTheme()
|
|
@@ -1,48 +1,48 @@
|
|
|
1
|
-
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
-
|
|
3
|
-
export const createTableOfContentsTheme = () =>
|
|
4
|
-
defineTheme({
|
|
5
|
-
slots: ["root", "media", "header", "title", "description", "content", "footer", "overlay"],
|
|
6
|
-
base: {
|
|
7
|
-
root: "sticky top-(--ui-header-height) z-10 bg-default/75 lg:bg-[initial] backdrop-blur -mx-4 px-4 sm:px-6 sm:-mx-6 lg:ms-0 overflow-y-auto max-h-[calc(100vh-var(--ui-header-height))]",
|
|
8
|
-
container:
|
|
9
|
-
"pt-4 sm:pt-6 pb-2.5 sm:pb-4.5 lg:py-8 border-b border-dashed border-default lg:border-0 flex flex-col",
|
|
10
|
-
top: "",
|
|
11
|
-
bottom: "hidden lg:flex lg:flex-col gap-6",
|
|
12
|
-
trigger:
|
|
13
|
-
"group text-sm font-semibold flex-1 flex items-center gap-1.5 py-1.5 -mt-1.5 focus-visible:outline-primary",
|
|
14
|
-
title: "truncate",
|
|
15
|
-
trailing: "ms-auto inline-flex gap-1.5 items-center",
|
|
16
|
-
trailingIcon:
|
|
17
|
-
"size-5 transform transition-transform duration-200 shrink-0 group-data-[state=open]:rotate-180 lg:hidden",
|
|
18
|
-
content:
|
|
19
|
-
"relative data-[state=open]:animate-[collapsible-down_200ms_ease-out] data-[state=closed]:animate-[collapsible-up_200ms_ease-out] overflow-hidden focus:outline-none",
|
|
20
|
-
list: "min-w-0",
|
|
21
|
-
listWithChildren: "ms-3",
|
|
22
|
-
item: "min-w-0",
|
|
23
|
-
itemWithChildren: "",
|
|
24
|
-
link: "group relative text-sm flex items-center focus-visible:outline-primary py-1",
|
|
25
|
-
linkText: "truncate",
|
|
26
|
-
indicator: "",
|
|
27
|
-
indicatorLine: "",
|
|
28
|
-
indicatorActive: ""
|
|
29
|
-
},
|
|
30
|
-
variants: {
|
|
31
|
-
interactive: {
|
|
32
|
-
true: {
|
|
33
|
-
root: "hover:shadow-md hover:-translate-y-0.5 cursor-pointer hover:border-primary/30"
|
|
34
|
-
},
|
|
35
|
-
false: { root: "" }
|
|
36
|
-
},
|
|
37
|
-
overlay: {
|
|
38
|
-
true: { root: "relative aspect-square", content: "absolute inset-0 z-10" },
|
|
39
|
-
false: { root: "" }
|
|
40
|
-
}
|
|
41
|
-
},
|
|
42
|
-
defaultVariants: {
|
|
43
|
-
interactive: false,
|
|
44
|
-
overlay: false
|
|
45
|
-
}
|
|
46
|
-
})
|
|
47
|
-
|
|
48
|
-
export default createTableOfContentsTheme()
|
|
1
|
+
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
+
|
|
3
|
+
export const createTableOfContentsTheme = () =>
|
|
4
|
+
defineTheme({
|
|
5
|
+
slots: ["root", "media", "header", "title", "description", "content", "footer", "overlay"],
|
|
6
|
+
base: {
|
|
7
|
+
root: "sticky top-(--ui-header-height) z-10 bg-default/75 lg:bg-[initial] backdrop-blur -mx-4 px-4 sm:px-6 sm:-mx-6 lg:ms-0 overflow-y-auto max-h-[calc(100vh-var(--ui-header-height))]",
|
|
8
|
+
container:
|
|
9
|
+
"pt-4 sm:pt-6 pb-2.5 sm:pb-4.5 lg:py-8 border-b border-dashed border-default lg:border-0 flex flex-col",
|
|
10
|
+
top: "",
|
|
11
|
+
bottom: "hidden lg:flex lg:flex-col gap-6",
|
|
12
|
+
trigger:
|
|
13
|
+
"group text-sm font-semibold flex-1 flex items-center gap-1.5 py-1.5 -mt-1.5 focus-visible:outline-primary",
|
|
14
|
+
title: "truncate",
|
|
15
|
+
trailing: "ms-auto inline-flex gap-1.5 items-center",
|
|
16
|
+
trailingIcon:
|
|
17
|
+
"size-5 transform transition-transform duration-200 shrink-0 group-data-[state=open]:rotate-180 lg:hidden",
|
|
18
|
+
content:
|
|
19
|
+
"relative data-[state=open]:animate-[collapsible-down_200ms_ease-out] data-[state=closed]:animate-[collapsible-up_200ms_ease-out] overflow-hidden focus:outline-none",
|
|
20
|
+
list: "min-w-0",
|
|
21
|
+
listWithChildren: "ms-3",
|
|
22
|
+
item: "min-w-0",
|
|
23
|
+
itemWithChildren: "",
|
|
24
|
+
link: "group relative text-sm flex items-center focus-visible:outline-primary py-1",
|
|
25
|
+
linkText: "truncate",
|
|
26
|
+
indicator: "",
|
|
27
|
+
indicatorLine: "",
|
|
28
|
+
indicatorActive: ""
|
|
29
|
+
},
|
|
30
|
+
variants: {
|
|
31
|
+
interactive: {
|
|
32
|
+
true: {
|
|
33
|
+
root: "hover:shadow-md hover:-translate-y-0.5 cursor-pointer hover:border-primary/30"
|
|
34
|
+
},
|
|
35
|
+
false: { root: "" }
|
|
36
|
+
},
|
|
37
|
+
overlay: {
|
|
38
|
+
true: { root: "relative aspect-square", content: "absolute inset-0 z-10" },
|
|
39
|
+
false: { root: "" }
|
|
40
|
+
}
|
|
41
|
+
},
|
|
42
|
+
defaultVariants: {
|
|
43
|
+
interactive: false,
|
|
44
|
+
overlay: false
|
|
45
|
+
}
|
|
46
|
+
})
|
|
47
|
+
|
|
48
|
+
export default createTableOfContentsTheme()
|
package/src/themes/tabs.theme.ts
CHANGED
|
@@ -1,52 +1,52 @@
|
|
|
1
|
-
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
-
|
|
3
|
-
export const createTabsTheme = () =>
|
|
4
|
-
defineTheme({
|
|
5
|
-
slots: ["root", "list", "trigger", "content"],
|
|
6
|
-
base: {
|
|
7
|
-
root: "w-full flex flex-col gap-4",
|
|
8
|
-
list: "inline-flex items-center justify-start rounded-md bg-muted p-1 text-muted-foreground",
|
|
9
|
-
trigger:
|
|
10
|
-
"inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:text-foreground cursor-pointer",
|
|
11
|
-
content:
|
|
12
|
-
"mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
|
|
13
|
-
},
|
|
14
|
-
variants: {
|
|
15
|
-
variant: {
|
|
16
|
-
solid: {
|
|
17
|
-
list: "bg-muted p-1 rounded-lg",
|
|
18
|
-
trigger:
|
|
19
|
-
"data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm"
|
|
20
|
-
},
|
|
21
|
-
underline: {
|
|
22
|
-
list: "bg-transparent border-b border-border rounded-none p-0 gap-4",
|
|
23
|
-
trigger:
|
|
24
|
-
"rounded-none border-b-2 border-transparent px-1 pb-3 pt-2 data-[state=active]:border-primary data-[state=active]:text-foreground hover:border-muted-foreground/30"
|
|
25
|
-
},
|
|
26
|
-
pills: {
|
|
27
|
-
list: "bg-transparent p-0 gap-2",
|
|
28
|
-
trigger:
|
|
29
|
-
"rounded-full px-4 py-1.5 data-[state=active]:bg-primary data-[state=active]:text-white"
|
|
30
|
-
}
|
|
31
|
-
},
|
|
32
|
-
orientation: {
|
|
33
|
-
horizontal: { root: "flex-col", list: "w-full" },
|
|
34
|
-
vertical: {
|
|
35
|
-
root: "flex-row gap-6",
|
|
36
|
-
list: "flex-col items-stretch h-full w-48 border-r border-border rounded-none bg-transparent"
|
|
37
|
-
}
|
|
38
|
-
},
|
|
39
|
-
size: {
|
|
40
|
-
sm: { trigger: "text-xs px-2.5 py-1" },
|
|
41
|
-
md: { trigger: "text-sm px-3.5 py-1.5" },
|
|
42
|
-
lg: { trigger: "text-base px-4.5 py-2" }
|
|
43
|
-
}
|
|
44
|
-
},
|
|
45
|
-
defaultVariants: {
|
|
46
|
-
variant: "solid",
|
|
47
|
-
orientation: "horizontal",
|
|
48
|
-
size: "md"
|
|
49
|
-
}
|
|
50
|
-
})
|
|
51
|
-
|
|
52
|
-
export default createTabsTheme()
|
|
1
|
+
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
+
|
|
3
|
+
export const createTabsTheme = () =>
|
|
4
|
+
defineTheme({
|
|
5
|
+
slots: ["root", "list", "trigger", "content"],
|
|
6
|
+
base: {
|
|
7
|
+
root: "w-full flex flex-col gap-4",
|
|
8
|
+
list: "inline-flex items-center justify-start rounded-md bg-muted p-1 text-muted-foreground",
|
|
9
|
+
trigger:
|
|
10
|
+
"inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:text-foreground cursor-pointer",
|
|
11
|
+
content:
|
|
12
|
+
"mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
|
|
13
|
+
},
|
|
14
|
+
variants: {
|
|
15
|
+
variant: {
|
|
16
|
+
solid: {
|
|
17
|
+
list: "bg-muted p-1 rounded-lg",
|
|
18
|
+
trigger:
|
|
19
|
+
"data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm"
|
|
20
|
+
},
|
|
21
|
+
underline: {
|
|
22
|
+
list: "bg-transparent border-b border-border rounded-none p-0 gap-4",
|
|
23
|
+
trigger:
|
|
24
|
+
"rounded-none border-b-2 border-transparent px-1 pb-3 pt-2 data-[state=active]:border-primary data-[state=active]:text-foreground hover:border-muted-foreground/30"
|
|
25
|
+
},
|
|
26
|
+
pills: {
|
|
27
|
+
list: "bg-transparent p-0 gap-2",
|
|
28
|
+
trigger:
|
|
29
|
+
"rounded-full px-4 py-1.5 data-[state=active]:bg-primary data-[state=active]:text-white"
|
|
30
|
+
}
|
|
31
|
+
},
|
|
32
|
+
orientation: {
|
|
33
|
+
horizontal: { root: "flex-col", list: "w-full" },
|
|
34
|
+
vertical: {
|
|
35
|
+
root: "flex-row gap-6",
|
|
36
|
+
list: "flex-col items-stretch h-full w-48 border-r border-border rounded-none bg-transparent"
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
size: {
|
|
40
|
+
sm: { trigger: "text-xs px-2.5 py-1" },
|
|
41
|
+
md: { trigger: "text-sm px-3.5 py-1.5" },
|
|
42
|
+
lg: { trigger: "text-base px-4.5 py-2" }
|
|
43
|
+
}
|
|
44
|
+
},
|
|
45
|
+
defaultVariants: {
|
|
46
|
+
variant: "solid",
|
|
47
|
+
orientation: "horizontal",
|
|
48
|
+
size: "md"
|
|
49
|
+
}
|
|
50
|
+
})
|
|
51
|
+
|
|
52
|
+
export default createTabsTheme()
|
|
@@ -1,27 +1,27 @@
|
|
|
1
|
-
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
-
|
|
3
|
-
export const createTextareaTheme = () =>
|
|
4
|
-
defineTheme({
|
|
5
|
-
slots: ["root", "textarea"],
|
|
6
|
-
base: {
|
|
7
|
-
root: "relative flex items-center w-full rounded-md border border-input bg-background shadow-sm focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
|
|
8
|
-
textarea:
|
|
9
|
-
"w-full bg-transparent px-3 py-2 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 min-h-[80px]"
|
|
10
|
-
},
|
|
11
|
-
variants: {
|
|
12
|
-
size: {
|
|
13
|
-
sm: { textarea: "py-1.5 text-xs min-h-[60px]" },
|
|
14
|
-
md: { textarea: "py-2 text-sm min-h-[80px]" },
|
|
15
|
-
lg: { textarea: "py-2.5 text-base min-h-[100px]" }
|
|
16
|
-
},
|
|
17
|
-
error: {
|
|
18
|
-
true: { root: "border-error-500 focus-within:ring-error-500/50" }
|
|
19
|
-
}
|
|
20
|
-
},
|
|
21
|
-
defaultVariants: {
|
|
22
|
-
size: "md",
|
|
23
|
-
error: false
|
|
24
|
-
}
|
|
25
|
-
})
|
|
26
|
-
|
|
27
|
-
export default createTextareaTheme()
|
|
1
|
+
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
+
|
|
3
|
+
export const createTextareaTheme = () =>
|
|
4
|
+
defineTheme({
|
|
5
|
+
slots: ["root", "textarea"],
|
|
6
|
+
base: {
|
|
7
|
+
root: "relative flex items-center w-full rounded-md border border-input bg-background shadow-sm focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
|
|
8
|
+
textarea:
|
|
9
|
+
"w-full bg-transparent px-3 py-2 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 min-h-[80px]"
|
|
10
|
+
},
|
|
11
|
+
variants: {
|
|
12
|
+
size: {
|
|
13
|
+
sm: { textarea: "py-1.5 text-xs min-h-[60px]" },
|
|
14
|
+
md: { textarea: "py-2 text-sm min-h-[80px]" },
|
|
15
|
+
lg: { textarea: "py-2.5 text-base min-h-[100px]" }
|
|
16
|
+
},
|
|
17
|
+
error: {
|
|
18
|
+
true: { root: "border-error-500 focus-within:ring-error-500/50" }
|
|
19
|
+
}
|
|
20
|
+
},
|
|
21
|
+
defaultVariants: {
|
|
22
|
+
size: "md",
|
|
23
|
+
error: false
|
|
24
|
+
}
|
|
25
|
+
})
|
|
26
|
+
|
|
27
|
+
export default createTextareaTheme()
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
-
|
|
3
|
-
export const createThemeSelectorTheme = () =>
|
|
4
|
-
defineTheme({
|
|
5
|
-
slots: ["root", "sun", "moon"],
|
|
6
|
-
base: {
|
|
7
|
-
root: "group rounded-full hover:bg-neutral-900/50 transition-colors inline-flex items-center justify-center text-neutral-400 hover:text-white cursor-pointer",
|
|
8
|
-
sun: "hidden dark:block i-lucide-sun w-5 h-5 text-current",
|
|
9
|
-
moon: "dark:hidden i-lucide-moon w-5 h-5 text-current"
|
|
10
|
-
},
|
|
11
|
-
variants: {},
|
|
12
|
-
defaultVariants: {}
|
|
13
|
-
})
|
|
14
|
-
|
|
15
|
-
export default createThemeSelectorTheme()
|
|
1
|
+
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
+
|
|
3
|
+
export const createThemeSelectorTheme = () =>
|
|
4
|
+
defineTheme({
|
|
5
|
+
slots: ["root", "sun", "moon"],
|
|
6
|
+
base: {
|
|
7
|
+
root: "group rounded-full hover:bg-neutral-900/50 transition-colors inline-flex items-center justify-center text-neutral-400 hover:text-white cursor-pointer",
|
|
8
|
+
sun: "hidden dark:block i-lucide-sun w-5 h-5 text-current",
|
|
9
|
+
moon: "dark:hidden i-lucide-moon w-5 h-5 text-current"
|
|
10
|
+
},
|
|
11
|
+
variants: {},
|
|
12
|
+
defaultVariants: {}
|
|
13
|
+
})
|
|
14
|
+
|
|
15
|
+
export default createThemeSelectorTheme()
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
-
|
|
3
|
-
export const createTimelineTheme = () =>
|
|
4
|
-
defineTheme({
|
|
5
|
-
slots: ["root"],
|
|
6
|
-
base: {
|
|
7
|
-
root: ""
|
|
8
|
-
},
|
|
9
|
-
variants: {},
|
|
10
|
-
defaultVariants: {}
|
|
11
|
-
})
|
|
12
|
-
|
|
13
|
-
export default createTimelineTheme()
|
|
1
|
+
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
+
|
|
3
|
+
export const createTimelineTheme = () =>
|
|
4
|
+
defineTheme({
|
|
5
|
+
slots: ["root"],
|
|
6
|
+
base: {
|
|
7
|
+
root: ""
|
|
8
|
+
},
|
|
9
|
+
variants: {},
|
|
10
|
+
defaultVariants: {}
|
|
11
|
+
})
|
|
12
|
+
|
|
13
|
+
export default createTimelineTheme()
|
|
@@ -1,31 +1,31 @@
|
|
|
1
|
-
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
-
|
|
3
|
-
export const createToastTheme = () =>
|
|
4
|
-
defineTheme({
|
|
5
|
-
slots: ["root", "title", "description", "action", "close"],
|
|
6
|
-
base: {
|
|
7
|
-
root: "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all border-border bg-background text-foreground",
|
|
8
|
-
title: "text-sm font-semibold",
|
|
9
|
-
description: "text-xs opacity-90",
|
|
10
|
-
action:
|
|
11
|
-
"inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-xs font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
|
|
12
|
-
close:
|
|
13
|
-
"absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100"
|
|
14
|
-
},
|
|
15
|
-
variants: {
|
|
16
|
-
variant: {
|
|
17
|
-
default: { root: "bg-background border-border" },
|
|
18
|
-
destructive: {
|
|
19
|
-
root: "destructive group border-error-500/20 bg-error-500/10 text-error-700 dark:text-error-400"
|
|
20
|
-
},
|
|
21
|
-
success: {
|
|
22
|
-
root: "border-success-500/20 bg-success-500/10 text-success-700 dark:text-success-400"
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
},
|
|
26
|
-
defaultVariants: {
|
|
27
|
-
variant: "default"
|
|
28
|
-
}
|
|
29
|
-
})
|
|
30
|
-
|
|
31
|
-
export default createToastTheme()
|
|
1
|
+
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
+
|
|
3
|
+
export const createToastTheme = () =>
|
|
4
|
+
defineTheme({
|
|
5
|
+
slots: ["root", "title", "description", "action", "close"],
|
|
6
|
+
base: {
|
|
7
|
+
root: "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all border-border bg-background text-foreground",
|
|
8
|
+
title: "text-sm font-semibold",
|
|
9
|
+
description: "text-xs opacity-90",
|
|
10
|
+
action:
|
|
11
|
+
"inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-xs font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
|
|
12
|
+
close:
|
|
13
|
+
"absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100"
|
|
14
|
+
},
|
|
15
|
+
variants: {
|
|
16
|
+
variant: {
|
|
17
|
+
default: { root: "bg-background border-border" },
|
|
18
|
+
destructive: {
|
|
19
|
+
root: "destructive group border-error-500/20 bg-error-500/10 text-error-700 dark:text-error-400"
|
|
20
|
+
},
|
|
21
|
+
success: {
|
|
22
|
+
root: "border-success-500/20 bg-success-500/10 text-success-700 dark:text-success-400"
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
},
|
|
26
|
+
defaultVariants: {
|
|
27
|
+
variant: "default"
|
|
28
|
+
}
|
|
29
|
+
})
|
|
30
|
+
|
|
31
|
+
export default createToastTheme()
|
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
-
|
|
3
|
-
export const createTooltipTheme = () =>
|
|
4
|
-
defineTheme({
|
|
5
|
-
slots: ["root", "trigger", "content"],
|
|
6
|
-
base: {
|
|
7
|
-
root: "relative inline-block group/tooltip",
|
|
8
|
-
trigger: "",
|
|
9
|
-
content: [
|
|
10
|
-
"absolute z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground shadow-md animate-in fade-in-0 zoom-in-95",
|
|
11
|
-
"transition-all duration-150 invisible opacity-0 scale-95 origin-center pointer-events-none",
|
|
12
|
-
"group-hover/tooltip:visible group-hover/tooltip:opacity-100 group-hover/tooltip:scale-100"
|
|
13
|
-
]
|
|
14
|
-
},
|
|
15
|
-
variants: {
|
|
16
|
-
placement: {
|
|
17
|
-
top: { content: "bottom-full left-1/2 -translate-x-1/2 mb-1.5" },
|
|
18
|
-
bottom: { content: "top-full left-1/2 -translate-x-1/2 mt-1.5" },
|
|
19
|
-
left: { content: "right-full top-1/2 -translate-y-1/2 mr-1.5" },
|
|
20
|
-
right: { content: "left-full top-1/2 -translate-y-1/2 ml-1.5" }
|
|
21
|
-
}
|
|
22
|
-
},
|
|
23
|
-
defaultVariants: {
|
|
24
|
-
placement: "top"
|
|
25
|
-
}
|
|
26
|
-
})
|
|
27
|
-
|
|
28
|
-
export default createTooltipTheme()
|
|
1
|
+
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
+
|
|
3
|
+
export const createTooltipTheme = () =>
|
|
4
|
+
defineTheme({
|
|
5
|
+
slots: ["root", "trigger", "content"],
|
|
6
|
+
base: {
|
|
7
|
+
root: "relative inline-block group/tooltip",
|
|
8
|
+
trigger: "",
|
|
9
|
+
content: [
|
|
10
|
+
"absolute z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground shadow-md animate-in fade-in-0 zoom-in-95",
|
|
11
|
+
"transition-all duration-150 invisible opacity-0 scale-95 origin-center pointer-events-none",
|
|
12
|
+
"group-hover/tooltip:visible group-hover/tooltip:opacity-100 group-hover/tooltip:scale-100"
|
|
13
|
+
]
|
|
14
|
+
},
|
|
15
|
+
variants: {
|
|
16
|
+
placement: {
|
|
17
|
+
top: { content: "bottom-full left-1/2 -translate-x-1/2 mb-1.5" },
|
|
18
|
+
bottom: { content: "top-full left-1/2 -translate-x-1/2 mt-1.5" },
|
|
19
|
+
left: { content: "right-full top-1/2 -translate-y-1/2 mr-1.5" },
|
|
20
|
+
right: { content: "left-full top-1/2 -translate-y-1/2 ml-1.5" }
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
defaultVariants: {
|
|
24
|
+
placement: "top"
|
|
25
|
+
}
|
|
26
|
+
})
|
|
27
|
+
|
|
28
|
+
export default createTooltipTheme()
|
package/src/themes/tour.theme.ts
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
-
|
|
3
|
-
export const createTourTheme = () =>
|
|
4
|
-
defineTheme({
|
|
5
|
-
slots: ["root"],
|
|
6
|
-
base: {
|
|
7
|
-
root: ""
|
|
8
|
-
},
|
|
9
|
-
variants: {},
|
|
10
|
-
defaultVariants: {}
|
|
11
|
-
})
|
|
12
|
-
|
|
13
|
-
export default createTourTheme()
|
|
1
|
+
import { defineTheme } from "../utils/defineTheme"
|
|
2
|
+
|
|
3
|
+
export const createTourTheme = () =>
|
|
4
|
+
defineTheme({
|
|
5
|
+
slots: ["root"],
|
|
6
|
+
base: {
|
|
7
|
+
root: ""
|
|
8
|
+
},
|
|
9
|
+
variants: {},
|
|
10
|
+
defaultVariants: {}
|
|
11
|
+
})
|
|
12
|
+
|
|
13
|
+
export default createTourTheme()
|