@eslamdevui/ui 3.2.0 → 3.2.1

package/.nuxt/ui/footer.ts

@@ -0,0 +1,11 @@
+export default {
+  "slots": {
+    "root": "",
+    "top": "py-8 lg:py-12",
+    "bottom": "py-8 lg:py-12",
+    "container": "py-8 lg:py-4 lg:flex lg:items-center lg:justify-between lg:gap-x-3",
+    "left": "flex items-center justify-center lg:justify-start lg:flex-1 gap-x-1.5 mt-3 lg:mt-0 lg:order-1",
+    "center": "mt-3 lg:mt-0 lg:order-2 flex items-center justify-center",
+    "right": "lg:flex-1 flex items-center justify-center lg:justify-end gap-x-1.5 lg:order-3"
+  }
+}

package/.nuxt/ui/header.ts

@@ -0,0 +1,30 @@
+const toggleSide = [
+  "left",
+  "right"
+] as const
+
+export default {
+  "slots": {
+    "root": "bg-default/75 backdrop-blur border-b border-default h-(--ui-header-height) sticky top-0 z-50",
+    "container": "flex items-center justify-between gap-3 h-full",
+    "left": "lg:flex-1 flex items-center gap-1.5",
+    "center": "hidden lg:flex",
+    "right": "flex items-center justify-end lg:flex-1 gap-1.5",
+    "title": "shrink-0 font-bold text-xl text-highlighted flex items-end gap-1.5",
+    "toggle": "lg:hidden",
+    "content": "lg:hidden",
+    "overlay": "lg:hidden",
+    "header": "px-4 sm:px-6 h-(--ui-header-height) shrink-0 flex items-center justify-between gap-3",
+    "body": "p-4 sm:p-6 overflow-y-auto"
+  },
+  "variants": {
+    "toggleSide": {
+      "left": {
+        "toggle": "-ms-1.5"
+      },
+      "right": {
+        "toggle": "-me-1.5"
+      }
+    }
+  }
+}

package/.nuxt/ui/index.ts

@@ -1,16 +1,23 @@
 export { default as accordion } from './accordion'
 export { default as alert } from './alert'
+export { default as authForm } from './auth-form'
 export { default as avatar } from './avatar'
 export { default as avatarGroup } from './avatar-group'
 export { default as badge } from './badge'
+export { default as banner } from './banner'
+export { default as blogPost } from './blog-post'
+export { default as blogPosts } from './blog-posts'
 export { default as breadcrumb } from './breadcrumb'
 export { default as button } from './button'
 export { default as buttonGroup } from './button-group'
 export { default as calendar } from './calendar'
 export { default as card } from './card'
 export { default as carousel } from './carousel'
+export { default as changelogVersion } from './changelog-version'
+export { default as changelogVersions } from './changelog-versions'
 export { default as chatMessage } from './chat-message'
 export { default as chatMessages } from './chat-messages'
+export { default as chatPalette } from './chat-palette'
 export { default as chatPrompt } from './chat-prompt'
 export { default as chatPromptSubmit } from './chat-prompt-submit'
 export { default as checkbox } from './checkbox'
@@ -37,21 +44,45 @@ export { default as dashboardSidebarCollapse } from './dashboard-sidebar-collaps
 export { default as dashboardSidebarToggle } from './dashboard-sidebar-toggle'
 export { default as drawer } from './drawer'
 export { default as dropdownMenu } from './dropdown-menu'
+export { default as error } from './error'
+export { default as footer } from './footer'
+export { default as footerColumns } from './footer-columns'
 export { default as form } from './form'
 export { default as formField } from './form-field'
+export { default as header } from './header'
 export { default as input } from './input'
 export { default as inputMenu } from './input-menu'
 export { default as inputNumber } from './input-number'
 export { default as inputTags } from './input-tags'
 export { default as kbd } from './kbd'
 export { default as link } from './link'
+export { default as main } from './main'
 export { default as modal } from './modal'
 export { default as navigationMenu } from './navigation-menu'
+export { default as page } from './page'
+export { default as pageAccordion } from './page-accordion'
+export { default as pageAnchors } from './page-anchors'
+export { default as pageAside } from './page-aside'
+export { default as pageBody } from './page-body'
+export { default as pageCard } from './page-card'
+export { default as pageColumns } from './page-columns'
+export { default as pageCta } from './page-cta'
+export { default as pageFeature } from './page-feature'
+export { default as pageGrid } from './page-grid'
+export { default as pageHeader } from './page-header'
+export { default as pageHero } from './page-hero'
+export { default as pageLinks } from './page-links'
+export { default as pageList } from './page-list'
+export { default as pageLogos } from './page-logos'
+export { default as pageMarquee } from './page-marquee'
+export { default as pageSection } from './page-section'
 export { default as pagination } from './pagination'
 export { default as pinInput } from './pin-input'
 export { default as popover } from './popover'
+export { default as pricingPlan } from './pricing-plan'
+export { default as pricingPlans } from './pricing-plans'
+export { default as pricingTable } from './pricing-table'
 export { default as progress } from './progress'
-export { default as prose } from './prose'
 export { default as radioGroup } from './radio-group'
 export { default as select } from './select'
 export { default as selectMenu } from './select-menu'
@@ -68,4 +99,51 @@ export { default as timeline } from './timeline'
 export { default as toast } from './toast'
 export { default as toaster } from './toaster'
 export { default as tooltip } from './tooltip'
-export { default as tree } from './tree'
+export { default as tree } from './tree'
+export { default as user } from './user'
+export { default as contentNavigation } from './content/content-navigation'
+export { default as contentSearch } from './content/content-search'
+export { default as contentSearchButton } from './content/content-search-button'
+export { default as contentSurround } from './content/content-surround'
+export { default as contentToc } from './content/content-toc'
+export { default as a } from './prose/a'
+export { default as accordion } from './prose/accordion'
+export { default as accordionItem } from './prose/accordion-item'
+export { default as badge } from './prose/badge'
+export { default as blockquote } from './prose/blockquote'
+export { default as callout } from './prose/callout'
+export { default as card } from './prose/card'
+export { default as cardGroup } from './prose/card-group'
+export { default as code } from './prose/code'
+export { default as codeCollapse } from './prose/code-collapse'
+export { default as codeGroup } from './prose/code-group'
+export { default as codeIcon } from './prose/code-icon'
+export { default as codePreview } from './prose/code-preview'
+export { default as codeTree } from './prose/code-tree'
+export { default as collapsible } from './prose/collapsible'
+export { default as em } from './prose/em'
+export { default as field } from './prose/field'
+export { default as fieldGroup } from './prose/field-group'
+export { default as h1 } from './prose/h1'
+export { default as h2 } from './prose/h2'
+export { default as h3 } from './prose/h3'
+export { default as h4 } from './prose/h4'
+export { default as hr } from './prose/hr'
+export { default as icon } from './prose/icon'
+export { default as img } from './prose/img'
+export { default as kbd } from './prose/kbd'
+export { default as li } from './prose/li'
+export { default as ol } from './prose/ol'
+export { default as p } from './prose/p'
+export { default as pre } from './prose/pre'
+export { default as steps } from './prose/steps'
+export { default as strong } from './prose/strong'
+export { default as table } from './prose/table'
+export { default as tabs } from './prose/tabs'
+export { default as tabsItem } from './prose/tabs-item'
+export { default as tbody } from './prose/tbody'
+export { default as td } from './prose/td'
+export { default as th } from './prose/th'
+export { default as thead } from './prose/thead'
+export { default as tr } from './prose/tr'
+export { default as ul } from './prose/ul'

package/.nuxt/ui/input-menu.ts

@@ -1,3 +1,8 @@
+const buttonGroup = [
+  "horizontal",
+  "vertical"
+] as const
+
 const size = [
   "xs",
   "sm",
@@ -24,6 +29,10 @@ const color = [
   "neutral"
 ] as const
 
+const type = [
+  "file"
+] as const
+
 export default {
   "slots": {
     "root": "relative inline-flex items-center",

package/.nuxt/ui/input-number.ts

@@ -1,3 +1,8 @@
+const buttonGroup = [
+  "horizontal",
+  "vertical"
+] as const
+
 const color = [
   "primary",
   "secondary",

package/.nuxt/ui/input-tags.ts

@@ -1,3 +1,8 @@
+const buttonGroup = [
+  "horizontal",
+  "vertical"
+] as const
+
 const size = [
   "xs",
   "sm",
@@ -24,6 +29,10 @@ const color = [
   "neutral"
 ] as const
 
+const type = [
+  "file"
+] as const
+
 export default {
   "slots": {
     "root": [

package/.nuxt/ui/input.ts

@@ -1,3 +1,8 @@
+const buttonGroup = [
+  "horizontal",
+  "vertical"
+] as const
+
 const size = [
   "xs",
   "sm",
@@ -24,6 +29,10 @@ const color = [
   "neutral"
 ] as const
 
+const type = [
+  "file"
+] as const
+
 export default {
   "slots": {
     "root": "relative inline-flex items-center",

package/.nuxt/ui/main.ts

@@ -0,0 +1,3 @@
+export default {
+  "base": "min-h-[calc(100vh-var(--ui-header-height))]"
+}

package/.nuxt/ui/page-accordion.ts

@@ -0,0 +1,7 @@
+export default {
+  "slots": {
+    "base": "",
+    "trigger": "text-base",
+    "body": "text-base text-muted"
+  }
+}

package/.nuxt/ui/page-anchors.ts

@@ -0,0 +1,30 @@
+export default {
+  "slots": {
+    "root": "",
+    "list": "",
+    "item": "relative",
+    "link": "group text-sm flex items-center gap-1.5 py-1 focus-visible:outline-primary",
+    "linkLeading": "rounded-md p-1 inline-flex ring-inset ring",
+    "linkLeadingIcon": "size-4 shrink-0",
+    "linkLabel": "truncate",
+    "linkLabelExternalIcon": "size-3 absolute top-0 text-dimmed"
+  },
+  "variants": {
+    "active": {
+      "true": {
+        "link": "text-primary font-semibold",
+        "linkLeading": "bg-primary ring-primary text-inverted"
+      },
+      "false": {
+        "link": [
+          "text-muted hover:text-default font-medium",
+          "transition-colors"
+        ],
+        "linkLeading": [
+          "bg-elevated/50 ring-accented text-dimmed group-hover:bg-primary group-hover:ring-primary group-hover:text-inverted",
+          "transition"
+        ]
+      }
+    }
+  }
+}

package/.nuxt/ui/page-aside.ts

@@ -0,0 +1,10 @@
+export default {
+  "slots": {
+    "root": "hidden overflow-y-auto lg:block lg:max-h-[calc(100vh-var(--ui-header-height))] lg:sticky lg:top-(--ui-header-height) py-8 lg:ps-4 lg:-ms-4 lg:pe-6.5",
+    "container": "relative",
+    "top": "sticky -top-8 -mt-8 pointer-events-none z-[1]",
+    "topHeader": "h-8 bg-default -mx-4 px-4",
+    "topBody": "bg-default relative pointer-events-auto flex flex-col -mx-4 px-4",
+    "topFooter": "h-8 bg-gradient-to-b from-default -mx-4 px-4"
+  }
+}

package/.nuxt/ui/page-body.ts

@@ -0,0 +1,3 @@
+export default {
+  "base": "mt-8 pb-24 space-y-12"
+}

package/.nuxt/ui/page-card.ts

@@ -0,0 +1,276 @@
+const orientation = [
+  "horizontal",
+  "vertical"
+] as const
+
+const variant = [
+  "solid",
+  "outline",
+  "soft",
+  "subtle",
+  "ghost",
+  "naked"
+] as const
+
+const highlightColor = [
+  "primary",
+  "secondary",
+  "success",
+  "info",
+  "warning",
+  "error",
+  "neutral"
+] as const
+
+const spotlightColor = [
+  "primary",
+  "secondary",
+  "success",
+  "info",
+  "warning",
+  "error",
+  "neutral"
+] as const
+
+export default {
+  "slots": {
+    "root": "relative flex rounded-lg",
+    "spotlight": "absolute inset-0 rounded-[inherit] pointer-events-none bg-default/90",
+    "container": "relative flex flex-col flex-1 lg:grid gap-x-8 gap-y-4 p-4 sm:p-6",
+    "wrapper": "flex flex-col flex-1 items-start",
+    "header": "mb-4",
+    "body": "flex-1",
+    "footer": "pt-4 mt-auto",
+    "leading": "inline-flex items-center mb-2.5",
+    "leadingIcon": "size-5 shrink-0 text-primary",
+    "title": "text-base text-pretty font-semibold text-highlighted",
+    "description": "text-[15px] text-pretty"
+  },
+  "variants": {
+    "orientation": {
+      "horizontal": {
+        "container": "lg:grid-cols-2 lg:items-center"
+      },
+      "vertical": {
+        "container": ""
+      }
+    },
+    "reverse": {
+      "true": {
+        "wrapper": "lg:order-last"
+      }
+    },
+    "variant": {
+      "solid": {
+        "root": "bg-inverted text-inverted",
+        "title": "text-inverted",
+        "description": "text-dimmed"
+      },
+      "outline": {
+        "root": "bg-default ring ring-default",
+        "description": "text-muted"
+      },
+      "soft": {
+        "root": "bg-elevated/50",
+        "description": "text-toned"
+      },
+      "subtle": {
+        "root": "bg-elevated/50 ring ring-default",
+        "description": "text-toned"
+      },
+      "ghost": {
+        "description": "text-muted"
+      },
+      "naked": {
+        "container": "p-0 sm:p-0",
+        "description": "text-muted"
+      }
+    },
+    "to": {
+      "true": {
+        "root": "transition"
+      }
+    },
+    "title": {
+      "true": {
+        "description": "mt-1"
+      }
+    },
+    "highlight": {
+      "true": {
+        "root": "ring-2"
+      }
+    },
+    "highlightColor": {
+      "primary": {},
+      "secondary": {},
+      "success": {},
+      "info": {},
+      "warning": {},
+      "error": {},
+      "neutral": {}
+    },
+    "spotlight": {
+      "true": {
+        "root": "[--spotlight-size:400px] before:absolute before:-inset-px before:pointer-events-none before:rounded-[inherit] before:bg-[radial-gradient(var(--spotlight-size)_var(--spotlight-size)_at_calc(var(--spotlight-x,0px))_calc(var(--spotlight-y,0px)),var(--spotlight-color),transparent_70%)]"
+      }
+    },
+    "spotlightColor": {
+      "primary": {},
+      "secondary": {},
+      "success": {},
+      "info": {},
+      "warning": {},
+      "error": {},
+      "neutral": {}
+    }
+  },
+  "compoundVariants": [
+    {
+      "variant": "solid" as typeof variant[number],
+      "to": true,
+      "class": {
+        "root": "hover:bg-inverted/90"
+      }
+    },
+    {
+      "variant": "outline" as typeof variant[number],
+      "to": true,
+      "class": {
+        "root": "hover:bg-elevated/50"
+      }
+    },
+    {
+      "variant": "soft" as typeof variant[number],
+      "to": true,
+      "class": {
+        "root": "hover:bg-elevated"
+      }
+    },
+    {
+      "variant": "subtle" as typeof variant[number],
+      "to": true,
+      "class": {
+        "root": "hover:bg-elevated"
+      }
+    },
+    {
+      "variant": "subtle" as typeof variant[number],
+      "to": true,
+      "highlight": false,
+      "class": {
+        "root": "hover:ring-accented"
+      }
+    },
+    {
+      "variant": "ghost" as typeof variant[number],
+      "to": true,
+      "class": {
+        "root": "hover:bg-elevated/50"
+      }
+    },
+    {
+      "highlightColor": "primary" as typeof highlightColor[number],
+      "highlight": true,
+      "class": {
+        "root": "ring-primary"
+      }
+    },
+    {
+      "highlightColor": "secondary" as typeof highlightColor[number],
+      "highlight": true,
+      "class": {
+        "root": "ring-secondary"
+      }
+    },
+    {
+      "highlightColor": "success" as typeof highlightColor[number],
+      "highlight": true,
+      "class": {
+        "root": "ring-success"
+      }
+    },
+    {
+      "highlightColor": "info" as typeof highlightColor[number],
+      "highlight": true,
+      "class": {
+        "root": "ring-info"
+      }
+    },
+    {
+      "highlightColor": "warning" as typeof highlightColor[number],
+      "highlight": true,
+      "class": {
+        "root": "ring-warning"
+      }
+    },
+    {
+      "highlightColor": "error" as typeof highlightColor[number],
+      "highlight": true,
+      "class": {
+        "root": "ring-error"
+      }
+    },
+    {
+      "highlightColor": "neutral" as typeof highlightColor[number],
+      "highlight": true,
+      "class": {
+        "root": "ring-inverted"
+      }
+    },
+    {
+      "spotlightColor": "primary" as typeof spotlightColor[number],
+      "spotlight": true,
+      "class": {
+        "root": "[--spotlight-color:var(--ui-primary)]"
+      }
+    },
+    {
+      "spotlightColor": "secondary" as typeof spotlightColor[number],
+      "spotlight": true,
+      "class": {
+        "root": "[--spotlight-color:var(--ui-secondary)]"
+      }
+    },
+    {
+      "spotlightColor": "success" as typeof spotlightColor[number],
+      "spotlight": true,
+      "class": {
+        "root": "[--spotlight-color:var(--ui-success)]"
+      }
+    },
+    {
+      "spotlightColor": "info" as typeof spotlightColor[number],
+      "spotlight": true,
+      "class": {
+        "root": "[--spotlight-color:var(--ui-info)]"
+      }
+    },
+    {
+      "spotlightColor": "warning" as typeof spotlightColor[number],
+      "spotlight": true,
+      "class": {
+        "root": "[--spotlight-color:var(--ui-warning)]"
+      }
+    },
+    {
+      "spotlightColor": "error" as typeof spotlightColor[number],
+      "spotlight": true,
+      "class": {
+        "root": "[--spotlight-color:var(--ui-error)]"
+      }
+    },
+    {
+      "spotlightColor": "neutral" as typeof spotlightColor[number],
+      "spotlight": true,
+      "class": {
+        "root": "[--spotlight-color:var(--ui-bg-inverted)]"
+      }
+    }
+  ],
+  "defaultVariants": {
+    "variant": "outline" as typeof variant[number],
+    "highlightColor": "primary" as typeof highlightColor[number],
+    "spotlightColor": "primary" as typeof spotlightColor[number]
+  }
+}

package/.nuxt/ui/page-columns.ts

@@ -0,0 +1,3 @@
+export default {
+  "base": "relative column-1 md:columns-2 lg:columns-3 gap-8 space-y-8 *:break-inside-avoid-column *:will-change-transform"
+}

package/.nuxt/ui/page-cta.ts

@@ -0,0 +1,72 @@
+const orientation = [
+  "horizontal",
+  "vertical"
+] as const
+
+const variant = [
+  "solid",
+  "outline",
+  "soft",
+  "subtle",
+  "naked"
+] as const
+
+export default {
+  "slots": {
+    "root": "relative isolate rounded-xl overflow-hidden",
+    "container": "flex flex-col lg:grid px-6 py-12 sm:px-12 sm:py-24 lg:px-16 lg:py-24 gap-8 sm:gap-16",
+    "wrapper": "",
+    "title": "text-3xl sm:text-4xl text-pretty tracking-tight font-bold text-highlighted",
+    "description": "text-base sm:text-lg text-muted",
+    "links": "mt-8 flex flex-wrap gap-x-6 gap-y-3"
+  },
+  "variants": {
+    "orientation": {
+      "horizontal": {
+        "container": "lg:grid-cols-2 lg:items-center",
+        "description": "text-pretty"
+      },
+      "vertical": {
+        "container": "",
+        "title": "text-center",
+        "description": "text-center text-balance",
+        "links": "justify-center"
+      }
+    },
+    "reverse": {
+      "true": {
+        "wrapper": "lg:order-last"
+      }
+    },
+    "variant": {
+      "solid": {
+        "root": "bg-inverted text-inverted",
+        "title": "text-inverted",
+        "description": "text-dimmed"
+      },
+      "outline": {
+        "root": "bg-default ring ring-default",
+        "description": "text-muted"
+      },
+      "soft": {
+        "root": "bg-elevated/50",
+        "description": "text-toned"
+      },
+      "subtle": {
+        "root": "bg-elevated/50 ring ring-default",
+        "description": "text-toned"
+      },
+      "naked": {
+        "description": "text-muted"
+      }
+    },
+    "title": {
+      "true": {
+        "description": "mt-6"
+      }
+    }
+  },
+  "defaultVariants": {
+    "variant": "outline" as typeof variant[number]
+  }
+}

package/.nuxt/ui/page-feature.ts

@@ -0,0 +1,31 @@
+const orientation = [
+  "horizontal",
+  "vertical"
+] as const
+
+export default {
+  "slots": {
+    "root": "relative",
+    "wrapper": "",
+    "leading": "inline-flex items-center justify-center",
+    "leadingIcon": "size-5 shrink-0 text-primary",
+    "title": "text-base text-pretty font-semibold text-highlighted",
+    "description": "text-[15px] text-pretty text-muted"
+  },
+  "variants": {
+    "orientation": {
+      "horizontal": {
+        "root": "flex items-start gap-2.5",
+        "leading": "p-0.5"
+      },
+      "vertical": {
+        "leading": "mb-2.5"
+      }
+    },
+    "title": {
+      "true": {
+        "description": "mt-1"
+      }
+    }
+  }
+}