@eslamdevui/ui 3.2.0-beta.2 → 3.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (264) hide show
  1. package/.nuxt/ui/auth-form.ts +20 -0
  2. package/.nuxt/ui/banner.ts +105 -0
  3. package/.nuxt/ui/blog-post.ts +140 -0
  4. package/.nuxt/ui/blog-posts.ts +14 -0
  5. package/.nuxt/ui/changelog-version.ts +41 -0
  6. package/.nuxt/ui/changelog-versions.ts +8 -0
  7. package/.nuxt/ui/chat-palette.ts +8 -0
  8. package/.nuxt/ui/content/content-navigation.ts +6 -4
  9. package/.nuxt/ui/content-navigation.ts +6 -4
  10. package/.nuxt/ui/footer-columns.ts +28 -0
  11. package/.nuxt/ui/footer.ts +11 -0
  12. package/.nuxt/ui/header.ts +30 -0
  13. package/.nuxt/ui/index.ts +32 -1
  14. package/.nuxt/ui/main.ts +3 -0
  15. package/.nuxt/ui/page-accordion.ts +7 -0
  16. package/.nuxt/ui/page-anchors.ts +30 -0
  17. package/.nuxt/ui/page-aside.ts +10 -0
  18. package/.nuxt/ui/page-body.ts +3 -0
  19. package/.nuxt/ui/page-card.ts +276 -0
  20. package/.nuxt/ui/page-columns.ts +3 -0
  21. package/.nuxt/ui/page-cta.ts +72 -0
  22. package/.nuxt/ui/page-feature.ts +31 -0
  23. package/.nuxt/ui/page-grid.ts +3 -0
  24. package/.nuxt/ui/page-header.ts +18 -0
  25. package/.nuxt/ui/page-hero.ts +46 -0
  26. package/.nuxt/ui/page-links.ts +25 -0
  27. package/.nuxt/ui/page-list.ts +8 -0
  28. package/.nuxt/ui/page-logos.ts +15 -0
  29. package/.nuxt/ui/page-marquee.ts +66 -0
  30. package/.nuxt/ui/page-section.ts +88 -0
  31. package/.nuxt/ui/page.ts +32 -0
  32. package/.nuxt/ui/pricing-plan.ts +101 -0
  33. package/.nuxt/ui/pricing-plans.ts +27 -0
  34. package/.nuxt/ui/pricing-table.ts +51 -0
  35. package/.nuxt/ui/user.ts +106 -0
  36. package/LICENSE.md +9 -9
  37. package/README.md +147 -147
  38. package/cli/commands/make/component.mjs +95 -95
  39. package/cli/commands/make/index.mjs +14 -14
  40. package/cli/commands/make/locale.mjs +64 -64
  41. package/cli/index.mjs +15 -15
  42. package/cli/package.json +13 -13
  43. package/cli/templates.mjs +236 -236
  44. package/cli/utils.mjs +31 -31
  45. package/dist/module.json +1 -1
  46. package/dist/module.mjs +2 -2
  47. package/dist/runtime/components/Accordion.vue +36 -36
  48. package/dist/runtime/components/Alert.vue +46 -46
  49. package/dist/runtime/components/App.vue +10 -10
  50. package/dist/runtime/components/AuthForm.vue +195 -0
  51. package/dist/runtime/components/AuthForm.vue.d.ts +85 -0
  52. package/dist/runtime/components/Avatar.vue +27 -27
  53. package/dist/runtime/components/AvatarGroup.vue +4 -4
  54. package/dist/runtime/components/Badge.vue +16 -16
  55. package/dist/runtime/components/Banner.vue +113 -0
  56. package/dist/runtime/components/Banner.vue.d.ts +68 -0
  57. package/dist/runtime/components/BlogPost.vue +141 -0
  58. package/dist/runtime/components/BlogPost.vue.d.ts +59 -0
  59. package/dist/runtime/components/BlogPosts.vue +33 -0
  60. package/dist/runtime/components/BlogPosts.vue.d.ts +30 -0
  61. package/dist/runtime/components/Breadcrumb.vue +32 -32
  62. package/dist/runtime/components/Button.vue +28 -28
  63. package/dist/runtime/components/ButtonGroup.vue +3 -3
  64. package/dist/runtime/components/Calendar.vue +74 -74
  65. package/dist/runtime/components/Card.vue +13 -13
  66. package/dist/runtime/components/Carousel.vue +58 -58
  67. package/dist/runtime/components/ChangelogVersion.vue +165 -0
  68. package/dist/runtime/components/ChangelogVersion.vue.d.ts +58 -0
  69. package/dist/runtime/components/ChangelogVersions.vue +54 -0
  70. package/dist/runtime/components/ChangelogVersions.vue.d.ts +74 -0
  71. package/dist/runtime/components/ChatMessage.vue +35 -35
  72. package/dist/runtime/components/ChatMessages.vue +55 -55
  73. package/dist/runtime/components/ChatPalette.vue +32 -0
  74. package/dist/runtime/components/ChatPalette.vue.d.ts +24 -0
  75. package/dist/runtime/components/ChatPrompt.vue +26 -26
  76. package/dist/runtime/components/ChatPrompt.vue.d.ts +1 -1
  77. package/dist/runtime/components/ChatPromptSubmit.vue +10 -10
  78. package/dist/runtime/components/Checkbox.vue +33 -33
  79. package/dist/runtime/components/CheckboxGroup.vue +32 -32
  80. package/dist/runtime/components/Chip.vue +11 -11
  81. package/dist/runtime/components/Collapsible.vue +9 -9
  82. package/dist/runtime/components/ColorPicker.vue +30 -30
  83. package/dist/runtime/components/CommandPalette.vue +117 -117
  84. package/dist/runtime/components/CommandPalette.vue.d.ts +3 -3
  85. package/dist/runtime/components/Container.vue +3 -3
  86. package/dist/runtime/components/ContextMenu.vue +22 -22
  87. package/dist/runtime/components/ContextMenuContent.vue +105 -105
  88. package/dist/runtime/components/DashboardGroup.vue +3 -3
  89. package/dist/runtime/components/DashboardNavbar.vue +40 -40
  90. package/dist/runtime/components/DashboardPanel.vue +27 -27
  91. package/dist/runtime/components/DashboardResizeHandle.vue +7 -7
  92. package/dist/runtime/components/DashboardSearch.vue +20 -20
  93. package/dist/runtime/components/DashboardSearchButton.vue +43 -43
  94. package/dist/runtime/components/DashboardSidebar.vue +74 -74
  95. package/dist/runtime/components/DashboardSidebarCollapse.vue +7 -7
  96. package/dist/runtime/components/DashboardSidebarToggle.vue +7 -7
  97. package/dist/runtime/components/DashboardSidebarToggle.vue.d.ts +1 -1
  98. package/dist/runtime/components/Drawer.vue +55 -55
  99. package/dist/runtime/components/DropdownMenu.vue +24 -24
  100. package/dist/runtime/components/DropdownMenuContent.vue +107 -107
  101. package/dist/runtime/components/Error.vue +22 -22
  102. package/dist/runtime/components/Error.vue.d.ts +1 -1
  103. package/dist/runtime/components/Footer.vue +44 -0
  104. package/dist/runtime/components/Footer.vue.d.ts +29 -0
  105. package/dist/runtime/components/FooterColumns.vue +68 -0
  106. package/dist/runtime/components/FooterColumns.vue.d.ts +52 -0
  107. package/dist/runtime/components/Form.vue +8 -8
  108. package/dist/runtime/components/FormField.vue +37 -37
  109. package/dist/runtime/components/Header.vue +137 -0
  110. package/dist/runtime/components/Header.vue.d.ts +72 -0
  111. package/dist/runtime/components/Icon.vue +1 -1
  112. package/dist/runtime/components/Input.vue +34 -34
  113. package/dist/runtime/components/InputMenu.vue +163 -163
  114. package/dist/runtime/components/InputMenu.vue.d.ts +3 -3
  115. package/dist/runtime/components/InputNumber.vue +49 -49
  116. package/dist/runtime/components/InputTags.vue +55 -55
  117. package/dist/runtime/components/Kbd.vue +5 -5
  118. package/dist/runtime/components/Link.vue +14 -14
  119. package/dist/runtime/components/LinkBase.vue +8 -8
  120. package/dist/runtime/components/Main.vue +23 -0
  121. package/dist/runtime/components/Main.vue.d.ts +20 -0
  122. package/dist/runtime/components/Modal.vue +69 -69
  123. package/dist/runtime/components/NavigationMenu.vue +166 -166
  124. package/dist/runtime/components/OverlayProvider.vue +9 -9
  125. package/dist/runtime/components/Page.vue +37 -0
  126. package/dist/runtime/components/Page.vue.d.ts +25 -0
  127. package/dist/runtime/components/PageAccordion.vue +26 -0
  128. package/dist/runtime/components/PageAccordion.vue.d.ts +21 -0
  129. package/dist/runtime/components/PageAnchors.vue +50 -0
  130. package/dist/runtime/components/PageAnchors.vue.d.ts +42 -0
  131. package/dist/runtime/components/PageAside.vue +36 -0
  132. package/dist/runtime/components/PageAside.vue.d.ts +27 -0
  133. package/dist/runtime/components/PageBody.vue +23 -0
  134. package/dist/runtime/components/PageBody.vue.d.ts +18 -0
  135. package/dist/runtime/components/PageCTA.vue +58 -0
  136. package/dist/runtime/components/PageCTA.vue.d.ts +49 -0
  137. package/dist/runtime/components/PageCard.vue +121 -0
  138. package/dist/runtime/components/PageCard.vue.d.ts +71 -0
  139. package/dist/runtime/components/PageColumns.vue +23 -0
  140. package/dist/runtime/components/PageColumns.vue.d.ts +18 -0
  141. package/dist/runtime/components/PageFeature.vue +71 -0
  142. package/dist/runtime/components/PageFeature.vue.d.ts +43 -0
  143. package/dist/runtime/components/PageGrid.vue +23 -0
  144. package/dist/runtime/components/PageGrid.vue.d.ts +18 -0
  145. package/dist/runtime/components/PageHeader.vue +58 -0
  146. package/dist/runtime/components/PageHeader.vue.d.ts +35 -0
  147. package/dist/runtime/components/PageHero.vue +67 -0
  148. package/dist/runtime/components/PageHero.vue.d.ts +49 -0
  149. package/dist/runtime/components/PageLinks.vue +55 -0
  150. package/dist/runtime/components/PageLinks.vue.d.ts +44 -0
  151. package/dist/runtime/components/PageList.vue +24 -0
  152. package/dist/runtime/components/PageList.vue.d.ts +21 -0
  153. package/dist/runtime/components/PageLogos.vue +64 -0
  154. package/dist/runtime/components/PageLogos.vue.d.ts +32 -0
  155. package/dist/runtime/components/PageMarquee.vue +40 -0
  156. package/dist/runtime/components/PageMarquee.vue.d.ts +30 -0
  157. package/dist/runtime/components/PageSection.vue +88 -0
  158. package/dist/runtime/components/PageSection.vue.d.ts +64 -0
  159. package/dist/runtime/components/Pagination.vue +47 -47
  160. package/dist/runtime/components/PinInput.vue +20 -20
  161. package/dist/runtime/components/Popover.vue +17 -17
  162. package/dist/runtime/components/PricingPlan.vue +129 -0
  163. package/dist/runtime/components/PricingPlan.vue.d.ts +109 -0
  164. package/dist/runtime/components/PricingPlans.vue +45 -0
  165. package/dist/runtime/components/PricingPlans.vue.d.ts +41 -0
  166. package/dist/runtime/components/PricingTable.vue +235 -0
  167. package/dist/runtime/components/PricingTable.vue.d.ts +98 -0
  168. package/dist/runtime/components/Progress.vue +19 -19
  169. package/dist/runtime/components/RadioGroup.vue +43 -43
  170. package/dist/runtime/components/Select.vue +96 -96
  171. package/dist/runtime/components/SelectMenu.vue +130 -130
  172. package/dist/runtime/components/SelectMenu.vue.d.ts +3 -3
  173. package/dist/runtime/components/Separator.vue +15 -15
  174. package/dist/runtime/components/Skeleton.vue +10 -10
  175. package/dist/runtime/components/Slideover.vue +76 -76
  176. package/dist/runtime/components/Slider.vue +27 -27
  177. package/dist/runtime/components/Stepper.vue +51 -51
  178. package/dist/runtime/components/Switch.vue +33 -33
  179. package/dist/runtime/components/Table.vue +77 -77
  180. package/dist/runtime/components/Tabs.vue +38 -37
  181. package/dist/runtime/components/Textarea.vue +33 -33
  182. package/dist/runtime/components/Timeline.vue +38 -38
  183. package/dist/runtime/components/Toast.vue +69 -69
  184. package/dist/runtime/components/Toaster.vue +28 -28
  185. package/dist/runtime/components/Tooltip.vue +19 -19
  186. package/dist/runtime/components/Tree.vue +60 -60
  187. package/dist/runtime/components/User.vue +69 -0
  188. package/dist/runtime/components/User.vue.d.ts +46 -0
  189. package/dist/runtime/components/color-mode/ColorModeAvatar.vue +2 -2
  190. package/dist/runtime/components/color-mode/ColorModeButton.vue +16 -16
  191. package/dist/runtime/components/color-mode/ColorModeImage.vue +2 -2
  192. package/dist/runtime/components/color-mode/ColorModeSelect.vue +19 -19
  193. package/dist/runtime/components/color-mode/ColorModeSwitch.vue +19 -19
  194. package/dist/runtime/components/content/ContentNavigation.vue +109 -109
  195. package/dist/runtime/components/content/ContentSearch.vue +25 -25
  196. package/dist/runtime/components/content/ContentSearchButton.vue +38 -38
  197. package/dist/runtime/components/content/ContentSearchButton.vue.d.ts +58 -12
  198. package/dist/runtime/components/content/ContentSurround.vue +31 -31
  199. package/dist/runtime/components/content/ContentSurround.vue.d.ts +52 -59
  200. package/dist/runtime/components/content/ContentToc.vue +88 -76
  201. package/dist/runtime/components/content/ContentToc.vue.d.ts +86 -88
  202. package/dist/runtime/components/locale/LocaleSelect.vue +20 -20
  203. package/dist/runtime/components/prose/A.vue +3 -3
  204. package/dist/runtime/components/prose/Accordion.vue +5 -5
  205. package/dist/runtime/components/prose/AccordionItem.vue +5 -5
  206. package/dist/runtime/components/prose/Badge.vue +3 -3
  207. package/dist/runtime/components/prose/Blockquote.vue +3 -3
  208. package/dist/runtime/components/prose/Callout.vue +27 -27
  209. package/dist/runtime/components/prose/Card.vue +43 -43
  210. package/dist/runtime/components/prose/CardGroup.vue +3 -3
  211. package/dist/runtime/components/prose/Code.vue +3 -3
  212. package/dist/runtime/components/prose/CodeCollapse.vue +16 -16
  213. package/dist/runtime/components/prose/CodeGroup.vue +15 -15
  214. package/dist/runtime/components/prose/CodeIcon.vue +1 -1
  215. package/dist/runtime/components/prose/CodePreview.vue +9 -9
  216. package/dist/runtime/components/prose/CodeTree.vue +61 -61
  217. package/dist/runtime/components/prose/Collapsible.vue +15 -15
  218. package/dist/runtime/components/prose/Em.vue +1 -1
  219. package/dist/runtime/components/prose/Field.vue +23 -23
  220. package/dist/runtime/components/prose/FieldGroup.vue +3 -3
  221. package/dist/runtime/components/prose/H1.vue +6 -6
  222. package/dist/runtime/components/prose/H2.vue +10 -10
  223. package/dist/runtime/components/prose/H3.vue +10 -10
  224. package/dist/runtime/components/prose/H4.vue +6 -6
  225. package/dist/runtime/components/prose/Hr.vue +1 -1
  226. package/dist/runtime/components/prose/Icon.vue +1 -1
  227. package/dist/runtime/components/prose/Img.vue +8 -8
  228. package/dist/runtime/components/prose/Kbd.vue +1 -1
  229. package/dist/runtime/components/prose/Li.vue +3 -3
  230. package/dist/runtime/components/prose/Ol.vue +3 -3
  231. package/dist/runtime/components/prose/P.vue +3 -3
  232. package/dist/runtime/components/prose/Pre.vue +20 -20
  233. package/dist/runtime/components/prose/Script.vue +3 -3
  234. package/dist/runtime/components/prose/Steps.vue +3 -3
  235. package/dist/runtime/components/prose/Strong.vue +3 -3
  236. package/dist/runtime/components/prose/Table.vue +5 -5
  237. package/dist/runtime/components/prose/Tabs.vue +14 -14
  238. package/dist/runtime/components/prose/TabsItem.vue +5 -5
  239. package/dist/runtime/components/prose/Tbody.vue +3 -3
  240. package/dist/runtime/components/prose/Td.vue +3 -3
  241. package/dist/runtime/components/prose/Th.vue +3 -3
  242. package/dist/runtime/components/prose/Thead.vue +3 -3
  243. package/dist/runtime/components/prose/Tr.vue +3 -3
  244. package/dist/runtime/components/prose/Ul.vue +3 -3
  245. package/dist/runtime/components/prose/callout/Caution.vue +3 -3
  246. package/dist/runtime/components/prose/callout/Note.vue +3 -3
  247. package/dist/runtime/components/prose/callout/Tip.vue +3 -3
  248. package/dist/runtime/components/prose/callout/Warning.vue +3 -3
  249. package/dist/runtime/inertia/components/Link.vue +12 -12
  250. package/dist/runtime/inertia/components/LinkBase.vue +15 -15
  251. package/dist/runtime/types/app.config.d.ts +6 -6
  252. package/dist/runtime/types/index.d.ts +33 -0
  253. package/dist/runtime/types/index.js +33 -0
  254. package/dist/runtime/vue/components/Icon.vue +1 -1
  255. package/dist/runtime/vue/components/Link.vue +31 -31
  256. package/dist/runtime/vue/components/color-mode/ColorModeButton.vue +7 -7
  257. package/dist/runtime/vue/components/color-mode/ColorModeSelect.vue +7 -7
  258. package/dist/runtime/vue/components/color-mode/ColorModeSwitch.vue +7 -7
  259. package/dist/shared/{ui.DQZ75GCP.mjs → ui.DErCA3YU.mjs} +1247 -50
  260. package/dist/unplugin.mjs +1 -1
  261. package/dist/vite.mjs +1 -1
  262. package/package.json +1 -1
  263. package/vue-plugin.d.ts +5 -5
  264. package/.nuxt/ui/prose.ts +0 -321
@@ -0,0 +1,27 @@
1
+ import theme from '#build/ui/page-aside';
2
+ import type { AppConfig } from '@nuxt/schema';
3
+ import type { ComponentConfig } from '../types';
4
+ type PageAside = ComponentConfig<typeof theme, AppConfig, 'pageAside'>;
5
+ export interface PageAsideProps {
6
+ /**
7
+ * The element or component this component should render as.
8
+ * @defaultValue 'aside'
9
+ */
10
+ as?: any;
11
+ class?: any;
12
+ ui?: PageAside['slots'];
13
+ }
14
+ export interface PageAsideSlots {
15
+ top(props?: {}): any;
16
+ default(props?: {}): any;
17
+ bottom(props?: {}): any;
18
+ }
19
+ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PageAsideProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PageAsideProps> & Readonly<{}>, {
20
+ as: any;
21
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, PageAsideSlots>;
22
+ export default _default;
23
+ type __VLS_WithSlots<T, S> = T & {
24
+ new (): {
25
+ $slots: S;
26
+ };
27
+ };
@@ -0,0 +1,23 @@
1
+ <script>
2
+ import theme from "#build/ui/page-body";
3
+ </script>
4
+
5
+ <script setup>
6
+ import { computed } from "vue";
7
+ import { Primitive } from "reka-ui";
8
+ import { useAppConfig } from "#imports";
9
+ import { tv } from "../utils/tv";
10
+ const props = defineProps({
11
+ as: { type: null, required: false },
12
+ class: { type: null, required: false }
13
+ });
14
+ defineSlots();
15
+ const appConfig = useAppConfig();
16
+ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageBody || {} }));
17
+ </script>
18
+
19
+ <template>
20
+ <Primitive :as="as" :class="ui({ class: props.class })">
21
+ <slot />
22
+ </Primitive>
23
+ </template>
@@ -0,0 +1,18 @@
1
+ export interface PageBodyProps {
2
+ /**
3
+ * The element or component this component should render as.
4
+ * @defaultValue 'div'
5
+ */
6
+ as?: any;
7
+ class?: any;
8
+ }
9
+ export interface PageBodySlots {
10
+ default(props?: {}): any;
11
+ }
12
+ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PageBodyProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PageBodyProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, PageBodySlots>;
13
+ export default _default;
14
+ type __VLS_WithSlots<T, S> = T & {
15
+ new (): {
16
+ $slots: S;
17
+ };
18
+ };
@@ -0,0 +1,58 @@
1
+ <script>
2
+ import theme from "#build/ui/page-cta";
3
+ </script>
4
+
5
+ <script setup>
6
+ import { computed } from "vue";
7
+ import { Primitive } from "reka-ui";
8
+ import { useAppConfig } from "#imports";
9
+ import { tv } from "../utils/tv";
10
+ const props = defineProps({
11
+ as: { type: null, required: false },
12
+ class: { type: null, required: false },
13
+ title: { type: String, required: false },
14
+ description: { type: String, required: false },
15
+ orientation: { type: null, required: false, default: "vertical" },
16
+ reverse: { type: Boolean, required: false },
17
+ variant: { type: null, required: false },
18
+ links: { type: Array, required: false },
19
+ ui: { type: null, required: false }
20
+ });
21
+ const slots = defineSlots();
22
+ const appConfig = useAppConfig();
23
+ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageCTA || {} })({
24
+ variant: props.variant,
25
+ orientation: props.orientation,
26
+ reverse: props.reverse,
27
+ title: !!props.title || !!slots.title
28
+ }));
29
+ </script>
30
+
31
+ <template>
32
+ <Primitive :as="as" :data-orientation="orientation" :class="ui.root({ class: [props.ui?.root, props.class] })">
33
+ <UContainer :class="ui.container({ class: props.ui?.container })">
34
+ <div :class="ui.wrapper({ class: props.ui?.wrapper })">
35
+ <h2 v-if="title || !!slots.title" :class="ui.title({ class: props.ui?.title })">
36
+ <slot name="title">
37
+ {{ title }}
38
+ </slot>
39
+ </h2>
40
+
41
+ <div v-if="description || !!slots.description" :class="ui.description({ class: props.ui?.description })">
42
+ <slot name="description">
43
+ {{ description }}
44
+ </slot>
45
+ </div>
46
+
47
+ <div v-if="links?.length || !!slots.links" :class="ui.links({ class: props.ui?.links })">
48
+ <slot name="links">
49
+ <UButton v-for="(link, index) in links" :key="index" size="lg" v-bind="link" />
50
+ </slot>
51
+ </div>
52
+ </div>
53
+
54
+ <slot v-if="!!slots.default" />
55
+ <div v-else-if="orientation === 'horizontal'" class="hidden lg:block" />
56
+ </UContainer>
57
+ </Primitive>
58
+ </template>
@@ -0,0 +1,49 @@
1
+ import theme from '#build/ui/page-cta';
2
+ import type { AppConfig } from '@nuxt/schema';
3
+ import type { ButtonProps, ComponentConfig } from '../types';
4
+ type PageCTA = ComponentConfig<typeof theme, AppConfig, 'pageCTA'>;
5
+ export interface PageCTAProps {
6
+ /**
7
+ * The element or component this component should render as.
8
+ * @defaultValue 'div'
9
+ */
10
+ as?: any;
11
+ class?: any;
12
+ title?: string;
13
+ description?: string;
14
+ /**
15
+ * The orientation of the page cta.
16
+ * @defaultValue 'vertical'
17
+ */
18
+ orientation?: PageCTA['variants']['orientation'];
19
+ /**
20
+ * Reverse the order of the default slot.
21
+ * @defaultValue false
22
+ */
23
+ reverse?: boolean;
24
+ /**
25
+ * @defaultValue 'outline'
26
+ */
27
+ variant?: PageCTA['variants']['variant'];
28
+ /**
29
+ * Display a list of Button under the description.
30
+ * `{ size: 'lg' }`{lang="ts-type"}
31
+ */
32
+ links?: ButtonProps[];
33
+ ui?: PageCTA['slots'];
34
+ }
35
+ export interface PageCTASlots {
36
+ default(props?: {}): any;
37
+ title(props?: {}): any;
38
+ description(props?: {}): any;
39
+ links(props?: {}): any;
40
+ }
41
+ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PageCTAProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PageCTAProps> & Readonly<{}>, {
42
+ orientation: PageCTA["variants"]["orientation"];
43
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, PageCTASlots>;
44
+ export default _default;
45
+ type __VLS_WithSlots<T, S> = T & {
46
+ new (): {
47
+ $slots: S;
48
+ };
49
+ };
@@ -0,0 +1,121 @@
1
+ <script>
2
+ import theme from "#build/ui/page-card";
3
+ </script>
4
+
5
+ <script setup>
6
+ import { computed, ref, watch } from "vue";
7
+ import { Primitive } from "reka-ui";
8
+ import { useMouseInElement, pausableFilter } from "@vueuse/core";
9
+ import { useAppConfig } from "#imports";
10
+ import { getSlotChildrenText } from "../utils";
11
+ import { tv } from "../utils/tv";
12
+ defineOptions({ inheritAttrs: false });
13
+ const props = defineProps({
14
+ as: { type: null, required: false },
15
+ icon: { type: String, required: false },
16
+ title: { type: String, required: false },
17
+ description: { type: String, required: false },
18
+ orientation: { type: null, required: false, default: "vertical" },
19
+ reverse: { type: Boolean, required: false },
20
+ highlight: { type: Boolean, required: false },
21
+ highlightColor: { type: null, required: false },
22
+ spotlight: { type: Boolean, required: false },
23
+ spotlightColor: { type: null, required: false },
24
+ variant: { type: null, required: false },
25
+ to: { type: null, required: false },
26
+ target: { type: [String, Object, null], required: false },
27
+ onClick: { type: Function, required: false },
28
+ class: { type: null, required: false },
29
+ ui: { type: null, required: false }
30
+ });
31
+ const slots = defineSlots();
32
+ const cardRef = ref();
33
+ const motionControl = pausableFilter();
34
+ const appConfig = useAppConfig();
35
+ const { elementX, elementY } = useMouseInElement(cardRef, {
36
+ eventFilter: motionControl.eventFilter
37
+ });
38
+ const spotlight = computed(() => props.spotlight && (elementX.value !== 0 || elementY.value !== 0));
39
+ watch(() => props.spotlight, (value) => {
40
+ if (value) {
41
+ motionControl.resume();
42
+ } else {
43
+ motionControl.pause();
44
+ }
45
+ }, { immediate: true });
46
+ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageCard || {} })({
47
+ orientation: props.orientation,
48
+ reverse: props.reverse,
49
+ variant: props.variant,
50
+ to: !!props.to || !!props.onClick,
51
+ title: !!props.title || !!slots.title,
52
+ highlight: props.highlight,
53
+ highlightColor: props.highlightColor,
54
+ spotlight: spotlight.value,
55
+ spotlightColor: props.spotlightColor
56
+ }));
57
+ const ariaLabel = computed(() => {
58
+ const slotText = slots.title && getSlotChildrenText(slots.title());
59
+ return (slotText || props.title || "Card link").trim();
60
+ });
61
+ </script>
62
+
63
+ <template>
64
+ <Primitive
65
+ ref="cardRef"
66
+ :as="as"
67
+ :data-orientation="orientation"
68
+ :class="ui.root({ class: [props.ui?.root, props.class] })"
69
+ :style="spotlight && { '--spotlight-x': `${elementX}px`, '--spotlight-y': `${elementY}px` }"
70
+ @click="onClick"
71
+ >
72
+ <div v-if="props.spotlight" :class="ui.spotlight({ class: props.ui?.spotlight })" />
73
+
74
+ <div :class="ui.container({ class: props.ui?.container })">
75
+ <div v-if="!!slots.header || !!slots.body || (icon || !!slots.leading) || (title || !!slots.title) || (description || !!slots.description) || !!slots.footer" :class="ui.wrapper({ class: props.ui?.wrapper })">
76
+ <div v-if="!!slots.header" :class="ui.header({ class: props.ui?.header })">
77
+ <slot name="header" />
78
+ </div>
79
+
80
+ <div v-if="icon || !!slots.leading" :class="ui.leading({ class: props.ui?.leading })">
81
+ <slot name="leading">
82
+ <UIcon v-if="icon" :name="icon" :class="ui.leadingIcon({ class: props.ui?.leadingIcon })" />
83
+ </slot>
84
+ </div>
85
+
86
+ <div v-if="!!slots.body || (title || !!slots.title) || (description || !!slots.description)" :class="ui.body({ class: props.ui?.body })">
87
+ <slot name="body">
88
+ <div v-if="title || !!slots.title" :class="ui.title({ class: props.ui?.title })">
89
+ <slot name="title">
90
+ {{ title }}
91
+ </slot>
92
+ </div>
93
+
94
+ <div v-if="description || !!slots.description" :class="ui.description({ class: props.ui?.description })">
95
+ <slot name="description">
96
+ {{ description }}
97
+ </slot>
98
+ </div>
99
+ </slot>
100
+ </div>
101
+
102
+ <div v-if="!!slots.footer" :class="ui.footer({ class: props.ui?.footer })">
103
+ <slot name="footer" />
104
+ </div>
105
+ </div>
106
+
107
+ <slot />
108
+ </div>
109
+
110
+ <ULink
111
+ v-if="to"
112
+ :aria-label="ariaLabel"
113
+ v-bind="{ to, target, ...$attrs }"
114
+ class="focus:outline-none peer"
115
+ tabindex="-1"
116
+ raw
117
+ >
118
+ <span class="absolute inset-0" aria-hidden="true" />
119
+ </ULink>
120
+ </Primitive>
121
+ </template>
@@ -0,0 +1,71 @@
1
+ import theme from '#build/ui/page-card';
2
+ import type { AppConfig } from '@nuxt/schema';
3
+ import type { LinkProps, ComponentConfig } from '../types';
4
+ type PageCard = ComponentConfig<typeof theme, AppConfig, 'pageCard'>;
5
+ export interface PageCardProps {
6
+ /**
7
+ * The element or component this component should render as.
8
+ * @defaultValue 'div'
9
+ */
10
+ as?: any;
11
+ /**
12
+ * The icon displayed above the title.
13
+ * @IconifyIcon
14
+ */
15
+ icon?: string;
16
+ title?: string;
17
+ description?: string;
18
+ /**
19
+ * The orientation of the page card.
20
+ * @defaultValue 'vertical'
21
+ */
22
+ orientation?: PageCard['variants']['orientation'];
23
+ /**
24
+ * Reverse the order of the default slot.
25
+ * @defaultValue false
26
+ */
27
+ reverse?: boolean;
28
+ /**
29
+ * Display a line around the page card.
30
+ */
31
+ highlight?: boolean;
32
+ /**
33
+ * @defaultValue 'primary'
34
+ */
35
+ highlightColor?: PageCard['variants']['highlightColor'];
36
+ /**
37
+ * Display a spotlight effect that follows your mouse cursor and highlights borders on hover.
38
+ */
39
+ spotlight?: boolean;
40
+ /**
41
+ * @defaultValue 'primary'
42
+ */
43
+ spotlightColor?: PageCard['variants']['spotlightColor'];
44
+ /**
45
+ * @defaultValue 'outline'
46
+ */
47
+ variant?: PageCard['variants']['variant'];
48
+ to?: LinkProps['to'];
49
+ target?: LinkProps['target'];
50
+ onClick?: (event: MouseEvent) => void | Promise<void>;
51
+ class?: any;
52
+ ui?: PageCard['slots'];
53
+ }
54
+ export interface PageCardSlots {
55
+ header(props?: {}): any;
56
+ body(props?: {}): any;
57
+ leading(props?: {}): any;
58
+ title(props?: {}): any;
59
+ description(props?: {}): any;
60
+ footer(props?: {}): any;
61
+ default(props?: {}): any;
62
+ }
63
+ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PageCardProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PageCardProps> & Readonly<{}>, {
64
+ orientation: PageCard["variants"]["orientation"];
65
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, PageCardSlots>;
66
+ export default _default;
67
+ type __VLS_WithSlots<T, S> = T & {
68
+ new (): {
69
+ $slots: S;
70
+ };
71
+ };
@@ -0,0 +1,23 @@
1
+ <script>
2
+ import theme from "#build/ui/page-columns";
3
+ </script>
4
+
5
+ <script setup>
6
+ import { computed } from "vue";
7
+ import { Primitive } from "reka-ui";
8
+ import { useAppConfig } from "#imports";
9
+ import { tv } from "../utils/tv";
10
+ const props = defineProps({
11
+ as: { type: null, required: false },
12
+ class: { type: null, required: false }
13
+ });
14
+ defineSlots();
15
+ const appConfig = useAppConfig();
16
+ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageColumns || {} }));
17
+ </script>
18
+
19
+ <template>
20
+ <Primitive :as="as" :class="ui({ class: props.class })">
21
+ <slot />
22
+ </Primitive>
23
+ </template>
@@ -0,0 +1,18 @@
1
+ export interface PageColumnsProps {
2
+ /**
3
+ * The element or component this component should render as.
4
+ * @defaultValue 'div'
5
+ */
6
+ as?: any;
7
+ class?: any;
8
+ }
9
+ export interface PageColumnsSlots {
10
+ default(props?: {}): any;
11
+ }
12
+ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PageColumnsProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PageColumnsProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, PageColumnsSlots>;
13
+ export default _default;
14
+ type __VLS_WithSlots<T, S> = T & {
15
+ new (): {
16
+ $slots: S;
17
+ };
18
+ };
@@ -0,0 +1,71 @@
1
+ <script>
2
+ import theme from "#build/ui/page-feature";
3
+ </script>
4
+
5
+ <script setup>
6
+ import { computed } from "vue";
7
+ import { Primitive } from "reka-ui";
8
+ import { getSlotChildrenText } from "../utils";
9
+ import { useAppConfig } from "#imports";
10
+ import { tv } from "../utils/tv";
11
+ defineOptions({ inheritAttrs: false });
12
+ const props = defineProps({
13
+ as: { type: null, required: false },
14
+ icon: { type: String, required: false },
15
+ title: { type: String, required: false },
16
+ description: { type: String, required: false },
17
+ orientation: { type: null, required: false, default: "horizontal" },
18
+ to: { type: null, required: false },
19
+ target: { type: [String, Object, null], required: false },
20
+ onClick: { type: Function, required: false },
21
+ class: { type: null, required: false },
22
+ ui: { type: null, required: false }
23
+ });
24
+ const slots = defineSlots();
25
+ const appConfig = useAppConfig();
26
+ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageFeature || {} })({
27
+ orientation: props.orientation,
28
+ title: !!props.title || !!slots.title
29
+ }));
30
+ const ariaLabel = computed(() => {
31
+ const slotText = slots.title && getSlotChildrenText(slots.title());
32
+ return (slotText || props.title || "Feature link").trim();
33
+ });
34
+ </script>
35
+
36
+ <template>
37
+ <Primitive :as="as" :data-orientation="orientation" :class="ui.root({ class: [props.ui?.root, props.class] })" @click="onClick">
38
+ <div v-if="icon || !!slots.leading" :class="ui.leading({ class: props.ui?.leading })">
39
+ <slot name="leading">
40
+ <UIcon v-if="icon" :name="icon" :class="ui.leadingIcon({ class: props.ui?.leadingIcon })" />
41
+ </slot>
42
+ </div>
43
+
44
+ <div :class="ui.wrapper({ class: props.ui?.wrapper })">
45
+ <ULink
46
+ v-if="to"
47
+ :aria-label="ariaLabel"
48
+ v-bind="{ to, target, ...$attrs }"
49
+ class="focus:outline-none peer"
50
+ tabindex="-1"
51
+ raw
52
+ >
53
+ <span class="absolute inset-0" aria-hidden="true" />
54
+ </ULink>
55
+
56
+ <slot>
57
+ <div v-if="title || !!slots.title" :class="ui.title({ class: props.ui?.title })">
58
+ <slot name="title">
59
+ {{ title }}
60
+ </slot>
61
+ </div>
62
+
63
+ <div v-if="description || !!slots.description" :class="ui.description({ class: props.ui?.description })">
64
+ <slot name="description">
65
+ {{ description }}
66
+ </slot>
67
+ </div>
68
+ </slot>
69
+ </div>
70
+ </Primitive>
71
+ </template>
@@ -0,0 +1,43 @@
1
+ import theme from '#build/ui/page-feature';
2
+ import type { AppConfig } from '@nuxt/schema';
3
+ import type { LinkProps, ComponentConfig } from '../types';
4
+ type PageFeature = ComponentConfig<typeof theme, AppConfig, 'pageFeature'>;
5
+ export interface PageFeatureProps {
6
+ /**
7
+ * The element or component this component should render as.
8
+ * @defaultValue 'div'
9
+ */
10
+ as?: any;
11
+ /**
12
+ * The icon displayed next to the title when `orientation` is `horizontal` and above the title when `orientation` is `vertical`.
13
+ * @IconifyIcon
14
+ */
15
+ icon?: string;
16
+ title?: string;
17
+ description?: string;
18
+ /**
19
+ * The orientation of the page feature.
20
+ * @defaultValue 'horizontal'
21
+ */
22
+ orientation?: PageFeature['variants']['orientation'];
23
+ to?: LinkProps['to'];
24
+ target?: LinkProps['target'];
25
+ onClick?: (event: MouseEvent) => void | Promise<void>;
26
+ class?: any;
27
+ ui?: PageFeature['slots'];
28
+ }
29
+ export interface PageFeatureSlots {
30
+ leading(props?: {}): any;
31
+ title(props?: {}): any;
32
+ description(props?: {}): any;
33
+ default(props?: {}): any;
34
+ }
35
+ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PageFeatureProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PageFeatureProps> & Readonly<{}>, {
36
+ orientation: PageFeature["variants"]["orientation"];
37
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, PageFeatureSlots>;
38
+ export default _default;
39
+ type __VLS_WithSlots<T, S> = T & {
40
+ new (): {
41
+ $slots: S;
42
+ };
43
+ };
@@ -0,0 +1,23 @@
1
+ <script>
2
+ import theme from "#build/ui/page-grid";
3
+ </script>
4
+
5
+ <script setup>
6
+ import { computed } from "vue";
7
+ import { Primitive } from "reka-ui";
8
+ import { useAppConfig } from "#imports";
9
+ import { tv } from "../utils/tv";
10
+ const props = defineProps({
11
+ as: { type: null, required: false },
12
+ class: { type: null, required: false }
13
+ });
14
+ defineSlots();
15
+ const appConfig = useAppConfig();
16
+ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageGrid || {} }));
17
+ </script>
18
+
19
+ <template>
20
+ <Primitive :as="as" :class="ui({ class: props.class })">
21
+ <slot />
22
+ </Primitive>
23
+ </template>
@@ -0,0 +1,18 @@
1
+ export interface PageGridProps {
2
+ /**
3
+ * The element or component this component should render as.
4
+ * @defaultValue 'div'
5
+ */
6
+ as?: any;
7
+ class?: any;
8
+ }
9
+ export interface PageGridSlots {
10
+ default(props?: {}): any;
11
+ }
12
+ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PageGridProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PageGridProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, PageGridSlots>;
13
+ export default _default;
14
+ type __VLS_WithSlots<T, S> = T & {
15
+ new (): {
16
+ $slots: S;
17
+ };
18
+ };
@@ -0,0 +1,58 @@
1
+ <script>
2
+ import theme from "#build/ui/page-header";
3
+ </script>
4
+
5
+ <script setup>
6
+ import { computed } from "vue";
7
+ import { Primitive } from "reka-ui";
8
+ import { useAppConfig } from "#imports";
9
+ import { tv } from "../utils/tv";
10
+ const props = defineProps({
11
+ as: { type: null, required: false },
12
+ headline: { type: String, required: false },
13
+ title: { type: String, required: false },
14
+ description: { type: String, required: false },
15
+ links: { type: Array, required: false },
16
+ class: { type: null, required: false },
17
+ ui: { type: null, required: false }
18
+ });
19
+ const slots = defineSlots();
20
+ const appConfig = useAppConfig();
21
+ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageHeader || {} })({
22
+ title: !!props.title || !!slots.title
23
+ }));
24
+ </script>
25
+
26
+ <template>
27
+ <Primitive :as="as" :class="ui.root({ class: [props.ui?.root, props.class] })">
28
+ <div v-if="headline || !!slots.headline" :class="ui.headline({ class: props.ui?.headline })">
29
+ <slot name="headline">
30
+ {{ headline }}
31
+ </slot>
32
+ </div>
33
+
34
+ <div :class="ui.container({ class: props.ui?.container })">
35
+ <div :class="ui.wrapper({ class: props.ui?.wrapper })">
36
+ <h1 v-if="title || !!slots.title" :class="ui.title({ class: props.ui?.title })">
37
+ <slot name="title">
38
+ {{ title }}
39
+ </slot>
40
+ </h1>
41
+
42
+ <div v-if="links?.length || !!slots.links" :class="ui.links({ class: props.ui?.links })">
43
+ <slot name="links">
44
+ <UButton v-for="(link, index) in links" :key="index" color="neutral" variant="outline" v-bind="link" />
45
+ </slot>
46
+ </div>
47
+ </div>
48
+
49
+ <div v-if="description || !!slots.description" :class="ui.description({ class: props.ui?.description })">
50
+ <slot name="description">
51
+ {{ description }}
52
+ </slot>
53
+ </div>
54
+
55
+ <slot />
56
+ </div>
57
+ </Primitive>
58
+ </template>
@@ -0,0 +1,35 @@
1
+ import theme from '#build/ui/page-header';
2
+ import type { AppConfig } from '@nuxt/schema';
3
+ import type { ButtonProps, ComponentConfig } from '../types';
4
+ type PageHeader = ComponentConfig<typeof theme, AppConfig, 'pageHeader'>;
5
+ export interface PageHeaderProps {
6
+ /**
7
+ * The element or component this component should render as.
8
+ * @defaultValue 'div'
9
+ */
10
+ as?: any;
11
+ headline?: string;
12
+ title?: string;
13
+ description?: string;
14
+ /**
15
+ * Display a list of Button next to the title.
16
+ * `{ color: 'neutral', variant: 'outline' }`{lang="ts-type"}
17
+ */
18
+ links?: ButtonProps[];
19
+ class?: any;
20
+ ui?: PageHeader['slots'];
21
+ }
22
+ export interface PageHeaderSlots {
23
+ headline(props?: {}): any;
24
+ title(props?: {}): any;
25
+ description(props?: {}): any;
26
+ links(props?: {}): any;
27
+ default(props?: {}): any;
28
+ }
29
+ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PageHeaderProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PageHeaderProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, PageHeaderSlots>;
30
+ export default _default;
31
+ type __VLS_WithSlots<T, S> = T & {
32
+ new (): {
33
+ $slots: S;
34
+ };
35
+ };