@chassis-ui/react 0.1.3 → 0.2.0

package/dist/chunks/index-DHGgezXU.d.ts

@@ -0,0 +1,58 @@
+import "./focus-ring-SR_LwaN7.js";
+import React, { ChangeEventHandler, InputHTMLAttributes, ReactNode } from "react";
+//#region src/components/color-input/ColorInput.d.ts
+interface ColorInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+  /**
+   * A string of all className you want applied to the component.
+   */
+  className?: string;
+  /**
+   * The value of the input, uncontrolled.
+   */
+  defaultValue?: string;
+  /**
+   * Toggle the disabled state for the component.
+   */
+  disabled?: boolean;
+  /**
+   * A description for the field, rendered below the input.
+   */
+  help?: ReactNode;
+  /**
+   * Set component validation state to invalid.
+   */
+  invalid?: boolean;
+  /**
+   * An error message for the field, rendered below the input when `invalid` is set.
+   */
+  invalidFeedback?: ReactNode;
+  /**
+   * The field's caption, rendered as a `FormLabel` associated with this input.
+   */
+  label?: ReactNode;
+  /**
+   * Method called immediately after the `value` prop changes.
+   */
+  onChange?: ChangeEventHandler<HTMLInputElement>;
+  /**
+   * Size the component sm or lg.
+   */
+  size?: 'sm' | 'lg';
+  /**
+   * Set component validation state to valid.
+   */
+  valid?: boolean;
+  /**
+   * A success message for the field, rendered below the input when `valid` is set.
+   */
+  validFeedback?: ReactNode;
+  /**
+   * The `value` attribute of component.
+   *
+   * @controllable onChange
+   * */
+  value?: string;
+}
+declare const ColorInput: React.ForwardRefExoticComponent<ColorInputProps & React.RefAttributes<HTMLInputElement>>;
+//#endregion
+export { ColorInputProps as n, ColorInput as t };

package/dist/chunks/index-DJJocp_q.d.ts

@@ -0,0 +1,132 @@
+import "./focus-ring-SR_LwaN7.js";
+import { n as ContextColor } from "./types-CS_40Txv.js";
+import { t as ButtonObject } from "./renderFormCheck-CYWG-Rbt.js";
+import React, { HTMLAttributes, InputHTMLAttributes, ReactNode } from "react";
+//#region src/components/checkbox/Checkbox.d.ts
+interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'checked' | 'defaultChecked' | 'onChange' | 'size'> {
+  /**
+   * Create button-like checkboxes.
+   */
+  button?: ButtonObject;
+  /**
+   * A string of all className you want applied to the component.
+   */
+  className?: string;
+  /**
+   * Sets the color of the check indicator to one of Chassis context colors. Ignored when `button` is set.
+   */
+  color?: ContextColor;
+  /**
+   * Whether the checkbox is selected, uncontrolled. Ignored when rendered inside a `<CheckboxGroup>` —
+   * the group's `value`/`defaultValue` owns selection there.
+   */
+  defaultSelected?: boolean;
+  /**
+   * The id global attribute defines an identifier (ID) that must be unique in the whole document.
+   */
+  id?: string;
+  /**
+   * Checkbox indeterminate property.
+   */
+  indeterminate?: boolean;
+  /**
+   * Set component validation state to invalid.
+   */
+  invalid?: boolean;
+  /**
+   * Whether the checkbox is selected, controlled. Ignored when rendered inside a `<CheckboxGroup>` —
+   * the group's `value`/`defaultValue` owns selection there.
+   */
+  isSelected?: boolean;
+  /**
+   * The element represents a caption for a component.
+   *
+   * Children are accepted as an alias for this prop — `label` wins when both are given.
+   * react-aria, which backs this component, calls the same thing `children`; this package renames
+   * it to `label`, and honouring both means the shape React developers reach for first still
+   * names the control instead of silently producing an unlabelled one.
+   */
+  label?: ReactNode;
+  /**
+   * Callback fired when the selected state changes. Ignored when rendered inside a `<CheckboxGroup>` —
+   * use the group's `onChange` instead.
+   */
+  onChange?: (isSelected: boolean) => void;
+  /**
+   * Size the component sm or lg.
+   */
+  size?: 'sm' | 'lg';
+  /**
+   * Set component validation state to valid.
+   */
+  valid?: boolean;
+  /**
+   * The value of the checkbox, used when submitting an HTML form. Required when rendered inside a
+   * `<CheckboxGroup>` — it identifies this item within the group's selected values.
+   */
+  value?: string;
+}
+declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
+//#endregion
+//#region src/components/checkbox/CheckboxGroup.d.ts
+interface CheckboxGroupProps extends Omit<HTMLAttributes<HTMLFieldSetElement>, 'defaultValue' | 'onChange'> {
+  /**
+   * One or more `<Checkbox>` elements.
+   */
+  children: ReactNode;
+  /**
+   * A string of all className you want applied to the component.
+   */
+  className?: string;
+  /**
+   * The selected values, uncontrolled.
+   */
+  defaultValue?: string[];
+  /**
+   * A description for the group, rendered below the options.
+   */
+  description?: ReactNode;
+  /**
+   * Disables every checkbox in the group.
+   */
+  disabled?: boolean;
+  /**
+   * An error message for the group, rendered below the options when `invalid` is set.
+   */
+  errorMessage?: ReactNode;
+  /**
+   * Set group validation state to invalid.
+   */
+  invalid?: boolean;
+  /**
+   * The group's caption, rendered as a `<legend>`.
+   */
+  label?: ReactNode;
+  /**
+   * The name for the group, used for native form submission.
+   */
+  name?: string;
+  /**
+   * Callback fired when the selected values change.
+   */
+  onChange?: (value: string[]) => void;
+  /**
+   * Lay the group's checkboxes out on the same horizontal row instead of stacking them.
+   */
+  orientation?: 'horizontal' | 'vertical';
+  /**
+   * Marks the group as required.
+   */
+  required?: boolean;
+  /**
+   * Set group validation state to valid.
+   */
+  valid?: boolean;
+  /**
+   * The selected values, controlled.
+   */
+  value?: string[];
+}
+declare const CheckboxGroup: React.ForwardRefExoticComponent<CheckboxGroupProps & React.RefAttributes<HTMLFieldSetElement>>;
+//#endregion
+export { CheckboxProps as i, CheckboxGroupProps as n, Checkbox as r, CheckboxGroup as t };

package/dist/chunks/index-DKma0jQw.d.ts

@@ -0,0 +1,104 @@
+import "./focus-ring-SR_LwaN7.js";
+import { n as ContextColor } from "./types-CS_40Txv.js";
+import { t as ButtonObject } from "./renderFormCheck-CYWG-Rbt.js";
+import React, { HTMLAttributes, InputHTMLAttributes, ReactNode } from "react";
+//#region src/components/radio/Radio.d.ts
+interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'checked' | 'defaultChecked' | 'onChange' | 'size'> {
+  /**
+   * Create button-like radios. Combine with `<RadioGroup>` to build radio toggle-button groups.
+   */
+  button?: ButtonObject;
+  /**
+   * A string of all className you want applied to the component.
+   */
+  className?: string;
+  /**
+   * Sets the color of the radio indicator to one of Chassis context colors. Ignored when `button` is set.
+   */
+  color?: ContextColor;
+  /**
+   * The id global attribute defines an identifier (ID) that must be unique in the whole document.
+   */
+  id?: string;
+  /**
+   * The element represents a caption for a component.
+   *
+   * Children are accepted as an alias for this prop — `label` wins when both are given.
+   * react-aria, which backs this component, calls the same thing `children`; this package renames
+   * it to `label`, and honouring both means the shape React developers reach for first still
+   * names the control instead of silently producing an unlabelled one.
+   */
+  label?: ReactNode;
+  /**
+   * Size the component sm or lg.
+   */
+  size?: 'sm' | 'lg';
+  /**
+   * The value of the radio button, used to identify it within its `<RadioGroup>`.
+   */
+  value: string;
+}
+declare const Radio: React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<HTMLInputElement>>;
+//#endregion
+//#region src/components/radio/RadioGroup.d.ts
+interface RadioGroupProps extends Omit<HTMLAttributes<HTMLFieldSetElement>, 'defaultValue' | 'onChange'> {
+  /**
+   * One or more `<Radio>` elements.
+   */
+  children: ReactNode;
+  /**
+   * A string of all className you want applied to the component.
+   */
+  className?: string;
+  /**
+   * The selected value, uncontrolled.
+   */
+  defaultValue?: string;
+  /**
+   * A description for the group, rendered below the options.
+   */
+  description?: ReactNode;
+  /**
+   * Disables every radio in the group.
+   */
+  disabled?: boolean;
+  /**
+   * An error message for the group, rendered below the options when `invalid` is set.
+   */
+  errorMessage?: ReactNode;
+  /**
+   * Set group validation state to invalid.
+   */
+  invalid?: boolean;
+  /**
+   * The group's caption, rendered as a `<legend>`.
+   */
+  label?: ReactNode;
+  /**
+   * The name for the group, used for native form submission.
+   */
+  name?: string;
+  /**
+   * Callback fired when the selected value changes.
+   */
+  onChange?: (value: string) => void;
+  /**
+   * Lay the group's radios out on the same horizontal row instead of stacking them.
+   */
+  orientation?: 'horizontal' | 'vertical';
+  /**
+   * Marks the group as required.
+   */
+  required?: boolean;
+  /**
+   * Set group validation state to valid.
+   */
+  valid?: boolean;
+  /**
+   * The selected value, controlled.
+   */
+  value?: string;
+}
+declare const RadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & React.RefAttributes<HTMLFieldSetElement>>;
+//#endregion
+export { RadioProps as i, RadioGroupProps as n, Radio as r, RadioGroup as t };

package/dist/chunks/index-DPV62IdF.d.ts

@@ -0,0 +1,118 @@
+import "./focus-ring-SR_LwaN7.js";
+import { n as PolymorphicRef, t as PolymorphicComponentProps } from "./polymorphic-CVHbTHSN.js";
+import { n as ContextColor, r as ContextStyle } from "./types-CS_40Txv.js";
+import React, { ElementType, ReactElement } from "react";
+//#region src/components/list/List.d.ts
+interface ListItemDef {
+  /**
+   * Stable key for the rendered item. Falls back to the item's index in `items`.
+   */
+  id?: number | string;
+  /**
+   * Item label content.
+   */
+  label: React.ReactNode;
+  /**
+   * Makes the item a link.
+   */
+  href?: string;
+  /**
+   * Sets the color of the item.
+   */
+  color?: ContextColor;
+  /**
+   * Marks the item as active.
+   */
+  active?: boolean;
+  /**
+   * Marks the item as disabled.
+   */
+  disabled?: boolean;
+}
+type ListOwnProps<C extends ElementType> = {
+  /**
+   * A string of all className you want applied to the component.
+   */
+  className?: string;
+  /**
+   * Component used for the root node. Either a string to use a HTML element or a component.
+   * Defaults to `'ul'`, unless an item (a data-driven item with `href`, or a `<ListItem
+   * component="a">`/`<ListItem component="button">` child) is interactive — a bare `<a>`/
+   * `<button>` isn't a valid direct child of `<ul>`/`<ol>`, so the default switches to `'div'`
+   * instead. Pass `component` explicitly to opt out of this.
+   */
+  component?: C;
+  /**
+   * Sets the color of the component to one of Chassis context colors.
+   */
+  color?: ContextColor;
+  /**
+   * Remove outer borders and rounded corners to render list items edge-to-edge in a parent component (e.g., `<Card>`).
+   */
+  flush?: boolean;
+  /**
+   * Array of item definitions for data-driven rendering. When provided, children are ignored.
+   */
+  items?: ListItemDef[];
+  /**
+   * Specify a layout type.
+   */
+  layout?: 'horizontal' | 'sm:horizontal' | 'md:horizontal' | 'lg:horizontal' | 'xl:horizontal' | '2xl:horizontal';
+  /**
+   * Number list items sequentially using CSS counters. Pair with `component="ol"` for semantic correctness.
+   */
+  numbered?: boolean;
+  /**
+   * Remove outer borders, rounded corners, and horizontal padding for a minimal, edge-to-edge appearance.
+   */
+  plain?: boolean;
+  /**
+   * Applies a `.solid`, `.outline`, or `.smooth` context style. Only meaningful together with `color`.
+   */
+  variant?: ContextStyle;
+};
+type ListProps<C extends ElementType = 'ul'> = PolymorphicComponentProps<C, ListOwnProps<C>>;
+type ListComponent = (<C extends ElementType = 'ul'>(props: ListProps<C> & {
+  ref?: PolymorphicRef<C>;
+}) => ReactElement | null) & {
+  displayName?: string;
+};
+declare const List: ListComponent;
+//#endregion
+//#region src/components/list/ListItem.d.ts
+type ListItemOwnProps<C extends ElementType> = {
+  /**
+   * Toggle the active state for the component.
+   */
+  active?: boolean;
+  /**
+   * A string of all className you want applied to the component.
+   */
+  className?: string;
+  /**
+   * Sets the color of the component to one of Chassis context colors.
+   */
+  color?: ContextColor;
+  /**
+   * Toggle the disabled state for the component.
+   */
+  disabled?: boolean;
+  /**
+   * Component used for the root node. Either a string to use a HTML element or a component.
+   */
+  component?: C;
+  /**
+   * The href attribute specifies the URL of the page the link goes to. Only applicable when
+   * `component` is `"a"`.
+   */
+  href?: string;
+};
+type ListItemProps<C extends ElementType = 'li'> = PolymorphicComponentProps<C, ListItemOwnProps<C>>;
+type ListItemComponent = (<C extends ElementType = 'li'>(props: ListItemProps<C> & {
+  ref?: PolymorphicRef<C>;
+}) => ReactElement | null) & {
+  displayName?: string;
+};
+declare const ListItem: ListItemComponent;
+//#endregion
+export { ListProps as a, ListItemDef as i, ListItemProps as n, List as r, ListItem as t };