fulldev-ui 0.5.0-beta.8 → 0.6.0-beta.0

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 (236) hide show
  1. package/.env.example +3 -0
  2. package/.prettierrc.yaml +1 -0
  3. package/astro.config.ts +6 -32
  4. package/package.json +21 -30
  5. package/pnpm-lock.yaml +696 -2176
  6. package/public/favicon/android-chrome-192x192.png +0 -0
  7. package/public/favicon/android-chrome-512x512.png +0 -0
  8. package/public/favicon/apple-touch-icon.png +0 -0
  9. package/public/favicon/manifest.webmanifest +7 -3
  10. package/public/favicon/mstile-150x150.png +0 -0
  11. package/src/blocks/Banner.astro +6 -19
  12. package/src/blocks/Colleagues.astro +0 -1
  13. package/src/blocks/Contact.astro +75 -74
  14. package/src/blocks/Content.astro +124 -6
  15. package/src/blocks/Cta.astro +0 -2
  16. package/src/blocks/Excerpt.astro +0 -2
  17. package/src/blocks/Footer.astro +107 -3
  18. package/src/blocks/Hero.astro +238 -9
  19. package/src/blocks/Intro.astro +89 -11
  20. package/src/blocks/Prices.astro +1 -1
  21. package/src/blocks/Product.astro +51 -68
  22. package/src/blocks/Products.astro +114 -5
  23. package/src/blocks/Reviews.astro +0 -1
  24. package/src/blocks/_Contact.astro +112 -0
  25. package/src/components/Avatar.astro +28 -9
  26. package/src/components/Avatars.astro +36 -0
  27. package/src/components/Badge.astro +73 -26
  28. package/src/components/Badges.astro +16 -23
  29. package/src/components/Breadcrumb.astro +58 -0
  30. package/src/components/Button.astro +56 -112
  31. package/src/components/Buttons.astro +23 -13
  32. package/src/components/Card.astro +129 -115
  33. package/src/components/Cards.astro +33 -35
  34. package/src/components/Carousel.astro +106 -0
  35. package/src/components/Cart.astro +1 -1
  36. package/src/components/CartForm.astro +9 -9
  37. package/src/components/CartList.astro +11 -28
  38. package/src/components/CartSummary.astro +11 -13
  39. package/src/components/Channel.astro +40 -22
  40. package/src/components/Channels.astro +20 -6
  41. package/src/components/Checkbox.astro +52 -27
  42. package/src/components/Code.astro +52 -0
  43. package/src/components/Dialog.astro +2 -2
  44. package/src/components/Drawer.astro +34 -64
  45. package/src/components/Element.astro +16 -8
  46. package/src/components/Form.astro +14 -13
  47. package/src/components/Gallery.astro +172 -0
  48. package/src/components/Head.astro +52 -1
  49. package/src/components/Header.astro +73 -83
  50. package/src/components/Heading.astro +74 -30
  51. package/src/components/Icon.astro +25 -30
  52. package/src/components/Image.astro +23 -38
  53. package/src/components/Input.astro +59 -53
  54. package/src/components/Label.astro +20 -15
  55. package/src/components/Lead.astro +46 -0
  56. package/src/components/Link.astro +51 -26
  57. package/src/components/Links.astro +42 -0
  58. package/src/components/List.astro +41 -16
  59. package/src/components/LocaleSwitcher.astro +2 -2
  60. package/src/components/Logo.astro +45 -0
  61. package/src/components/Menu.astro +21 -17
  62. package/src/components/Paragraph.astro +38 -0
  63. package/src/components/Price.astro +1 -1
  64. package/src/components/Prose.astro +169 -0
  65. package/src/components/Rating.astro +50 -38
  66. package/src/components/Search.astro +1 -1
  67. package/src/components/Section.astro +196 -158
  68. package/src/components/Select.astro +44 -55
  69. package/src/components/Sidebar.astro +31 -38
  70. package/src/components/Social.astro +3 -8
  71. package/src/components/Socials.astro +9 -5
  72. package/src/components/Subheader.astro +59 -0
  73. package/src/components/Switch.astro +72 -29
  74. package/src/components/Table.astro +1 -1
  75. package/src/components/Tagline.astro +40 -12
  76. package/src/components/Text.astro +4 -4
  77. package/src/components/Textarea.astro +40 -50
  78. package/src/components/Themer.astro +76 -0
  79. package/src/components/Toc.astro +24 -32
  80. package/src/components/Writeup.astro +26 -8
  81. package/src/components/docs/PropsTable.astro +38 -264
  82. package/src/components/experimental/Window.astro +5 -57
  83. package/src/components/sections.astro +1 -1
  84. package/src/content/pages/blocks/_categories.mdx +1 -1
  85. package/src/content/pages/blocks/_footer.mdx +1 -1
  86. package/src/content/pages/blocks/_header.mdx +1 -3
  87. package/src/content/pages/blocks/_jobs.mdx +1 -1
  88. package/src/content/pages/blocks/_prices.mdx +1 -1
  89. package/src/content/pages/blocks/_product.mdx +1 -1
  90. package/src/content/pages/blocks/_products.mdx +1 -1
  91. package/src/content/pages/blocks/_stats.mdx +1 -1
  92. package/src/content/pages/blocks/banner.mdx +1 -1
  93. package/src/content/pages/blocks/colleagues.mdx +1 -2
  94. package/src/content/pages/blocks/contact.mdx +1 -1
  95. package/src/content/pages/blocks/content.mdx +1 -5
  96. package/src/content/pages/blocks/cta.mdx +1 -9
  97. package/src/content/pages/blocks/features.mdx +1 -4
  98. package/src/content/pages/blocks/hero.mdx +1 -4
  99. package/src/content/pages/blocks/intro.mdx +1 -4
  100. package/src/content/pages/blocks/posts.mdx +1 -1
  101. package/src/content/pages/blocks/reviews.mdx +1 -2
  102. package/src/content/pages/docs/_internationalization.mdx +55 -0
  103. package/src/content/pages/docs/_using-blocks.mdx +33 -0
  104. package/src/content/pages/docs/_using-presets.mdx +49 -0
  105. package/src/content/pages/docs/blocks.mdx +33 -0
  106. package/src/content/pages/docs/collections/images.mdx +100 -0
  107. package/src/content/pages/docs/collections/pages.mdx +119 -0
  108. package/src/content/pages/docs/collections/presets.mdx +60 -0
  109. package/src/content/pages/docs/collections.mdx +42 -0
  110. package/src/content/pages/{base/card.mdx → docs/components/_card.mdx} +1 -3
  111. package/src/content/pages/{base → docs/components}/_switch.mdx +2 -2
  112. package/src/content/pages/{typography → docs/components}/_tagline.mdx +2 -2
  113. package/src/content/pages/docs/components/_toggle.mdx +31 -0
  114. package/src/content/pages/docs/components/avatar.mdx +35 -0
  115. package/src/content/pages/{base → docs/components}/badge.mdx +27 -8
  116. package/src/content/pages/docs/components/badges.mdx +47 -0
  117. package/src/content/pages/{base → docs/components}/button.mdx +29 -10
  118. package/src/content/pages/docs/components/buttons.mdx +52 -0
  119. package/src/content/pages/docs/components/channel.mdx +92 -0
  120. package/src/content/pages/docs/components/channels.mdx +90 -0
  121. package/src/content/pages/{base → docs/components}/checkbox.mdx +10 -17
  122. package/src/content/pages/docs/components/code.mdx +46 -0
  123. package/src/content/pages/docs/components/heading.mdx +60 -0
  124. package/src/content/pages/docs/components/icon.mdx +49 -0
  125. package/src/content/pages/docs/components/image.mdx +26 -0
  126. package/src/content/pages/docs/components/input.mdx +41 -0
  127. package/src/content/pages/{typography → docs/components}/label.mdx +8 -4
  128. package/src/content/pages/docs/components/lead.mdx +51 -0
  129. package/src/content/pages/{typography → docs/components}/link.mdx +23 -8
  130. package/src/content/pages/docs/components/links.mdx +100 -0
  131. package/src/content/pages/docs/components/list.mdx +45 -0
  132. package/src/content/pages/docs/components/logo.mdx +37 -0
  133. package/src/content/pages/docs/components/menu.mdx +90 -0
  134. package/src/content/pages/docs/components/paragraph.mdx +51 -0
  135. package/src/content/pages/docs/components/prose.mdx +37 -0
  136. package/src/content/pages/docs/components/rating.mdx +77 -0
  137. package/src/content/pages/{base → docs/components}/section.mdx +1 -1
  138. package/src/content/pages/{base → docs/components}/select.mdx +0 -9
  139. package/src/content/pages/docs/components/social.mdx +95 -0
  140. package/src/content/pages/docs/components/socials.mdx +103 -0
  141. package/src/content/pages/docs/components/switch.mdx +35 -0
  142. package/src/content/pages/{base → docs/components}/table.mdx +0 -2
  143. package/src/content/pages/docs/components/tagline.mdx +47 -0
  144. package/src/content/pages/docs/components/textarea.mdx +35 -0
  145. package/src/content/pages/docs/components/themer.mdx +50 -0
  146. package/src/content/pages/docs/components.mdx +40 -0
  147. package/src/content/pages/docs/customization.mdx +151 -0
  148. package/src/content/pages/docs/frameworks.mdx +29 -0
  149. package/src/content/pages/docs/generating-pages.mdx +129 -0
  150. package/src/content/pages/docs/index.mdx +23 -0
  151. package/src/content/pages/docs/installation.mdx +50 -0
  152. package/src/content/pages/docs/layouts.mdx +33 -0
  153. package/src/content/pages/index.mdx +11 -9
  154. package/src/content/pages/showcase.mdx +4 -2
  155. package/src/content/presets/base.yml +80 -63
  156. package/src/content/presets/docs.yml +2 -2
  157. package/src/css/color.css +0 -10
  158. package/src/css/custom.css +10 -12
  159. package/src/css/size.css +2 -11
  160. package/src/css/theme.css +93 -0
  161. package/src/images/logo-1.svg +11 -0
  162. package/src/images/logo-2.svg +13 -0
  163. package/src/images/logo-basic.svg +10 -0
  164. package/src/images/logo-simple.svg +13 -0
  165. package/src/images/logo-thin.svg +15 -0
  166. package/src/images/logo.svg +14 -0
  167. package/src/images/logofat.svg +11 -0
  168. package/src/integration/index.ts +71 -144
  169. package/src/layouts/CategoryLayout.astro +135 -0
  170. package/src/layouts/Layout.astro +62 -117
  171. package/src/layouts/PageLayout.astro +26 -0
  172. package/src/layouts/PostLayout.astro +13 -8
  173. package/src/layouts/ProductLayout.astro +94 -10
  174. package/src/pages/[...page].astro +14 -22
  175. package/src/pages/test.astro +20 -0
  176. package/src/schemas/components/button.ts +21 -13
  177. package/src/schemas/components/card.ts +36 -18
  178. package/src/schemas/components/footer.ts +2 -10
  179. package/src/schemas/components/global.ts +16 -0
  180. package/src/schemas/components/header.ts +8 -0
  181. package/src/schemas/components/image.ts +8 -3
  182. package/src/schemas/components/link.ts +16 -0
  183. package/src/schemas/components/links.ts +4 -0
  184. package/src/schemas/components/menu.ts +2 -0
  185. package/src/schemas/components/sidebar.ts +2 -2
  186. package/src/schemas/components/subheader.ts +9 -0
  187. package/src/schemas/components/themer.ts +3 -0
  188. package/src/schemas/pageSchema.ts +14 -21
  189. package/src/utils/cart.ts +1 -10
  190. package/src/utils/getDeepReferenceChildren.ts +14 -0
  191. package/src/utils/getReferenceChildren.ts +1 -1
  192. package/src/utils/setTheme.ts +18 -0
  193. package/src/utils/slugify.ts +6 -0
  194. package/tailwind.config.ts +67 -0
  195. package/src/blocks/Article.astro +0 -40
  196. package/src/components/Footer.astro +0 -193
  197. package/src/components/ThemeSelect.astro +0 -41
  198. package/src/components/experimental/Form.astro +0 -53
  199. package/src/components/experimental/Gallery.astro +0 -104
  200. package/src/components/experimental/Logo.astro +0 -38
  201. package/src/components/experimental/Prose.astro +0 -192
  202. package/src/content/pages/base/icon.mdx +0 -55
  203. package/src/content/pages/base/image.mdx +0 -42
  204. package/src/content/pages/base/input.mdx +0 -56
  205. package/src/content/pages/base/rating.mdx +0 -55
  206. package/src/content/pages/base/textarea.mdx +0 -58
  207. package/src/content/pages/base/theme-select.mdx +0 -15
  208. package/src/content/pages/layouts/_layout.mdx +0 -14
  209. package/src/content/pages/layouts/docslayout.mdx +0 -14
  210. package/src/content/pages/overview/components.mdx +0 -75
  211. package/src/content/pages/overview/content-collections.mdx +0 -139
  212. package/src/content/pages/overview/frameworks.mdx +0 -198
  213. package/src/content/pages/overview/installation.mdx +0 -53
  214. package/src/content/pages/overview/introduction.mdx +0 -30
  215. package/src/content/pages/overview/theming.mdx +0 -69
  216. package/src/content/pages/schemas/page.mdx +0 -17
  217. package/src/content/pages/schemas/preset.mdx +0 -9
  218. package/src/content/pages/showcase/record.md +0 -3
  219. package/src/content/pages/typography/heading.mdx +0 -73
  220. package/src/content/pages/typography/list.mdx +0 -51
  221. package/src/content/pages/typography/text.mdx +0 -61
  222. package/src/content/presets/blocks.yml +0 -1
  223. package/src/css/space.css +0 -77
  224. package/src/css/styles.css +0 -0
  225. package/src/images/avatar-1.yml +0 -1
  226. package/src/integration/generate-colors.ts +0 -639
  227. package/src/integration/tailwind-plugin.ts +0 -80
  228. package/src/integration/unocss-preset.ts +0 -84
  229. package/src/layouts/BlockLayout.astro +0 -19
  230. package/src/layouts/ContactLayout.astro +0 -21
  231. package/src/layouts/DocsLayout.astro +0 -73
  232. package/src/layouts/OverviewLayout.astro +0 -42
  233. /package/src/content/pages/{base → docs/components}/_dialog.mdx +0 -0
  234. /package/src/content/pages/{base → docs/components}/_drawer.mdx +0 -0
  235. /package/src/content/pages/{base → docs/components}/_localeswitcher.mdx +0 -0
  236. /package/src/schemas/utils/{parents.ts → categories.ts} +0 -0
package/src/layouts/Layout.astro CHANGED
@@ -1,163 +1,108 @@
1
1
  ---
2
2
  import type { ComponentProps, HTMLAttributes } from 'astro/types'
3
- import type { CollectionEntry } from 'astro:content'
4
- import Article from 'fulldev-ui/blocks/Article.astro'
5
3
  import Banner from 'fulldev-ui/blocks/Banner.astro'
6
4
  import Footer from 'fulldev-ui/blocks/Footer.astro'
7
5
  import Element from 'fulldev-ui/components/Element.astro'
8
6
  import Head from 'fulldev-ui/components/Head.astro'
9
7
  import Header from 'fulldev-ui/components/Header.astro'
10
- import Section from 'fulldev-ui/components/Section.astro'
11
- import Sections from 'fulldev-ui/components/sections.astro'
12
8
  import Sidebar from 'fulldev-ui/components/Sidebar.astro'
13
- import type { GlobalProps } from 'fulldev-ui/types/global-props'
9
+ import Subheader from 'fulldev-ui/components/Subheader.astro'
14
10
 
15
- type Props = GlobalProps &
16
- HTMLAttributes<'html'> & {
17
- render: CollectionEntry<'pages'>['render']
18
- slug: CollectionEntry<'pages'>['slug']
19
- header?: ComponentProps<typeof Header>
20
- footer?: ComponentProps<typeof Footer>
21
- sections?: ComponentProps<typeof Sections>['sections']
22
- section?: ComponentProps<typeof Section> | undefined
23
- banner?: any
24
- toc?: any
25
- sidebar?: any
26
- navigation?: any
27
- themeselect?: any
28
- code?: {
29
- head?: string
30
- body?: string
31
- }
11
+ type Props = HTMLAttributes<'html'> & {
12
+ banner?: ComponentProps<typeof Banner>['text'] | undefined
13
+ header?: ComponentProps<typeof Header> | undefined
14
+ subheader?: ComponentProps<typeof Subheader> | undefined
15
+ sidebar?: ComponentProps<typeof Sidebar> | undefined
16
+ footer?: ComponentProps<typeof Footer> | undefined
17
+ theme?: 'light' | 'dark' | 'system' | undefined
18
+ title?: string
19
+ code?: {
20
+ head?: string
21
+ body?: string
22
+ }
23
+ description?: string
24
+ image?: any
25
+ seo?: {
32
26
  title?: string
33
27
  description?: string
34
28
  image?: string
35
- seo?: {
36
- title?: string
37
- description?: string
38
- image?: string
39
- }
40
29
  }
30
+ next?: string
31
+ prev?: string
32
+ }
41
33
 
42
34
  const {
43
- render,
35
+ banner,
44
36
  header,
45
- navigation,
46
- footer,
37
+ subheader,
47
38
  sidebar,
48
- toc,
49
- sections,
39
+ footer,
50
40
  theme,
51
- section,
52
- banner,
53
41
  code,
54
- themeselect,
42
+ next,
43
+ prev,
55
44
  ...rest
56
45
  } = Astro.props
57
46
  ---
58
47
 
59
48
  <!doctype html>
60
- <html {...rest}>
49
+ <html
50
+ class="layout"
51
+ {...rest}
52
+ >
61
53
  <Head {...Astro.props} />
62
54
  <Element
55
+ class:list="layout-body"
63
56
  as="body"
64
57
  {theme}
65
58
  >
66
- <slot name="banner">
67
- <Banner text={banner} />
68
- </slot>
69
- <slot name="header">
70
- <Header
71
- {...navigation?.header === true ? navigation : {}}
72
- {...header}
73
- />
74
- </slot>
75
- <div class="core">
76
- <slot name="sidebar">
77
- <Sidebar
78
- {...navigation?.sidebar === true ? navigation : {}}
79
- logo={navigation?.sidebar?.header
80
- ? undefined
81
- : navigation?.sidebar?.logo}
82
- company={navigation?.sidebar?.header
83
- ? undefined
84
- : navigation?.sidebar?.company}
85
- {...sidebar}
86
- />
87
- </slot>
88
- <main data-pagefind-body>
89
- <slot>
90
- <Section {...section} />
91
- <Article />
92
- <Sections {sections} />
93
- </slot>
59
+ <Banner text={banner} />
60
+ <Header {...header} />
61
+ <Subheader {...subheader} />
62
+ <slot name="before" />
63
+
64
+ <Element class:list={['layout-container', { 'has-sidebar': sidebar }]}>
65
+ <Sidebar {...sidebar} />
66
+ <main class="layout-main">
67
+ <slot />
94
68
  </main>
95
- </div>
96
- <slot name="footer">
97
- <Footer {...footer} />
98
- </slot>
69
+ </Element>
70
+ <Footer {...footer} />
71
+ <slot name="after" />
99
72
  <Fragment set:html={code?.body} />
100
73
 
101
- <style lang="scss" is:global>
74
+ <style is:global>
102
75
  @layer fulldev {
103
- html {
104
- width: 100%;
105
- min-height: 100vh;
106
- scroll-behavior: smooth;
107
- color-scheme: var(--color-scheme);
108
- font-size: var(--text-2);
109
- font-family: 'Inter', sans-serif;
76
+ .layout {
77
+ @apply w-full font-sans text-base leading-relaxed text-foreground;
78
+ color-scheme: light;
79
+
80
+ &.dark {
81
+ color-scheme: dark;
82
+ }
110
83
  }
111
84
 
112
- body {
113
- display: flex;
114
- flex-direction: column;
115
- background-color: var(--base-background);
116
- width: 100%;
117
- min-height: 100vh;
118
- color: var(--base-11);
85
+ .layout-body {
86
+ @apply flex min-h-screen w-full flex-col bg-background font-sans text-foreground;
87
+ }
119
88
 
120
- .for-sidebar {
121
- @media (min-width: 1024px) {
122
- display: none;
89
+ .layout-container {
90
+ @apply relative flex h-full w-full flex-grow;
123
91
 
124
- ~ * {
125
- --header-height: 0px;
126
- }
127
- }
92
+ &.has-sidebar {
93
+ @apply container px-0;
128
94
  }
95
+ }
129
96
 
130
- .core {
131
- display: flex;
132
- position: relative;
133
- flex-grow: 1;
134
- height: 100%;
97
+ .layout-main {
98
+ @apply flex w-full max-w-full flex-1 shrink flex-col;
135
99
 
136
- main {
137
- --screen: 1280px;
138
- display: flex;
139
- flex: 1;
140
- flex-direction: column;
141
- background-color: var(--color-background);
142
- width: 100%;
143
- max-width: 100vw;
144
- }
100
+ /* full width minus sidebar width */
101
+ @media (min-width: 1024px) {
102
+ max-width: calc(100% - var(--sidebar-width, 0px));
145
103
  }
146
104
  }
147
105
  }
148
106
  </style>
149
107
  </Element>
150
108
  </html>
151
-
152
- <script>
153
- const setTheme = (document: Document) => {
154
- const theme = localStorage.getItem('theme') || ''
155
- document.body.classList.add(`theme-${theme}`)
156
- }
157
-
158
- setTheme(document)
159
-
160
- document.addEventListener('astro:before-swap', (event) => {
161
- setTheme(event.newDocument)
162
- })
163
- </script>
package/src/layouts/PageLayout.astro ADDED
@@ -0,0 +1,26 @@
1
+ ---
2
+ import type { ComponentProps } from 'astro/types'
3
+ import Hero from 'fulldev-ui/blocks/Hero.astro'
4
+ import Prose from 'fulldev-ui/components/Prose.astro'
5
+ import Sections from 'fulldev-ui/components/sections.astro'
6
+ import Layout from 'fulldev-ui/layouts/Layout.astro'
7
+
8
+ interface Props
9
+ extends ComponentProps<typeof Layout>,
10
+ ComponentProps<typeof Prose> {
11
+ hero?: ComponentProps<typeof Hero>
12
+ sections?: ComponentProps<typeof Sections>['sections']
13
+ }
14
+
15
+ const { hero, render, toc, sections, ...rest } = Astro.props
16
+ ---
17
+
18
+ <Layout {...rest}>
19
+ <Hero {...hero} />
20
+ <Prose
21
+ {render}
22
+ {toc}
23
+ />
24
+ <Sections {sections} />
25
+ <slot />
26
+ </Layout>
package/src/layouts/PostLayout.astro CHANGED
@@ -1,21 +1,26 @@
1
1
  ---
2
2
  import type { ComponentProps } from 'astro/types'
3
- import Article from 'fulldev-ui/blocks/Article.astro'
3
+ import Hero from 'fulldev-ui/blocks/Hero.astro'
4
+ import Prose from 'fulldev-ui/components/Prose.astro'
4
5
  import Sections from 'fulldev-ui/components/sections.astro'
5
6
  import Layout from 'fulldev-ui/layouts/Layout.astro'
6
7
 
7
- type Props = ComponentProps<typeof Layout>
8
+ interface Props
9
+ extends ComponentProps<typeof Layout>,
10
+ ComponentProps<typeof Prose> {
11
+ hero?: ComponentProps<typeof Hero>
12
+ sections?: ComponentProps<typeof Sections>['sections']
13
+ }
8
14
 
9
- const { sections, render, toc } = Astro.props
15
+ const { hero, render, toc, sections, ...rest } = Astro.props
10
16
  ---
11
17
 
12
- <Layout {...Astro.props}>
13
- <Article
18
+ <Layout {...rest}>
19
+ <Hero {...hero} />
20
+ <Prose
14
21
  {render}
15
22
  {toc}
16
- >
17
- <slot name="prose" />
18
- </Article>
23
+ />
19
24
  <Sections {sections} />
20
25
  <slot />
21
26
  </Layout>
package/src/layouts/ProductLayout.astro CHANGED
@@ -1,21 +1,105 @@
1
1
  ---
2
- import type { ComponentProps } from 'astro/types'
3
- import Article from 'fulldev-ui/blocks/Article.astro'
4
- import Section from 'fulldev-ui/components/Section.astro'
2
+ import { getImage } from 'astro:assets'
3
+ import CartForm from 'fulldev-ui/components/CartForm.astro'
4
+ import Element from 'fulldev-ui/components/Element.astro'
5
+ import Gallery from 'fulldev-ui/components/Gallery.astro'
6
+ import Heading from 'fulldev-ui/components/Heading.astro'
7
+ import List from 'fulldev-ui/components/List.astro'
8
+ import Paragraph from 'fulldev-ui/components/Paragraph.astro'
9
+ import Prose from 'fulldev-ui/components/Prose.astro'
5
10
  import Sections from 'fulldev-ui/components/sections.astro'
6
11
  import Layout from 'fulldev-ui/layouts/Layout.astro'
7
12
 
8
- type Props = ComponentProps<typeof Layout>
13
+ const {
14
+ variant = 1,
15
+ level = 1,
16
+ heading,
17
+ paragraph,
18
+ title,
19
+ list,
20
+ price,
21
+ images,
22
+ text,
23
+ subheading,
24
+ variants,
25
+ button,
26
+ description,
27
+ form,
28
+ uitverkocht,
29
+ render,
30
+ sections,
31
+ banner,
32
+ } = Astro.props
9
33
 
10
- const { render, sections, ...rest } = Astro.props
34
+ const slug = Astro.url.pathname.replace(/^\/|\/$/g, '') || 'index'
35
+ const imageId = images?.[0]?.id
36
+ const src = `/src/images/${imageId}`
37
+ const allImages = import.meta.glob<{ default: ImageMetadata }>('/src/images/*')
38
+ const foundImage = allImages[src]
39
+ const gotImage =
40
+ imageId && (await getImage({ src: foundImage ? foundImage() : src }))
11
41
  ---
12
42
 
13
43
  <Layout {...Astro.props}>
14
- <Section
15
- component="Product"
16
- {...rest as any}
17
- />
18
- <Article />
44
+ <Element
45
+ class:list="product"
46
+ as="section"
47
+ >
48
+ <Element class:list="product-container">
49
+ <Element class:list="product-main">
50
+ <Gallery {images} />
51
+ <!-- <Prose {render} /> -->
52
+ </Element>
53
+ <Element class:list="product-segment">
54
+ <Element class:list="product-content">
55
+ <Heading
56
+ {level}
57
+ text={heading || title}
58
+ />
59
+ <Paragraph text={paragraph || description} />
60
+ </Element>
61
+ <CartForm
62
+ soldout={uitverkocht}
63
+ image={gotImage?.src}
64
+ {title}
65
+ {price}
66
+ {slug}
67
+ {variants}
68
+ />
69
+ <List
70
+ size="sm"
71
+ items={banner.split('|')}
72
+ />
73
+ </Element>
74
+ </Element>
75
+ </Element>
19
76
  <Sections {sections} />
20
77
  <slot />
21
78
  </Layout>
79
+
80
+ <style is:global>
81
+ .product {
82
+ @apply relative w-full;
83
+
84
+ .product-container {
85
+ @apply flex h-full w-full flex-col items-start gap-32 lg:container lg:grid lg:grid-cols-2 lg:py-8;
86
+ }
87
+
88
+ .product-segment {
89
+ @apply z-10 flex flex-col items-start gap-8 max-lg:container lg:sticky lg:top-0;
90
+
91
+ --height: calc(
92
+ var(--header-height, 0px) + var(--subheader-height, 0px) + 2rem
93
+ );
94
+ top: var(--height);
95
+ }
96
+
97
+ .product-content {
98
+ @apply flex max-w-screen-md flex-col gap-6;
99
+ }
100
+
101
+ &.dark {
102
+ @apply bg-background;
103
+ }
104
+ }
105
+ </style>
package/src/pages/[...page].astro CHANGED
@@ -1,6 +1,6 @@
1
1
  ---
2
2
  import { getCollection } from 'astro:content'
3
- import Layout from 'fulldev-ui/layouts/Layout.astro'
3
+ import PageLayout from 'fulldev-ui/layouts/PageLayout.astro'
4
4
 
5
5
  export async function getStaticPaths() {
6
6
  const pages = await getCollection('pages')
@@ -13,32 +13,24 @@ export async function getStaticPaths() {
13
13
  }
14
14
 
15
15
  const { data, ...rest } = Astro.props
16
-
17
16
  const { component, ...restData } = data
18
17
 
19
- const allComponents = {
20
- ...import.meta.glob('/src/**/*.astro'),
21
- ...import.meta.glob('../../**/*.astro'),
18
+ const layouts = {
19
+ ...import.meta.glob('/src/layouts/**/*.astro'),
20
+ ...import.meta.glob('../layouts/**/*.astro'),
22
21
  }
23
22
 
24
- const componentPath = Object.keys(allComponents).find(
25
- (path) => path.split('/').pop()?.split('.')[0] === component
26
- )
23
+ const componentPath = Object.keys(layouts).find((path) => {
24
+ const strip = (str?: string) => str?.split('/').pop()?.split('.')[0]
25
+ return strip(path) === strip(component)
26
+ })
27
27
 
28
28
  const Component =
29
- componentPath && (await (allComponents[componentPath] as any)()).default
29
+ (componentPath && (await (layouts[componentPath] as any)()).default) ??
30
+ PageLayout
30
31
  ---
31
32
 
32
- {
33
- Component ? (
34
- <Component
35
- {...restData}
36
- {...rest}
37
- />
38
- ) : (
39
- <Layout
40
- {...(data as any)}
41
- {...rest}
42
- />
43
- )
44
- }
33
+ <Component
34
+ {...restData}
35
+ {...rest}
36
+ />
package/src/pages/test.astro ADDED
@@ -0,0 +1,20 @@
1
+ ---
2
+ import Product from 'fulldev-ui/blocks/Product.astro'
3
+ import Layout from 'fulldev-ui/layouts/Layout.astro'
4
+
5
+ const product = {
6
+ images: [
7
+ '/src/images/placeholder-right.webp',
8
+ '/src/images/placeholder-right.webp',
9
+ '/src/images/placeholder-right.webp',
10
+ '/src/images/placeholder-right.webp',
11
+ '/src/images/placeholder-right.webp',
12
+ ],
13
+ title: 'Hello world',
14
+ description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
15
+ }
16
+ ---
17
+
18
+ <Layout>
19
+ <Product {...product} />
20
+ </Layout>
package/src/schemas/components/button.ts CHANGED
@@ -1,16 +1,24 @@
1
1
  import { z } from 'astro:content'
2
2
  import pathSchema from '../utils/pathSchema'
3
+ import globalSchema from './global'
3
4
 
4
- export default z.union([pathSchema('pages'), z.object({}).passthrough()]).pipe(
5
- z
6
- .object({
7
- slug: z
8
- .string()
9
- .refine(async (data) => await pathSchema('pages').parseAsync(data)),
10
- text: z.string(),
11
- href: z.string(),
12
- icon: z.string(),
13
- })
14
- .partial()
15
- .passthrough()
16
- )
5
+ export const buttonSchema = z
6
+ .union([pathSchema('pages'), z.object({}).passthrough()])
7
+ .pipe(
8
+ globalSchema
9
+ .extend({
10
+ slug: z
11
+ .string()
12
+ .refine(async (data) => await pathSchema('pages').parseAsync(data)),
13
+ text: z.string(),
14
+ href: z.string(),
15
+ icon: z.string(),
16
+ })
17
+ .partial()
18
+ .passthrough()
19
+ .merge(globalSchema)
20
+ )
21
+
22
+ export type ButtonSchema = z.infer<typeof buttonSchema>
23
+
24
+ export default buttonSchema
package/src/schemas/components/card.ts CHANGED
@@ -1,25 +1,43 @@
1
+ import { z } from 'astro:content'
2
+ import pathSchema from '../utils/pathSchema'
1
3
  import button from './button'
2
4
  import buttons from './buttons'
5
+ import globalSchema from './global'
3
6
  import icon from './icon'
4
7
  import image from './image'
5
8
  import images from './images'
6
9
 
7
- import { z } from 'astro:content'
8
- import pathSchema from '../utils/pathSchema'
9
- import writeup from './writeup'
10
+ export const cardSchema = z
11
+ .union([pathSchema('pages'), z.object({}).passthrough()])
12
+ .pipe(
13
+ globalSchema
14
+ .extend({
15
+ slug: z
16
+ .string()
17
+ .refine(async (data) => await pathSchema('pages').parseAsync(data)),
18
+ image: image,
19
+ images: images,
20
+ position: z.enum(['background', 'cover', 'inset']),
21
+ buttons: buttons,
22
+ button: button,
23
+ variant: z.string(),
24
+ align: z.string().default('start'),
25
+ icon: icon,
26
+ price: z.number(),
27
+ panel: z.boolean().default(true),
28
+ title: z.string(),
29
+ heading: z.string(),
30
+ level: z.number().min(1).max(6).default(4),
31
+ badge: z.any(),
32
+ tagline: z.string(),
33
+ rating: z.number(),
34
+ text: z.string(),
35
+ list: z.array(z.any()),
36
+ })
37
+ .partial()
38
+ .passthrough()
39
+ )
40
+
41
+ export type CardSchema = z.infer<typeof cardSchema>
10
42
 
11
- export default z.union([pathSchema('pages'), z.object({}).passthrough()]).pipe(
12
- writeup
13
- .extend({
14
- slug: z
15
- .string()
16
- .refine(async (data) => await pathSchema('pages').parseAsync(data)),
17
- image,
18
- images,
19
- buttons,
20
- button,
21
- icon,
22
- })
23
- .partial()
24
- .passthrough()
25
- )
43
+ export default cardSchema
package/src/schemas/components/footer.ts CHANGED
@@ -1,8 +1,7 @@
1
1
  import { z } from 'astro:content'
2
- import buttons from './buttons'
3
2
  import channels from './channels'
4
- import heading from './heading'
5
3
  import logo from './logo'
4
+ import menu from './menu'
6
5
  import socials from './socials'
7
6
  import text from './text'
8
7
 
@@ -12,14 +11,7 @@ export default z
12
11
  text,
13
12
  socials,
14
13
  channels,
15
- columns: z.array(
16
- z
17
- .object({
18
- heading,
19
- buttons,
20
- })
21
- .partial()
22
- ),
14
+ menu,
23
15
  })
24
16
  .partial()
25
17
  .passthrough()
package/src/schemas/components/global.ts ADDED
@@ -0,0 +1,16 @@
1
+ import { z } from 'astro:content'
2
+
3
+ export const globalSchema = z
4
+ .object({
5
+ if: z.any(),
6
+ theme: z.enum(['light', 'dark']),
7
+ color: z.enum(['base', 'brand']),
8
+ size: z.enum(['sm', 'md', 'lg']),
9
+ contrast: z.boolean(),
10
+ })
11
+ .partial()
12
+ .passthrough()
13
+
14
+ export type GlobalSchema = z.infer<typeof globalSchema>
15
+
16
+ export default globalSchema
package/src/schemas/components/header.ts CHANGED
@@ -1,11 +1,19 @@
1
1
  import { z } from 'astro:content'
2
2
  import buttons from './buttons'
3
+ import links from './links'
3
4
  import logo from './logo'
5
+ import menu from './menu'
6
+ import subheader from './subheader'
7
+ import themer from './themer'
4
8
 
5
9
  export default z
6
10
  .object({
11
+ themer,
12
+ subheader,
7
13
  logo,
8
14
  buttons,
15
+ links,
16
+ menu,
9
17
  })
10
18
  .partial()
11
19
  .passthrough()
package/src/schemas/components/image.ts CHANGED
@@ -1,6 +1,13 @@
1
1
  import { reference, z } from 'astro:content'
2
2
 
3
- export default z.union([reference('images'), z.object({}).passthrough()]).pipe(
3
+ const imagePath = z.preprocess((data: unknown) => {
4
+ if (typeof data === 'string') {
5
+ return data.split('/').pop()
6
+ }
7
+ return data
8
+ }, reference('images'))
9
+
10
+ export default z.union([imagePath, z.object({}).passthrough()]).pipe(
4
11
  z
5
12
  .object({
6
13
  id: z
@@ -14,5 +21,3 @@ export default z.union([reference('images'), z.object({}).passthrough()]).pipe(
14
21
  .partial()
15
22
  .passthrough()
16
23
  )
17
-
18
- // export default z.any()