opui-css 5.4.3 → 6.0.0-rc.1

package/vue/index.ts

@@ -1,54 +1,175 @@
-export { default as Accordion } from "../components/Accordion/Accordion.vue"
-export { default as Anchor } from "../components/Anchor/Anchor.vue"
-export { default as Avatar } from "../components/Avatar/Avatar.vue"
-export { default as Badge } from "../components/Badge/Badge.vue"
-export { default as Button } from "../components/Button/Button.vue"
-export { default as ButtonGroup } from "../components/ButtonGroup/ButtonGroup.vue"
-export { default as Callout } from "../components/Callout/Callout.vue"
-export { default as Card } from "../components/Card/Card.vue"
-export { default as Checkbox } from "../components/Checkbox/Checkbox.vue"
-export { default as CheckboxInput } from "../components/Checkbox/CheckboxInput.vue"
-export { default as Chip } from "../components/Chip/Chip.vue"
-export { default as ClassicSelect } from "../components/ClassicSelect/ClassicSelect.vue"
-export { default as Description } from "../components/DescriptionList/Description.vue"
-export { default as DescriptionList } from "../components/DescriptionList/DescriptionList.vue"
-export { default as DescriptionListItem } from "../components/DescriptionList/Item.vue"
-export { default as DescriptionListTerm } from "../components/DescriptionList/Term.vue"
-export { default as Dialog } from "../components/Dialog/Dialog.vue"
-export { default as Divider } from "../components/Divider/Divider.vue"
-export { default as Drawer } from "../components/Drawer/Drawer.vue"
-export { default as DrawerFooter } from "../components/Drawer/DrawerFooter.vue"
-export { default as DrawerHeader } from "../components/Drawer/DrawerHeader.vue"
-export { default as FieldDescription } from "../components/FieldDescription/FieldDescription.vue"
-export { default as FieldGroup } from "../components/FieldGroup/FieldGroup.vue"
-export { default as FieldLegend } from "../components/FieldLegend/FieldLegend.vue"
-export { default as FieldSet } from "../components/FieldSet/FieldSet.vue"
-export { default as Form } from "../components/Form/Form.vue"
-export { default as IconButton } from "../components/IconButton/IconButton.vue"
-export { default as List } from "../components/List/List.vue"
-export { default as ListItem } from "../components/ListItem/ListItem.vue"
-export { default as Progress } from "../components/Progress/Progress.vue"
-export { default as Radio } from "../components/Radio/Radio.vue"
-export { default as RadioInput } from "../components/Radio/RadioInput.vue"
-export { default as Range } from "../components/Range/Range.vue"
-export { default as Select } from "../components/Select/Select.vue"
-export { default as Switch } from "../components/Switch/Switch.vue"
-export { default as SwitchInput } from "../components/Switch/SwitchInput.vue"
-export { default as TableBody } from "../components/Table/Body.vue"
-export { default as TableCell } from "../components/Table/Cell.vue"
-export { default as TableColumn } from "../components/Table/Column.vue"
-export { default as TableColumnGroup } from "../components/Table/ColumnGroup.vue"
-export { default as TableHead } from "../components/Table/Head.vue"
-export { default as TableHeaderCell } from "../components/Table/HeaderCell.vue"
-export { default as TableRow } from "../components/Table/Row.vue"
-export { default as Table } from "../components/Table/Table.vue"
-export { default as Tabs } from "../components/Tabs/Tabs.vue"
-export { default as TabsItem } from "../components/Tabs/TabsItem.vue"
-export { default as TabsPanel } from "../components/Tabs/TabsPanel.vue"
-export { default as TabsTab } from "../components/Tabs/TabsTab.vue"
-export { default as Textarea } from "../components/Textarea/Textarea.vue"
-export { default as TextField } from "../components/TextField/TextField.vue"
-export { default as Toast } from "../components/Toast/Toast.vue"
-export { default as ToggleButton } from "../components/ToggleButton/ToggleButton.vue"
-export { default as ToggleGroup } from "../components/ToggleGroup/ToggleGroup.vue"
-export { default as Tooltip } from "../components/Tooltip/Tooltip.vue"
+export { default as Accordion } from "../components/Accordion/Accordion.vue"
+export { default as AccordionActions } from "../components/Accordion/AccordionActions.vue"
+export { default as AccordionContent } from "../components/Accordion/AccordionContent.vue"
+export { default as AccordionSummary } from "../components/Accordion/AccordionSummary.vue"
+export { default as Anchor } from "../components/Anchor/Anchor.vue"
+export { default as AnchorContent } from "../components/Anchor/AnchorContent.vue"
+export { default as Avatar } from "../components/Avatar/Avatar.vue"
+export { default as AvatarGroup } from "../components/Avatar/AvatarGroup.vue"
+export { default as Badge } from "../components/Badge/Badge.vue"
+export { default as Button } from "../components/Button/Button.vue"
+export { default as ButtonGroup } from "../components/ButtonGroup/ButtonGroup.vue"
+export { default as Callout } from "../components/Callout/Callout.vue"
+export { default as CalloutContent } from "../components/Callout/CalloutContent.vue"
+export { default as CalloutIcon } from "../components/Callout/CalloutIcon.vue"
+export { default as Card } from "../components/Card/Card.vue"
+export { default as CardActions } from "../components/Card/CardActions.vue"
+export { default as CardContent } from "../components/Card/CardContent.vue"
+export { default as CardHeader } from "../components/Card/CardHeader.vue"
+export { default as Carousel } from "../components/Carousel/Carousel.vue"
+export { default as Checkbox } from "../components/Checkbox/Checkbox.vue"
+export { default as CheckboxInput } from "../components/Checkbox/CheckboxInput.vue"
+export { default as Chip } from "../components/Chip/Chip.vue"
+export { default as DescriptionList } from "../components/DescriptionList/DescriptionList.vue"
+export { default as DescriptionListDescription } from "../components/DescriptionList/DescriptionListDescription.vue"
+export { default as DescriptionListItem } from "../components/DescriptionList/DescriptionListItem.vue"
+export { default as DescriptionListTerm } from "../components/DescriptionList/DescriptionListTerm.vue"
+export { default as Dialog } from "../components/Dialog/Dialog.vue"
+export { default as DialogContent } from "../components/Dialog/DialogContent.vue"
+export { default as DialogFooter } from "../components/Dialog/DialogFooter.vue"
+export { default as DialogHeader } from "../components/Dialog/DialogHeader.vue"
+export { default as DialogTitle } from "../components/Dialog/DialogTitle.vue"
+export { default as Divider } from "../components/Divider/Divider.vue"
+export { default as Drawer } from "../components/Drawer/Drawer.vue"
+export { default as DrawerContent } from "../components/Drawer/DrawerContent.vue"
+export { default as DrawerFooter } from "../components/Drawer/DrawerFooter.vue"
+export { default as DrawerHeader } from "../components/Drawer/DrawerHeader.vue"
+export { default as DrawerTitle } from "../components/Drawer/DrawerTitle.vue"
+export { default as FieldDescription } from "../components/FieldDescription/FieldDescription.vue"
+export { default as FieldGroup } from "../components/FieldGroup/FieldGroup.vue"
+export { default as FieldLegend } from "../components/FieldLegend/FieldLegend.vue"
+export { default as Fieldset } from "../components/Fieldset/Fieldset.vue"
+export { default as Form } from "../components/Form/Form.vue"
+export { default as List } from "../components/List/List.vue"
+export { default as ListItem } from "../components/ListItem/ListItem.vue"
+export { default as Menu } from "../components/Menu/Menu.vue"
+export { default as Progress } from "../components/Progress/Progress.vue"
+export { default as Radio } from "../components/Radio/Radio.vue"
+export { default as RadioInput } from "../components/Radio/RadioInput.vue"
+export { default as Range } from "../components/Range/Range.vue"
+export { default as Select } from "../components/Select/Select.vue"
+export { default as Switch } from "../components/Switch/Switch.vue"
+export { default as SwitchInput } from "../components/Switch/SwitchInput.vue"
+export { default as Table } from "../components/Table/Table.vue"
+export { default as TableBody } from "../components/Table/TableBody.vue"
+export { default as TableCaption } from "../components/Table/TableCaption.vue"
+export { default as TableCell } from "../components/Table/TableCell.vue"
+export { default as TableColumn } from "../components/Table/TableColumn.vue"
+export { default as TableColumnGroup } from "../components/Table/TableColumnGroup.vue"
+export { default as TableFoot } from "../components/Table/TableFoot.vue"
+export { default as TableHead } from "../components/Table/TableHead.vue"
+export { default as TableHeaderCell } from "../components/Table/TableHeaderCell.vue"
+export { default as TableRow } from "../components/Table/TableRow.vue"
+export { default as Tabs } from "../components/Tabs/Tabs.vue"
+export { default as TabsItem } from "../components/Tabs/TabsItem.vue"
+export { default as TabsLabel } from "../components/Tabs/TabsLabel.vue"
+export { default as TabsPanel } from "../components/Tabs/TabsPanel.vue"
+export { default as Textarea } from "../components/Textarea/Textarea.vue"
+export { default as TextField } from "../components/TextField/TextField.vue"
+export { default as ToggleButton } from "../components/ToggleButton/ToggleButton.vue"
+export { default as ToggleGroup } from "../components/ToggleGroup/ToggleGroup.vue"
+export { default as Tooltip } from "../components/Tooltip/Tooltip.vue"
+export { default as TooltipContent } from "../components/Anchor/AnchorContent.vue"
+export type {
+  AccordionActionsProps,
+  AccordionContentProps,
+  Props as AccordionProps,
+  AccordionSummaryProps,
+} from "../components/Accordion/types.vue-props"
+export type {
+  AnchorContentProps,
+  Props as AnchorProps,
+  AnchorContentProps as TooltipContentProps,
+} from "../components/Anchor/types.vue-props"
+export type {
+  AvatarGroupProps,
+  Props as AvatarProps,
+} from "../components/Avatar/types.vue-props"
+export type { Props as BadgeProps } from "../components/Badge/types.vue-props"
+export type { Props as ButtonProps } from "../components/Button/types.vue-props"
+export type { Props as ButtonGroupProps } from "../components/ButtonGroup/types.vue-props"
+export type {
+  CalloutContentProps,
+  CalloutIconProps,
+  Props as CalloutProps,
+} from "../components/Callout/types.vue-props"
+export type {
+  CardActionsProps,
+  CardContentProps,
+  CardHeaderProps,
+  Props as CardProps,
+} from "../components/Card/types.vue-props"
+export type { Props as CarouselProps } from "../components/Carousel/types.vue-props"
+export type {
+  CheckboxInputProps,
+  Props as CheckboxProps,
+} from "../components/Checkbox/types.vue-props"
+export type { Props as ChipProps } from "../components/Chip/types.vue-props"
+export type {
+  DescriptionListDescriptionProps,
+  DescriptionListItemProps,
+  Props as DescriptionListProps,
+  DescriptionListTermProps,
+} from "../components/DescriptionList/types.vue-props"
+export type {
+  DialogContentProps,
+  DialogFooterProps,
+  DialogHeaderProps,
+  Props as DialogProps,
+  DialogTitleProps,
+} from "../components/Dialog/types.vue-props"
+export type { Props as DividerProps } from "../components/Divider/types.vue-props"
+export type {
+  DrawerContentProps,
+  DrawerFooterProps,
+  DrawerHeaderProps,
+  Props as DrawerProps,
+  DrawerTitleProps,
+} from "../components/Drawer/types.vue-props"
+export type { Props as FieldDescriptionProps } from "../components/FieldDescription/types.vue-props"
+export type { Props as FieldGroupProps } from "../components/FieldGroup/types.vue-props"
+export type { Props as FieldLegendProps } from "../components/FieldLegend/types.vue-props"
+export type { Props as FieldsetProps } from "../components/Fieldset/types.vue-props"
+export type { Props as FormProps } from "../components/Form/types.vue-props"
+export type { Props as ListProps } from "../components/List/types.vue-props"
+export type { Props as ListItemProps } from "../components/ListItem/types.vue-props"
+export type {
+  MenuItem,
+  Props as MenuProps,
+} from "../components/Menu/types.vue-props"
+export type { Props as ProgressProps } from "../components/Progress/types.vue-props"
+export type {
+  RadioInputProps,
+  Props as RadioProps,
+} from "../components/Radio/types.vue-props"
+export type { RangeItem } from "../components/Range/types"
+export type { Props as RangeProps } from "../components/Range/types.vue-props"
+export type { SelectItem } from "../components/Select/types"
+export type { Props as SelectProps } from "../components/Select/types.vue-props"
+export type {
+  SwitchInputProps,
+  Props as SwitchProps,
+} from "../components/Switch/types.vue-props"
+export type {
+  TableBodyProps,
+  TableCaptionProps,
+  TableCellProps,
+  TableColumnGroupProps,
+  TableColumnProps,
+  TableFootProps,
+  TableHeaderCellProps,
+  TableHeadProps,
+  Props as TableProps,
+  TableRowProps,
+} from "../components/Table/types.vue-props"
+export type {
+  TabsItemProps,
+  TabsLabelProps,
+  TabsPanelProps,
+  Props as TabsProps,
+} from "../components/Tabs/types.vue-props"
+export type { Props as TextareaProps } from "../components/Textarea/types.vue-props"
+export type { Props as TextFieldProps } from "../components/TextField/types.vue-props"
+export type { Props as ToggleButtonProps } from "../components/ToggleButton/types.vue-props"
+export type { Props as ToggleGroupProps } from "../components/ToggleGroup/types.vue-props"
+export type { Props as TooltipProps } from "../components/Tooltip/types.vue-props"

package/components/AGENTS.md

@@ -1,247 +0,0 @@
-# UI Component Implementation Guide
-
-This guide defines the standards for implementing reusable Astro UI components in this package (`packages/opui/components/<Name>/<Name>.astro`) based on the documentation specs at `src/docs/components/`. Use it as a reference for maintaining consistency and accessibility across the library.
-
-**CRITICAL INSTRUCTION**: Always use components from this package (imported via the `@opui/astro` alias) and their corresponding CSS from `packages/opui/css/components/` whenever possible. Avoid writing custom CSS if an existing component or utility can achieve the desired result.
-
-## 0. Implementation Checklist
-
-When implementing or updating a component, ensure:
-- [ ] **Title Export**: `export const title = "Component Name"` is present.
-- [ ] **Props Type**: Imported `Props` from `./types.astro` (avoid interfaces).
-- [ ] **Sorting**: Props, Destructuring, and Classes are sorted alphabetically.
-- [ ] **Rest Props**: `...rest` is captured and spread onto the root element.
-- [ ] **Class Management**: Used `class:list` for all class manipulations.
-- [ ] **ID Stability**: Used `Astro.locals.$id` for any internal element linking.
-- [ ] **Accessibility**: ARIA labels, roles, and relationships are correctly handled.
-- [ ] **Slot Strategy**: Named slots are used for structural content (icons, actions).
-
----
-
-## 1. Frontmatter Structure
-
-Every component uses layered type files:
-
-- `types.ts` - shared, framework-agnostic props (component-specific only; no `HTMLAttributes`)
-- `types.astro.ts` - Astro props = base + `HTMLAttributes<element>`
-- `types.d.vue.ts` / `types.svelte.ts` / `types.solid.ts` - framework-specific extensions (for merge parity)
-
-Every component must follow this exact frontmatter layout:
-
-```astro
----
-import type { Props } from "./types.astro"
-
-export const title = "My Component"
-
-const {
-  class: className,
-  disabled,
-  label,
-  size,
-  variant = "outlined",
-  ...rest
-} = Astro.props
----
-```
-
-### Key Rules:
-- **Alphabetical Sorting**: Sort property definitions in `types.ts` and variables in the destructuring statement.
-- **REST Support**: Use `HTMLAttributes` in `types.astro.ts` and `...rest` in destructuring. Do not add `[key: string]: any` to `types.ts` - native attributes belong in the framework type files.
-- **Title Export**: This is mandatory for documentation generation.
-
----
-
-## 2. Component Composition & Tags
-
-### Dynamic Elements (Polymorphism)
-For components that can be different HTML elements (e.g., `Button` as `<a>` or `<button>`), use a dynamic `Tag` variable.
-
-```astro
----
-const { as: Tag = Astro.props.href ? "a" : "button", ...rest } = Astro.props
----
-<Tag {...rest}><slot /></Tag>
-```
-- **Inference**: Default to `"a"` if `href` is present.
-- **Override**: Allow manual override via the `as` prop.
-
-### Styling Inheritance
-Components should often inherit styles from others (e.g., `Dialog` looking like a `Card`). Use conditional classes to apply the inherited base class. All library classes are prefixed with `ui-`.
-
-```astro
-<dialog class:list={["ui-dialog", { "ui-card": variant }, variant && `ui-${variant}`, className]} {...rest}>
-```
-
----
-
-## 3. Class Management
-
-Use `class:list` exclusively. Every library-owned class is prefixed with `ui-`; the public prop API stays unprefixed (`<Button size="small" variant="outlined">`) and the component interpolates the prefix when rendering.
-
-Follow this order for readability:
-1.  **Component Base Class**: The primary CSS class, prefixed (e.g., `"ui-button"`).
-2.  **State Objects**: Boolean flags as quoted prefixed keys (e.g., `{ "ui-disabled": disabled }`).
-3.  **Variant Props**: Interpolate the prefix from the prop value (e.g., `size && \`ui-${size}\``).
-4.  **External Class**: Always include `className` at the end to allow for overrides. Do not prefix `className`.
-
-```astro
-<div
-  class:list={[
-    "ui-chip",
-    {
-      "ui-multiline": isMultiline,
-    },
-    size && `ui-${size}`,
-    variant && `ui-${variant}`,
-    className,
-  ]}
->
-```
-
----
-
-## 4. Slot Patterns
-
-### Default Slots vs Label Props
-For simple text-based components, provide both a `label` prop and a default slot.
-
-```astro
-<div class="ui-component">
-  { (label || Astro.slots.has("default")) && (
-    <span class="ui-text">
-      {label}
-      <slot />
-    </span>
-  )}
-</div>
-```
-
-### Named Slots (Icons & Actions)
-Use named slots for specific functional areas. Check for existence before rendering wrapper tags.
-
-```astro
-<div class="ui-card">
-  {Astro.slots.has("header") && <header><slot name="header" /></header>}
-  <slot />
-  {Astro.slots.has("actions") && <footer class="ui-actions"><slot name="actions" /></footer>}
-</div>
-```
-
----
-
-## 5. Form & Input Patterns
-
-### Label Wrapping
-Most inputs should be wrapped in a `<label>` to provide a larger hit area and built-in accessibility.
-
-```astro
-<label class:list={["ui-field", { "ui-disabled": disabled }]} data-invalid={error || undefined}>
-  <span class="ui-label">{label}</span>
-  <input type="text" {...rest} />
-  {endText && <span class="ui-end-text">{endText}</span>}
-</label>
-```
-
-### End Text & ARIA
-When providing `endText`, use `Astro.locals.$id` to link it to the input via `aria-describedby`.
-
-```astro
----
-const { $id } = Astro.locals
-const helpId = $id("help")
----
-<input aria-describedby={endText ? helpId : undefined} />
-{endText && <span id={helpId}>{endText}</span>}
-```
-
-### Input Attribute Mapping
-Explicitly define and pass through native input attributes in the `Props` type for better IDE support.
-
-```astro
-<input
-  disabled={disabled}
-  name={name}
-  required={required}
-  type={type}
-  value={value}
-  {...rest}
-/>
-```
-
-### Sub-component Decomposition
-For complex inputs (like `Checkbox` with custom visuals), split the component into a public wrapper (`Checkbox.astro`) and a private raw input (`CheckboxInput.astro`) to keep the root element clean.
-
-### Form Structure: FieldSet, FieldLegend, FieldDescription, FieldGroup
-When building forms, follow this nesting order inside a `FieldSet`:
-1. `FieldLegend` - The heading/label for the fieldset
-2. `FieldDescription` - Optional helper text
-3. `FieldGroup` - Wrapper for the actual form controls
-
-**Always wrap form elements in a `FieldGroup`**, never place them directly after `FieldLegend` or `FieldDescription`.
-
-```astro
-<!-- ✅ Correct -->
-<FieldSet>
-  <FieldLegend>Username</FieldLegend>
-  <FieldDescription>Enter your preferred username.</FieldDescription>
-  <FieldGroup>
-    <TextField placeholder="e.g. jdoe" />
-  </FieldGroup>
-</FieldSet>
-
-<!-- ❌ Incorrect - TextField directly after FieldDescription -->
-<FieldSet>
-  <FieldLegend>Username</FieldLegend>
-  <FieldDescription>Enter your preferred username.</FieldDescription>
-  <TextField placeholder="e.g. jdoe" />
-</FieldSet>
-```
-
----
-
-## 6. Identification & Accessibility
-
-### Unique IDs
-Always use `Astro.locals.$id` for IDs. This ensures stability across server and client rendering and prevents ID collisions when multiple instances of the same component are on a page.
-
-```astro
-const { $id } = Astro.locals
-const fieldId = id || $id("input") // Prefer passed ID if available
-```
-
-### Default Icons
-Components like `Callout` or `Toast` should provide default SVG icons within their named slots, while allowing users to override them.
-
-```astro
-<slot name="icon">
-  {severity === "error" && <svg>...</svg>}
-</slot>
-```
-
----
-
-## 7. Data-Driven Components
-
-For repetitive structures (DescriptionLists, Menus, Selects), prefer an `items` prop alongside standard slots.
-
-```astro
-type Item = { label: string; value: any }
-type Props = { items?: Item[] }
-
-<ul>
-  {items.map(item => <li>{item.label}</li>)}
-  <slot /> <!-- Still allow manual entries -->
-</ul>
-```
-
----
-
-## 8. Development Workflow
-
-1.  **Read the Spec**: Open `src/docs/components/[name].astro` to see required HTML and CSS classes. (Component docs live under `src/docs/components/` now; `src/pages/components/` only contains route shells.)
-2.  **Analyze the API**: Check `src/component-api/[name]/` (`Astro.astro` and `HTML.astro`) or `src/component-api/[name]-api.astro` for the documented props.
-3.  **Implement**: Follow the checklist in Section 0.
-4.  **Verify**: Check that your implementation matches the "HTML" preview in the rendered `Example` for the spec page (`/components/[name]`). For framework-specific behaviour, also verify the Astro variant at `/astro/components/[name]`.
-
-

package/components/Accordion/types.d.vue.ts

@@ -1,15 +0,0 @@
-import type { HTMLAttributes, Slot } from "vue"
-import type { Props as BaseProps } from "./types"
-
-export type Props = BaseProps & {
-  class?: HTMLAttributes["class"]
-  name?: string
-  open?: boolean
-}
-
-export type Slots = {
-  actions?: Slot
-  default?: Slot
-  marker?: Slot
-  summary?: Slot
-}

package/components/Accordion/types.solid.ts

@@ -1,6 +0,0 @@
-import type * as Base from "./types"
-import type { JSX } from "solid-js"
-
-export type Props = Base.Props &
-  Base.Slots<JSX.Element> &
-  JSX.DetailsHtmlAttributes<HTMLDetailsElement>

package/components/Anchor/types.d.vue.ts

@@ -1,10 +0,0 @@
-import type { HTMLAttributes, Slot } from "vue"
-import type { Props as BaseProps, Slots as BaseSlots } from "./types"
-
-export type Props = BaseProps & {
-  class?: HTMLAttributes["class"]
-}
-
-export type Slots = BaseSlots<Slot> & {
-  default?: Slot
-}

package/components/Anchor/types.solid.ts

@@ -1,6 +0,0 @@
-import type * as Base from "./types"
-import type { JSX } from "solid-js"
-
-export type Props = Base.Props &
-  Partial<Base.Slots<JSX.Element>> &
-  JSX.HTMLAttributes<HTMLSpanElement>

package/components/Avatar/types.d.vue.ts

@@ -1,12 +0,0 @@
-import type { Slot } from "vue"
-import type { Props as BaseProps } from "./types"
-
-export type Props = BaseProps & {
-  alt?: string
-  src?: string
-  class?: string
-}
-
-export type Slots = {
-  default?: Slot
-}

package/components/Avatar/types.solid.ts

@@ -1,11 +0,0 @@
-import type * as Base from "./types"
-import type { JSX } from "solid-js"
-
-export type Props = Base.Props &
-  Base.Slots<JSX.Element> &
-  Pick<JSX.ImgHTMLAttributes<HTMLImageElement>, Base.ImageProps> &
-  (
-    | ({ as?: "div" } & JSX.HTMLAttributes<HTMLDivElement>)
-    | ({ as?: "button" } & JSX.ButtonHTMLAttributes<HTMLButtonElement>)
-    | ({ as?: "a" } & JSX.AnchorHTMLAttributes<HTMLAnchorElement>)
-  )

package/components/Badge/types.d.vue.ts

@@ -1,10 +0,0 @@
-import type { HTMLAttributes, Slot } from "vue"
-import type { Props as BaseProps, Slots as BaseSlots } from "./types"
-
-export type Props = BaseProps & {
-  class?: HTMLAttributes["class"]
-}
-
-export type Slots = BaseSlots<Slot> & {
-  default?: Slot
-}

package/components/Badge/types.solid.ts

@@ -1,4 +0,0 @@
-import type * as Base from "./types"
-import type { JSX } from "solid-js"
-
-export type Props = Base.Props & JSX.HTMLAttributes<HTMLSpanElement>

package/components/Button/types.d.vue.ts

@@ -1,10 +0,0 @@
-import type { HTMLAttributes, Slot } from "vue"
-import type { Props as BaseProps } from "./types"
-
-export type Props = BaseProps & {
-  class?: HTMLAttributes["class"]
-}
-
-export type Slots = {
-  default?: Slot
-}

package/components/Button/types.solid.ts

@@ -1,8 +0,0 @@
-import type * as Base from "./types"
-import type { JSX } from "solid-js"
-
-export type Props = Base.Props &
-  (
-    | ({ as?: "button" } & JSX.ButtonHTMLAttributes<HTMLButtonElement>)
-    | ({ as?: "a" } & JSX.AnchorHTMLAttributes<HTMLAnchorElement>)
-  )

package/components/ButtonGroup/types.d.vue.ts

@@ -1,10 +0,0 @@
-import type { HTMLAttributes, Slot } from "vue"
-import type { Props as BaseProps } from "./types"
-
-export type Props = BaseProps & {
-  class?: HTMLAttributes["class"]
-}
-
-export type Slots = {
-  default?: Slot
-}

package/components/ButtonGroup/types.solid.ts

@@ -1,4 +0,0 @@
-import type * as Base from "./types"
-import type { JSX } from "solid-js"
-
-export type Props = Base.Props & JSX.HTMLAttributes<HTMLDivElement>

package/components/Callout/types.d.vue.ts

@@ -1,10 +0,0 @@
-import type { HTMLAttributes, Slot } from "vue"
-import type { Props as BaseProps, Slots as BaseSlots } from "./types"
-
-export type Props = BaseProps & {
-  class?: HTMLAttributes["class"]
-}
-
-export type Slots = BaseSlots<Slot> & {
-  default?: Slot
-}

package/components/Callout/types.solid.ts

@@ -1,6 +0,0 @@
-import type * as Base from "./types"
-import type { JSX } from "solid-js"
-
-export type Props = Base.Props &
-  Partial<Base.Slots<JSX.Element>> &
-  JSX.HTMLAttributes<HTMLElement>

package/components/Card/types.d.vue.ts

@@ -1,10 +0,0 @@
-import type { HTMLAttributes, Slot } from "vue"
-import type { Props as BaseProps, Slots as BaseSlots } from "./types"
-
-export type Props = BaseProps & {
-  class?: HTMLAttributes["class"]
-}
-
-export type Slots = BaseSlots<Slot> & {
-  default?: Slot
-}

package/components/Card/types.solid.ts

@@ -1,6 +0,0 @@
-import type * as Base from "./types"
-import type { JSX } from "solid-js"
-
-export type Props = Base.Props &
-  Partial<Base.Slots<JSX.Element>> &
-  JSX.HTMLAttributes<HTMLDivElement>