fulldev-ui 0.5.0-beta.9 → 0.6.0-beta-4

package/src/components/docs/PropsTable.astro

@@ -1,275 +1,49 @@
 ---
-import Table from 'fulldev-ui/components/Table.astro'
-import { readFileSync } from 'node:fs'
-import { pascal } from 'radash'
-
-const slug = Astro.params.page || 'index'
-const componentName = pascal(slug)
-
-const allComponents = import.meta.glob('/src/**/*.astro', { eager: true })
-const foundComponent = Object.entries(allComponents).find(
-  ([key]) => key.split('/').pop() === `${componentName}.astro`
-)?.[1] as any
-const componentFileContent =
-  (foundComponent && readFileSync(foundComponent.file, 'utf-8')) || ''
-
-interface Prop {
-  name: string
-  type: string
-}
-
-// Regular expression to match the Props interface or type
-const staticProps = /(?:interface|type)\s+Props[\s\S]*?{([\s\S]*?)}/
-
-// Function to extract props from the component file
-const extractProps = (content: string): Prop[] => {
-  const props: Prop[] = []
-
-  // Extract static props from Props interface or type
-  const staticPropsMatch = content.match(staticProps)
-  if (staticPropsMatch && staticPropsMatch[1]) {
-    const propsContent = staticPropsMatch[1]
-    const propLines = propsContent.split('\n')
-
-    let currentProp: Prop | null = null
-
-    propLines.forEach((line) => {
-      const trimmedLine = line.trim()
-      if (trimmedLine === '') return
-
-      // Match prop name and type
-      const match = trimmedLine.match(/^(\w+)(\??):(.*)/)
-      if (match && match[1] && match[3]) {
-        if (currentProp) props.push(currentProp)
-        currentProp = {
-          name: match[1],
-          type: match[3].trim(),
-        }
-      } else if (currentProp) {
-        // Continue adding to type if it spans multiple lines
-        currentProp.type += ' ' + trimmedLine
-      }
-    })
-
-    if (currentProp) props.push(currentProp)
-  }
-
-  // Extract props from type intersections
-  const intersectionProps = content.match(
-    /Props(?:<[^>]+>)?\s*=\s*([\s\S]*?)(?:$|\n\n)/
-  )
-  if (intersectionProps && intersectionProps[1]) {
-    const intersectionContent = intersectionProps[1]
-    let currentProp: Prop | null = null
-    const lines = intersectionContent.split('\n')
-
-    lines.forEach((line) => {
-      const trimmedLine = line.trim()
-      if (trimmedLine === '') return
-
-      // Match prop name and type
-      const match = trimmedLine.match(/(\w+)(\??):(.*)/)
-      if (match && match[1] && match[3]) {
-        if (currentProp) props.push(currentProp)
-        currentProp = {
-          name: match[1],
-          type: match[3].trim(),
-        }
-      } else if (currentProp) {
-        // Continue adding to type if it spans multiple lines
-        currentProp.type += ' ' + trimmedLine
-      }
-    })
-
-    if (currentProp) props.push(currentProp)
-  }
-
-  // Clean up the type of the last prop
-  if (props.length > 0) {
-    const lastProp = props[props.length - 1]
-    if (lastProp) {
-      lastProp.type = lastProp.type.replace(/\s*}\s*$/, '')
-    }
-  }
-
-  // Filter out 'as' prop and props starting with underscore
-  return props.filter(
-    (prop) => prop.name !== 'as' && !prop.name.startsWith('_')
-  )
-}
-
-// Function to extract default prop values from Astro.props
-const extractDefaultProps = (content: string): Record<string, string> => {
-  const defaultPropsMatch = content.match(
-    /const\s*{[\s\S]*?}\s*=\s*Astro\.props/
-  )
-  return defaultPropsMatch
-    ? [
-        ...defaultPropsMatch[0].matchAll(
-          /(\w+)\s*=\s*('[^']*'|"[^"]*"|[^,\n]+)/g
-        ),
-      ].reduce(
-        (acc, match) => {
-          const [, name, value] = match
-          if (name && name !== 'as' && value !== undefined) {
-            acc[name] =
-              value.startsWith("'") || value.startsWith('"')
-                ? value.slice(1, -1)
-                : value
-          }
-          return acc
-        },
-        {} as Record<string, string>
-      )
-    : {}
-}
-
-// Function to extract the default 'As' prop value from the interface or type
-const extractAsDefault = (content: string): string => {
-  const asTypeMatch = content.match(/type Props<As extends ([^>]+)>/)
-  if (asTypeMatch && asTypeMatch[1]) {
-    return asTypeMatch[1].trim().replace(/['"]/g, '')
-  }
-
-  const asInterfaceMatch = content.match(/interface Props<As extends ([^>]+)>/)
-  if (asInterfaceMatch && asInterfaceMatch[1]) {
-    return asInterfaceMatch[1].trim().replace(/['"]/g, '')
-  }
-
-  return ''
-}
-
-const parsedProps = extractProps(componentFileContent)
-const parsedAstroProps = extractDefaultProps(componentFileContent)
-const asDefault = extractAsDefault(componentFileContent)
-
-// Function to get the default value for a prop
-const getDefaultValue = (name: string): string => {
-  if (name in parsedAstroProps) {
-    return parsedAstroProps[name] || '-'
-  }
-
-  return '-'
-}
-
-// Check if the component extends Element.astro
-const extendsElement = componentFileContent.includes('GlobalProps')
-
-// Check if the component extends Writeup.astro
-const extendsWriteup = componentFileContent.includes(
-  'ComponentProps<typeof Writeup>'
-)
-
-// Prepare the table body data
-const tableBody = new Map()
-
-// Add component-specific props
-parsedProps.forEach((item) => {
-  tableBody.set(item.name, [
-    item.name,
-    item.type.replace(/\s*\|?\s*(undefined|null)/, '').trim(),
-    getDefaultValue(item.name),
-  ])
-})
-
-// Add Element props if the component extends Element.astro
-if (extendsElement) {
-  const elementProps = extractProps(
-    readFileSync('src/components/Element.astro', 'utf-8')
-  )
-  elementProps
-    .filter((item) => item.name !== '[key: string | number | symbol]')
-    .forEach((item) => {
-      if (!tableBody.has(item.name)) {
-        let type = item.type
-          .replace(/\s*\|?\s*(undefined|null)/, '')
-          .trim()
-          .replace(/\s*\|\s*any/, '')
-          .replace(/\s*\[key: string \| number \| symbol\]: any/, '')
-
-        // Remove [key: string | number | symbol]: any from the last prop
-        if (item === elementProps[elementProps.length - 1]) {
-          type = type.replace(/\s*\[key: string \| number \| symbol\]: any/, '')
-        }
-
-        if (item.name === 'size') {
-          type = "'sm' | 'md' | 'lg'"
-        } else if (item.name === 'color') {
-          type = "'base' | 'brand'"
-        }
-
-        tableBody.set(item.name, [item.name, type, getDefaultValue(item.name)])
-      }
-    })
-}
-
-// Add Writeup props if the component extends Writeup.astro
-if (extendsWriteup) {
-  const writeupProps = extractProps(
-    readFileSync('src/components/Writeup.astro', 'utf-8')
-  )
-  writeupProps
-    .filter((item) => item.name !== '[key: string | number | symbol]')
-    .forEach((item) => {
-      if (!tableBody.has(item.name)) {
-        let type = item.type
-          .replace(/\s*\|?\s*(undefined|null)/, '')
-          .trim()
-          .replace(/\s*\|\s*any/, '')
-          .replace(/\s*\[key: string \| number \| symbol\]: any/, '')
-
-        // Remove [key: string | number | symbol]: any from the last prop
-        if (item === writeupProps[writeupProps.length - 1]) {
-          type = type.replace(/\s*\[key: string \| number \| symbol\]: any/, '')
-        }
-
-        tableBody.set(item.name, [item.name, type, getDefaultValue(item.name)])
-      }
-    })
-}
-
-// Add 'as' prop only if asDefault is not empty
-if (asDefault) {
-  tableBody.set('as', ['as', 'HTMLTag', asDefault])
-}
-
-// Check if the component is polymorphic
-const isPolymorphic = componentFileContent.includes('Polymorphic<')
-
-// Extract HTMLAttributes from the component
-const htmlAttributesMatch = componentFileContent.match(
-  /HTMLAttributes<'(\w+)'>/
-)
-let htmlElement = htmlAttributesMatch ? htmlAttributesMatch[1] : ''
-
-// Special handling for List and Button components
-if (componentName === 'List') {
-  htmlElement = "'ul' | 'ol'"
-} else if (componentName === 'Button') {
-  htmlElement = "'button' | 'a' | 'label'"
-}
-
-// Add HTML Attributes row
-if (isPolymorphic && asDefault) {
-  tableBody.set('HTML Attributes', [
-    'HTML Attributes',
-    `Polymorphic<${asDefault}>`,
-    '-',
-  ])
-} else if (htmlElement) {
-  tableBody.set('HTML Attributes', ['HTML Attributes', `${htmlElement}`, '-'])
-}
+// const { schema } = Astro.props
+
+// import Table from 'fulldev-ui/components/Table.astro'
+// import { zodToJsonSchema } from 'zod-to-json-schema'
+
+// const slug = Astro.params.page?.split('/').pop() || ''
+
+// const allSchemas = import.meta.glob('/src/schemas/**/*.ts', {
+//   eager: true,
+// })
+
+// const schemaName = schema ?? slug
+// const foundSchema = Object.entries(allSchemas).find(([key]) =>
+//   key.toLowerCase().includes(`/${schemaName.toLowerCase()}.ts`)
+// )?.[1] as any
+
+// const jsonSchema = zodToJsonSchema(foundSchema?.default, {
+//   pipeStrategy: 'output',
+// }) as { properties?: Record<string, any> }
+
+// const properties = jsonSchema.properties || {}
+
+// const tableBody = Object.entries(properties).map(([key, value]: any) => {
+//   let type = 'any'
+//   if (value.enum) {
+//     type = value.enum.join(' | ')
+//   } else if (value.type) {
+//     type = value.type
+//   } else if (value.$ref) {
+//     type = `typeof ${key}`
+//   }
+//   const defaultValue = value.default?.toString() ?? '-'
+//   return [key, type, defaultValue]
+// })
 ---
 
-<Table
+<!-- <Table
   size="md"
   class:list={['props-table']}
   header={['Prop', 'Type', 'Default']}
-  body={Array.from(tableBody.values())}
+  body={tableBody}
 />
 
-<style is:global lang="scss">
+<style is:global>
   .props-table {
     overflow: auto;
   }
-</style>
+</style> -->

package/src/components/experimental/Window.astro

@@ -1,4 +1,4 @@
----
+<!-- ---
 import Button from 'fulldev-ui/components/Button.astro'
 
 const { componentProps } = Astro.props
@@ -25,7 +25,7 @@ const isComponent =
       </div>
     </div>
   ) : (
-    <div class="block window">
+    <div class="window block">
       <div class="button-header">
         <Button
           for={id}
@@ -50,22 +50,11 @@ const isComponent =
   )
 }
 
-<style lang="scss" is:global>
+<style is:global>
   @layer fulldev {
     .window {
-      display: flex;
-      flex-direction: column;
-      align-items: flex-start;
-      width: 100%;
-
       .code-container {
-        width: 100%;
-
-        .astro-code {
-          margin: 0;
-          background-color: #191919 !important;
-          padding: var(--space-5);
-        }
+        @apply w-full;
       }
 
       &.component {
@@ -130,45 +119,4 @@ const isComponent =
       }
     }
   }
-
-  // .window {
-  //   width: 100%;
-
-  //   &.component {
-  //     border: 1px solid var(--base-6);
-  //     border-radius: var(--radius-2);
-  //     overflow: hidden;
-
-  //     .example-container {
-  //       display: flex;
-  //       flex-direction: column;
-  //       align-items: start;
-  //       gap: var(--space-4);
-  //       padding: var(--space-5);
-  //     }
-
-  //     .astro-code {
-  //       border: none;
-  //       border-top: 1px solid var(--base-6);
-  //       border-radius: 0px;
-  //     }
-  //   }
-
-  //   &:not(.component) {
-  //     padding-top: var(--space-7);
-  //     padding-bottom: var(--space-7);
-
-  //     .live-code-layout {
-  //       display: flex;
-  //       flex-direction: column;
-  //       margin-top: var(--space-4);
-  //       width: 100%;
-  //       overflow: hidden;
-
-  //       .example-container {
-  //         border-top: 1px solid var(--base-6);
-  //       }
-  //     }
-  //   }
-  // }
-</style>
+</style> -->

package/src/content/config.ts

@@ -1,20 +1,14 @@
 import { defineCollection } from 'astro:content'
-import imageLoader from 'fulldev-ui/loaders/imageLoader.ts'
-import imageSchema from 'fulldev-ui/schemas/imageSchema.ts'
-import pageSchema from 'fulldev-ui/schemas/pageSchema.ts'
-import presetSchema from 'fulldev-ui/schemas/presetSchema.ts'
+import { layoutSchema } from 'fulldev-ui/schemas/layoutSchema.ts'
+import { pageSchema } from 'fulldev-ui/schemas/pageSchema.ts'
 
 export const collections = {
   pages: defineCollection({
     type: 'content',
     schema: pageSchema,
   }),
-  presets: defineCollection({
+  layouts: defineCollection({
     type: 'data',
-    schema: presetSchema,
-  }),
-  images: defineCollection({
-    loader: imageLoader,
-    schema: imageSchema,
+    schema: layoutSchema,
   }),
 }

package/src/content/{presets → layouts}/base.yml

@@ -1,83 +1,62 @@
-theme: dark
-
-seo:
+head:
+  title: Fulldev UI - Astro component and block library, open-source
   image: /images/og-image.png
-
-code:
-  head: |
+  theme: system
+  code: |
     <script is:inline>
       !function(t,e){var o,n,p,r;e.__SV||(window.posthog=e,e._i=[],e.init=function(i,s,a){function g(t,e){var o=e.split(".");2==o.length&&(t=t[o[0]],e=o[1]),t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}}(p=t.createElement("script")).type="text/javascript",p.crossOrigin="anonymous",p.async=!0,p.src=s.api_host.replace(".i.posthog.com","-assets.i.posthog.com")+"/static/array.js",(r=t.getElementsByTagName("script")[0]).parentNode.insertBefore(p,r);var u=e;for(void 0!==a?u=e[a]=[]:a="posthog",u.people=u.people||[],u.toString=function(t){var e="posthog";return"posthog"!==a&&(e+="."+a),t||(e+=" (stub)"),e},u.people.toString=function(){return u.toString(1)+".people (stub)"},o="init capture register register_once register_for_session unregister unregister_for_session getFeatureFlag getFeatureFlagPayload isFeatureEnabled reloadFeatureFlags updateEarlyAccessFeatureEnrollment getEarlyAccessFeatures on onFeatureFlags onSessionId getSurveys getActiveMatchingSurveys renderSurvey canRenderSurvey getNextSurveyStep identify setPersonProperties group resetGroups setPersonPropertiesForFlags resetPersonPropertiesForFlags setGroupPropertiesForFlags resetGroupPropertiesForFlags reset get_distinct_id getGroups get_session_id get_session_replay_url alias set_config startSessionRecording stopSessionRecording sessionRecordingStarted captureException loadToolbar get_property getSessionProperty createPersonProfile opt_in_capturing opt_out_capturing has_opted_in_capturing has_opted_out_capturing clear_opt_in_out_capturing debug".split(" "),n=0;n<o.length;n++)g(u,o[n]);e._i.push([i,s,a])},e.__SV=1)}(document,window.posthog||[]);
       posthog.init('phc_mVacbe8Xydu0UZlh4bNw5EGisvzyRcpqXEEuEEp5lOY',{api_host:'https://eu.i.posthog.com', person_profiles: 'identified_only' // or 'always' to create profiles for anonymous users as well
         })
     </script>
-navigation:
-  header: true
-  company: Fulldev UI
-  buttons:
+
+banner:
+  text: 'Introducing v0.6: layouts & pagebuilding 🎉'
+
+header:
+  search: true
+  logo:
+    text: Fulldev UI
+  links:
     - text: Docs
-      href: /overview/introduction
+      href: /docs/
     - text: Components
-      href: /typography/heading
+      href: /docs/components/badge/
     - text: Blocks
-      href: /blocks/banner
-    - showcase
-    - href: https://github.com/fulldotdev/ui
-      target: _blank
-      icon: brand-github
-      variant: secondary
-    - href: https://discord.gg/vXZqMbadm8
-      target: _blank
-      icon: brand-discord
-      variant: secondary
-  menu:
+      href: /docs/blocks/banner/
+    - text: Showcase
+      href: /showcase/
+  socials:
+    - https://github.com/fulldotdev/ui
+    - https://discord.gg/vXZqMbadm8
+
+sidebar:
+  menus:
     - heading: Get Started
-      buttons:
-        - overview/introduction
-        - overview/installation
-        - overview/theming
-        - overview/frameworks
-        - overview/components
-        - overview/content-collections
-    - heading: Typography
-      buttons:
-        - typography/heading
-        - typography/label
-        - typography/link
-        - typography/list
-        - typography/text
-    - heading: Base
-      buttons:
-        - base/badge
-        - base/button
-        - base/card
-        - base/checkbox
-        - base/icon
-        - base/input
-        - base/rating
-        - base/section
-        - base/select
-        - base/table
-        - base/textarea
-        - base/theme-select
-        - base/image
-    - heading: Blocks
-      buttons:
-        - blocks/banner
-        - blocks/colleagues
-        - blocks/contact
-        - blocks/content
-        - blocks/cta
-        - blocks/features
-        - blocks/hero
-        - blocks/intro
-        - blocks/posts
-        - blocks/reviews
-    - heading: Schemas
-      buttons:
-        - schemas/page
-        - schemas/preset
-    - heading: More
-      buttons:
-        - showcase
-        - text: Changelog
-          href: https://github.com/fulldotdev/ui/releases
+      links:
+        - text: Introduction
+          href: /docs/
+        - text: Installation
+          href: /docs/installation/
+        - text: Customization
+          href: /docs/customization/
+        - text: Frameworks
+          href: /docs/frameworks/
+        - text: Components
+          href: /docs/components/
+        - text: Collections
+          href: /docs/collections/
+
+footer:
+  logo:
+    text: Fulldev UI
+  menus:
+    - heading: Docs
+      links:
+        - text: Docs
+          href: /docs/
+        - text: Components
+          href: /docs/components/badge/
+        - text: Blocks
+          href: /docs/blocks/banner/
+        - text: Showcase
+          href: /showcase/

package/src/content/pages/blocks/_categories.mdx

@@ -1,6 +1,4 @@
 ---
-presets: [docs, blocks]
-
 title: Categories
 ---
 

package/src/content/pages/blocks/_footer.mdx

@@ -1,6 +1,4 @@
 ---
-presets: [docs, blocks]
-
 title: Footer
 ---
 

package/src/content/pages/blocks/_header.mdx

@@ -1,6 +1,4 @@
 ---
-presets: [docs, blocks]
-
 title: Header
 ---
 
@@ -151,7 +149,6 @@ import Header from 'fulldev-ui/components/Header.astro'
     },
   ]}
   position="relative"
-  color="brand"
 />
 ```
 
@@ -182,6 +179,5 @@ import Header from 'fulldev-ui/components/Header.astro'
     },
   ]}
   position="relative"
-  color="brand"
 />
 ```

package/src/content/pages/blocks/_jobs.mdx

@@ -1,6 +1,4 @@
 ---
-presets: [docs, blocks]
-
 title: Jobs
 ---
 

package/src/content/pages/blocks/_prices.mdx

@@ -1,6 +1,4 @@
 ---
-presets: [docs, blocks]
-
 title: Prices
 ---
 

package/src/content/pages/blocks/_product.mdx

@@ -1,6 +1,4 @@
 ---
-presets: [docs, blocks]
-
 title: Product
 ---
 

package/src/content/pages/blocks/_products.mdx

@@ -1,6 +1,4 @@
 ---
-presets: [docs, blocks]
-
 title: Products
 ---
 

package/src/content/pages/blocks/_stats.mdx

@@ -1,6 +1,4 @@
 ---
-presets: [docs, blocks]
-
 title: Stats
 ---
 

package/src/content/pages/blocks/banner.mdx

@@ -1,6 +1,4 @@
 ---
-presets: [docs, blocks]
-
 title: Banner
 ---
 

package/src/content/pages/blocks/colleagues.mdx

@@ -1,6 +1,4 @@
 ---
-presets: [docs, blocks]
-
 title: Colleagues
 ---
 
@@ -10,7 +8,6 @@ import Colleagues from 'fulldev-ui/blocks/Colleagues.astro'
 ---
 
 <Colleagues
-  align="start"
   heading="Meet the team"
   text="Our team is made up of experienced professionals who are dedicated to helping you achieve your goals."
   panel

package/src/content/pages/blocks/contact.mdx

@@ -1,6 +1,4 @@
 ---
-presets: [docs, blocks]
-
 title: Contact
 ---