fulldev-ui 0.4.28 → 0.5.0-beta.0

package/src/components/Stack.astro

@@ -1,36 +0,0 @@
----
-import type { HTMLTag, Polymorphic } from 'astro/types'
-import Root from 'fulldev-ui/components/Root.astro'
-
-type Props<As extends HTMLTag = 'div'> = Polymorphic<{ as: As }> & {
-  color?: 'base' | 'brand'
-  size?: 'sm' | 'md' | 'lg'
-}
-
-const { ...rest } = Astro.props
----
-
-<Root
-  class:list="stack"
-  {...rest}
->
-  <slot />
-</Root>
-
-<style is:global lang="scss">
-  @layer fulldev {
-    .stack {
-      display: grid;
-      position: relative;
-      grid-template-columns: 1fr;
-      align-items: flex-start;
-      gap: var(--space-6);
-      width: 100%;
-
-      @media (min-width: 1024px) {
-        grid-auto-columns: 1fr;
-        grid-auto-flow: column;
-      }
-    }
-  }
-</style>

package/src/components/Wrap.astro

@@ -1,42 +0,0 @@
----
-import type { HTMLTag, Polymorphic } from 'astro/types'
-import Root from 'fulldev-ui/components/Root.astro'
-
-type Props<As extends HTMLTag = 'div'> = Polymorphic<{ as: As }> & {
-  align?: 'start' | 'center' | 'end'
-}
-
-const { align = 'center', ...rest } = Astro.props
----
-
-<Root
-  class:list="wrap"
-  {align}
-  {...rest}
->
-  <slot />
-</Root>
-
-<style is:global lang="scss">
-  @layer fulldev {
-    .wrap {
-      display: flex;
-      flex-wrap: wrap;
-      justify-content: stretch;
-      gap: var(--space-2);
-
-      &.align-start {
-        align-items: flex-start;
-        text-align: left;
-      }
-
-      &.align-center {
-        align-items: center;
-      }
-
-      &.align-end {
-        align-items: flex-end;
-      }
-    }
-  }
-</style>

package/src/components/docs/NavigationButtons.astro

@@ -1,59 +0,0 @@
----
-import { getCollection } from 'astro:content'
-import Button from 'fulldev-ui/components/Button.astro'
-import Section from '../Section.astro'
-import Spread from '../Spread.astro'
-
-const { sidebar = [] } = Astro.props
-
-const allPages = await getCollection('pages')
-const pages = []
-
-for (const item of sidebar as any) {
-  if (item.links) pages.push(...item.links)
-  if (item.folder) {
-    const folderPages = allPages.filter(
-      (page: any) =>
-        page.slug.startsWith(item.folder) && !page.slug.endsWith(item.folder)
-    )
-    pages.push(
-      ...folderPages.map((page: any) => ({
-        href: `/${page.slug}`,
-        text: page.data.title,
-      }))
-    )
-  }
-}
-
-const withoutLeadingOrTrailingSlashes = (path: string) =>
-  path.replace(/^\/+|\/+$/g, '')
-
-const currentIndex = pages.findIndex(
-  (page: any) =>
-    withoutLeadingOrTrailingSlashes(page?.href) ===
-    withoutLeadingOrTrailingSlashes(Astro.url.pathname)
-)
-
-const prevPage = pages[currentIndex - 1]
-const nextPage = pages[currentIndex + 1]
----
-
-{
-  sidebar && sidebar.length > 0 && (
-    <Section>
-      <Spread>
-        <Button
-          href={prevPage?.href}
-          variant="secondary"
-          text={prevPage ? `← ${prevPage.text}` : undefined}
-        />
-        <Button
-          href={nextPage?.href}
-          variant="secondary"
-          text={nextPage ? `${nextPage.text} →` : undefined}
-          style={{ marginLeft: 'auto' }}
-        />
-      </Spread>
-    </Section>
-  )
-}

package/src/components/experimental/Channel.astro

@@ -1,74 +0,0 @@
----
-import type { HTMLTag, Polymorphic } from 'astro/types'
-import Button from 'fulldev-ui/components/Button.astro'
-import Column from 'fulldev-ui/components/Column.astro'
-import Heading from 'fulldev-ui/components/Heading.astro'
-import Text from 'fulldev-ui/components/Text.astro'
-import Root from '../Root.astro'
-
-type Props<As extends HTMLTag = 'div'> = Polymorphic<{ as: As }> & {
-  if?: any
-  size?: 'sm' | 'md' | 'lg'
-  color?: 'base' | 'brand'
-  variant?: 'primary' | 'secondary' | 'tertiary'
-  structure?: 'row' | 'column'
-  level?: 1 | 2 | 3 | 4 | 5 | 6
-  heading?: string
-  text?: string
-  icon?: string
-  href?: string
-  target?: string
-}
-
-const {
-  variant = 'secondary',
-  structure = 'row',
-  color = 'brand',
-  level = 5,
-  heading,
-  target,
-  text,
-  icon,
-  href,
-  ...rest
-} = Astro.props
----
-
-<Root
-  class:list={'channel'}
-  {structure}
-  {...rest}
->
-  <Button
-    {variant}
-    {color}
-    {href}
-    {target}
-    {icon}
-  />
-  <Column>
-    <Heading
-      {level}
-      set:html={heading}
-    />
-    <Text set:html={text} />
-  </Column>
-</Root>
-
-<style>
-  .channel {
-    gap: var(--space-4);
-
-    * {
-      margin: 0;
-    }
-
-    .column {
-      gap: var(--space-1);
-
-      * {
-        margin: 0;
-      }
-    }
-  }
-</style>

package/src/components/experimental/Price.astro

@@ -1,40 +0,0 @@
----
-import type { HTMLTag, Polymorphic } from 'astro/types'
-import Root from 'fulldev-ui/components/Root.astro'
-
-type Props<As extends HTMLTag = 'p'> = Polymorphic<{ as: As }> & {
-  size?: 'sm' | 'md' | 'lg'
-  color?: 'base' | 'brand'
-  contrast?: boolean
-  value?: number
-}
-
-const { as = 'p', value, ...rest } = Astro.props
----
-
-{
-  value && (
-    <Root
-      if={value}
-      class:list="price"
-      {as}
-      {...rest}
-    >
-      €{value?.toFixed(2).replace('.', ',')}
-    </Root>
-  )
-}
-
-<style is:global lang="scss">
-  @layer fulldev {
-    .price {
-      margin: 0;
-      max-width: calc(var(--space-4) * 44);
-      color: var(--color-12);
-      font-weight: var(--font-weight);
-      font-size: var(--text-5);
-      line-height: 1.25;
-      font-family: var(--font-family);
-    }
-  }
-</style>

package/src/content/pages/_changelog.mdx

@@ -1,10 +0,0 @@
----
-_layout: PostLayout
-settings: components
-title: Changelog
-description: What's new in Fulldev UI
----
-
-import ChangeLog from '../../../CHANGELOG.md'
-
-<ChangeLog />

package/src/content/pages/_segment/footer.mdx

@@ -1,244 +0,0 @@
----
-_layout: ComponentLayout
-settings: components
-
-title: Footer
----
-
-# Footer
-
-import PropsTable from 'fulldev-ui/components/docs/PropsTable.astro'
-
-```astro live
----
-import Footer from 'fulldev-ui/components/Footer.astro'
----
-
-<Footer
-  heading="Fulldev UI"
-  text="Rapidly build content-driven websites."
-  align="start"
-  size="sm"
-  columns={[
-    {
-      heading: 'Pages',
-      links: [
-        { href: '/overview/introduction', text: 'Docs' },
-        { href: '/typography/heading', text: 'Components' },
-        { href: '/blocks', text: 'Blocks' },
-      ],
-    },
-  ]}
-/>
-```
-
-## Props
-
-<PropsTable />
-
-## Examples
-
-```astro live
----
-import Footer from 'fulldev-ui/components/Footer.astro'
----
-
-<Footer
-  heading="Fulldev UI"
-  text="Rapidly build content-driven websites."
-  align="start"
-  size="sm"
-  columns={[
-    {
-      heading: 'Pages',
-      links: [
-        { href: '/overview/introduction', text: 'Docs' },
-        { href: '/typography/heading', text: 'Components' },
-        { href: '/blocks', text: 'Blocks' },
-      ],
-    },
-    {
-      heading: 'Socials',
-      links: [
-        { href: '/x', text: 'X' },
-        { href: '/github', text: 'GitHub' },
-        { href: '/discord', text: 'Discord' },
-      ],
-    },
-  ]}
-/>
-
-<Footer
-  heading="Fulldev UI"
-  text="Rapidly build content-driven websites."
-  align="start"
-  size="sm"
-  structure="spread"
-  columns={[
-    {
-      heading: 'Links',
-      links: [
-        { href: '/overview/introduction', text: 'Docs' },
-        { href: '/components', text: 'Components' },
-        { href: '/discord', text: 'Discord' },
-      ],
-    },
-  ]}
-/>
-
-<Footer
-  heading="Fulldev UI"
-  text="Rapidly build content-driven websites."
-  align="start"
-  size="md"
-  structure="spread"
-  columns={[
-    {
-      heading: 'Links',
-      links: [
-        { href: '/overview/introduction', text: 'Docs' },
-        { href: '/components', text: 'Components' },
-        { href: '/discord', text: 'Discord' },
-      ],
-    },
-  ]}
-/>
-
-<Footer
-  heading="Fulldev UI"
-  text="Rapidly build content-driven websites."
-  align="start"
-  size="lg"
-  structure="spread"
-  columns={[
-    {
-      heading: 'Links',
-      links: [
-        { href: '/overview/introduction', text: 'Docs' },
-        { href: '/components', text: 'Components' },
-        { href: '/discord', text: 'Discord' },
-      ],
-    },
-  ]}
-/>
-```
-
-```astro live
----
-import Footer from 'fulldev-ui/components/Footer.astro'
----
-
-<Footer
-  variant="ghost"
-  structure="spread"
-  align="start"
-  heading="Fulldev UI"
-  text="Rapidly build content-driven websites."
-  columns={[
-    {
-      heading: 'Links',
-      links: [
-        { href: '/overview/introduction', text: 'Docs' },
-        { href: '/components', text: 'Components' },
-        { href: '/discord', text: 'Discord' },
-      ],
-    },
-  ]}
-/>
-
-<Footer
-  variant="subtle"
-  structure="spread"
-  align="start"
-  heading="Fulldev UI"
-  text="Rapidly build content-driven websites."
-  columns={[
-    {
-      heading: 'Links',
-      links: [
-        { href: '/overview/introduction', text: 'Docs' },
-        { href: '/components', text: 'Components' },
-        { href: '/discord', text: 'Discord' },
-      ],
-    },
-  ]}
-/>
-
-<Footer
-  variant="soft"
-  structure="spread"
-  align="start"
-  heading="Fulldev UI"
-  text="Rapidly build content-driven websites."
-  columns={[
-    {
-      heading: 'Links',
-      links: [
-        { href: '/overview/introduction', text: 'Docs' },
-        { href: '/components', text: 'Components' },
-        { href: '/discord', text: 'Discord' },
-      ],
-    },
-  ]}
-/>
-
-<Footer
-  variant="surface"
-  structure="spread"
-  align="start"
-  heading="Fulldev UI"
-  text="Rapidly build content-driven websites."
-  columns={[
-    {
-      heading: 'Links',
-      links: [
-        { href: '/overview/introduction', text: 'Docs' },
-        { href: '/components', text: 'Components' },
-        { href: '/discord', text: 'Discord' },
-      ],
-    },
-  ]}
-/>
-```
-
-```astro live
----
-import Footer from 'fulldev-ui/components/Footer.astro'
----
-
-<Footer
-  frame="fill"
-  structure="spread"
-  align="start"
-  heading="Fulldev UI"
-  text="Rapidly build content-driven websites."
-  columns={[
-    {
-      heading: 'Links',
-      links: [
-        { href: '/overview/introduction', text: 'Docs' },
-        { href: '/components', text: 'Components' },
-        { href: '/discord', text: 'Discord' },
-      ],
-    },
-  ]}
-/>
-
-<Footer
-  frame="panel"
-  structure="spread"
-  align="start"
-  heading="Fulldev UI"
-  text="Rapidly build content-driven websites."
-  columns={[
-    {
-      heading: 'Links',
-      links: [
-        { href: '/overview/introduction', text: 'Docs' },
-        { href: '/components', text: 'Components' },
-        { href: '/discord', text: 'Discord' },
-      ],
-    },
-  ]}
-/>
-```

package/src/content/pages/_segment/header.mdx

@@ -1,210 +0,0 @@
----
-_layout: ComponentLayout
-settings: components
-
-title: Header
----
-
-# Header
-
-import PropsTable from 'fulldev-ui/components/docs/PropsTable.astro'
-
-```astro live
----
-import Header from 'fulldev-ui/components/Header.astro'
----
-
-<Header
-  heading="Fulldev UI"
-  buttons={[
-    {
-      variant: 'ghost',
-      title: 'X / Twitter',
-      icon: 'brand-x',
-      href: 'https://x.com/silveltm',
-      target: '_blank',
-      contrast: true,
-    },
-  ]}
-  frame="fill"
-  position="relative"
-/>
-```
-
-## Props
-
-<PropsTable />
-
-## Examples
-
-```astro live
----
-import Header from 'fulldev-ui/components/Header.astro'
----
-
-<Header
-  heading="Fulldev UI"
-  buttons={[
-    {
-      variant: 'ghost',
-      title: 'X / Twitter',
-      icon: 'brand-x',
-      href: 'https://x.com/silveltm',
-      target: '_blank',
-      contrast: true,
-    },
-  ]}
-  frame="fill"
-  position="relative"
-/>
-<Header
-  heading="Fulldev UI"
-  buttons={[
-    {
-      variant: 'ghost',
-      title: 'X / Twitter',
-      icon: 'brand-x',
-      href: 'https://x.com/silveltm',
-      target: '_blank',
-      contrast: true,
-    },
-    {
-      text: 'Docs',
-      href: '/overview/introduction/',
-      contrast: true,
-    },
-  ]}
-  frame="fill"
-  position="relative"
-/>
-
-<Header
-  heading="Fulldev UI"
-  buttons={[
-    {
-      variant: 'ghost',
-      title: 'X / Twitter',
-      icon: 'brand-x',
-      href: 'https://x.com/silveltm',
-      target: '_blank',
-      contrast: true,
-    },
-    {
-      text: 'Docs',
-      href: '/overview/introduction/',
-      contrast: true,
-    },
-  ]}
-  frame="panel"
-  position="relative"
-/>
-```
-
-```astro live
----
-import Header from 'fulldev-ui/components/Header.astro'
----
-
-<Header
-  heading="Fulldev UI"
-  size="sm"
-  position="relative"
-  buttons={[
-    {
-      variant: 'ghost',
-      title: 'X / Twitter',
-      icon: 'brand-x',
-      href: 'https://x.com/silveltm',
-      target: '_blank',
-      contrast: true,
-    },
-    {
-      text: 'Docs',
-      href: '/overview/introduction/',
-      contrast: true,
-    },
-  ]}
-/>
-
-<Header
-  heading="Fulldev UI"
-  size="md"
-  position="relative"
-  buttons={[
-    {
-      variant: 'ghost',
-      title: 'X / Twitter',
-      icon: 'brand-x',
-      href: 'https://x.com/silveltm',
-      target: '_blank',
-      contrast: true,
-    },
-    {
-      text: 'Docs',
-      href: '/overview/introduction/',
-      contrast: true,
-    },
-  ]}
-/>
-
-<Header
-  heading="Fulldev UI"
-  size="lg"
-  position="relative"
-  buttons={[
-    {
-      variant: 'ghost',
-      title: 'X / Twitter',
-      icon: 'brand-x',
-      href: 'https://x.com/silveltm',
-      target: '_blank',
-      contrast: true,
-    },
-    {
-      text: 'Docs',
-      href: '/overview/introduction/',
-      contrast: true,
-    },
-  ]}
-/>
-```
-
-```astro live
----
-import Header from 'fulldev-ui/components/Header.astro'
----
-
-<Header
-  heading="Fulldev UI"
-  buttons={[
-    {
-      variant: 'ghost',
-      title: 'X / Twitter',
-      icon: 'brand-x',
-      href: 'https://x.com/silveltm',
-      target: '_blank',
-      contrast: true,
-    },
-  ]}
-  frame="fill"
-  position="relative"
-  color="base"
-/>
-
-<Header
-  heading="Fulldev UI"
-  buttons={[
-    {
-      variant: 'ghost',
-      title: 'X / Twitter',
-      icon: 'brand-x',
-      href: 'https://x.com/silveltm',
-      target: '_blank',
-      contrast: true,
-    },
-  ]}
-  frame="fill"
-  position="relative"
-  color="brand"
-/>
-```