@chayns-ui/core 0.2.0

package/dist/components/button/Button.types.d.ts

@@ -0,0 +1,35 @@
+import type { ComponentPropsWithRef, ReactNode } from 'react';
+/** Supported visual emphasis levels for Button and IconButton. */
+export type ButtonVariant = 'primary' | 'outline' | 'ghost' | 'danger';
+/** FontAwesome Classic icon name with a Regular and Solid pair. */
+export type ButtonIcon = `fa-${string}`;
+/** Visible content that gives a Button its accessible name. */
+export type ButtonContent = Exclude<ReactNode, boolean | null | undefined>;
+/** Props for a visible-label native action button. */
+export interface ButtonProps extends Omit<ComponentPropsWithRef<'button'>, 'children'> {
+    /** Visual emphasis that communicates the action's role. */
+    variant: ButtonVariant;
+    /** Optional leading FontAwesome Classic icon name. */
+    icon?: ButtonIcon;
+    /** Visible, non-empty content used as the button label. */
+    children: ButtonContent;
+}
+type IconButtonAccessibleName = {
+    /** Localized accessible name when no external label element exists. */
+    'aria-label': string;
+    'aria-labelledby'?: never;
+} | {
+    'aria-label'?: never;
+    /** ID of the element that provides the localized accessible name. */
+    'aria-labelledby': string;
+};
+interface IconButtonBaseProps extends Omit<ComponentPropsWithRef<'button'>, 'aria-label' | 'aria-labelledby' | 'children'> {
+    /** Visual emphasis that communicates the action's role. */
+    variant: ButtonVariant;
+    /** FontAwesome Classic icon name rendered Regular at rest and Solid on interaction. */
+    icon: ButtonIcon;
+}
+/** Props for a compact native action button with a required accessible name. */
+export type IconButtonProps = IconButtonBaseProps & IconButtonAccessibleName;
+export {};
+//# sourceMappingURL=Button.types.d.ts.map

package/dist/components/button/Button.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,kEAAkE;AAClE,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;AAEvE,mEAAmE;AACnE,MAAM,MAAM,UAAU,GAAG,MAAM,MAAM,EAAE,CAAC;AAExC,+DAA+D;AAC/D,MAAM,MAAM,aAAa,GAAG,OAAO,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;AAE3E,sDAAsD;AACtD,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC;IACpF,2DAA2D;IAC3D,OAAO,EAAE,aAAa,CAAC;IAEvB,sDAAsD;IACtD,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB,2DAA2D;IAC3D,QAAQ,EAAE,aAAa,CAAC;CACzB;AAED,KAAK,wBAAwB,GACzB;IACE,uEAAuE;IACvE,YAAY,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,KAAK,CAAC;CAC3B,GACD;IACE,YAAY,CAAC,EAAE,KAAK,CAAC;IAErB,qEAAqE;IACrE,iBAAiB,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEN,UAAU,mBAAoB,SAAQ,IAAI,CACxC,qBAAqB,CAAC,QAAQ,CAAC,EAC/B,YAAY,GAAG,iBAAiB,GAAG,UAAU,CAC9C;IACC,2DAA2D;IAC3D,OAAO,EAAE,aAAa,CAAC;IAEvB,uFAAuF;IACvF,IAAI,EAAE,UAAU,CAAC;CAClB;AAED,gFAAgF;AAChF,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAAG,wBAAwB,CAAC"}

package/dist/components/button/ButtonIcon.d.ts

@@ -0,0 +1,7 @@
+import type { ButtonIcon as ButtonIconName } from './Button.types.js';
+interface ButtonIconProps {
+    icon: ButtonIconName;
+}
+declare function ButtonIcon({ icon }: ButtonIconProps): import("react").JSX.Element;
+export default ButtonIcon;
+//# sourceMappingURL=ButtonIcon.d.ts.map

package/dist/components/button/ButtonIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.d.ts","sourceRoot":"","sources":["../../../src/components/button/ButtonIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,IAAI,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAEtE,UAAU,eAAe;IACvB,IAAI,EAAE,cAAc,CAAC;CACtB;AAED,iBAAS,UAAU,CAAC,EAAE,IAAI,EAAE,EAAE,eAAe,+BAW5C;AAED,eAAe,UAAU,CAAC"}

package/dist/components/button/ButtonIcon.js

@@ -0,0 +1,19 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/button/ButtonIcon.tsx
+function ButtonIcon({ icon }) {
+	return /* @__PURE__ */ jsxs("span", {
+		"aria-hidden": "true",
+		className: "chayns-button-icon",
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "chayns-button-icon__weight",
+			children: /* @__PURE__ */ jsx("i", { className: `far ${icon}` })
+		}), /* @__PURE__ */ jsx("span", {
+			className: "chayns-button-icon__weight chayns-button-icon__weight--active",
+			children: /* @__PURE__ */ jsx("i", { className: `fas ${icon}` })
+		})]
+	});
+}
+//#endregion
+export { ButtonIcon as default };
+
+//# sourceMappingURL=ButtonIcon.js.map

package/dist/components/button/ButtonIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.js","names":[],"sources":["../../../src/components/button/ButtonIcon.tsx"],"sourcesContent":["import type { ButtonIcon as ButtonIconName } from './Button.types.js';\n\ninterface ButtonIconProps {\n  icon: ButtonIconName;\n}\n\nfunction ButtonIcon({ icon }: ButtonIconProps) {\n  return (\n    <span aria-hidden=\"true\" className=\"chayns-button-icon\">\n      <span className=\"chayns-button-icon__weight\">\n        <i className={`far ${icon}`} />\n      </span>\n      <span className=\"chayns-button-icon__weight chayns-button-icon__weight--active\">\n        <i className={`fas ${icon}`} />\n      </span>\n    </span>\n  );\n}\n\nexport default ButtonIcon;\n"],"mappings":";;AAMA,SAAS,WAAW,EAAE,QAAyB;CAC7C,OACE,qBAAC,QAAD;EAAM,eAAY;EAAO,WAAU;EAAnC,UAAA,CACE,oBAAC,QAAD;GAAM,WAAU;GACd,UAAA,oBAAC,KAAD,EAAG,WAAW,OAAO,OAAS,CAAA;EAC1B,CAAA,GACN,oBAAC,QAAD;GAAM,WAAU;GACd,UAAA,oBAAC,KAAD,EAAG,WAAW,OAAO,OAAS,CAAA;EAC1B,CAAA,CACF;;AAEV"}

package/dist/components/button/IconButton.d.ts

@@ -0,0 +1,4 @@
+import type { IconButtonProps } from './Button.types.js';
+declare function IconButton({ className, icon, type, variant, ...buttonProps }: IconButtonProps): import("react").JSX.Element;
+export default IconButton;
+//# sourceMappingURL=IconButton.d.ts.map

package/dist/components/button/IconButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/components/button/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAIzD,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,IAAI,EACJ,IAAe,EACf,OAAO,EACP,GAAG,WAAW,EACf,EAAE,eAAe,+BAQjB;AAED,eAAe,UAAU,CAAC"}

package/dist/components/button/IconButton.js

@@ -0,0 +1,17 @@
+import ButtonIcon from "./ButtonIcon.js";
+import { getButtonClassName } from "./buttonClassName.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/button/IconButton.tsx
+function IconButton({ className, icon, type = "button", variant, ...buttonProps }) {
+	const resolvedClassName = getButtonClassName("chayns-icon-button", variant, className);
+	return /* @__PURE__ */ jsx("button", {
+		...buttonProps,
+		className: resolvedClassName,
+		type,
+		children: /* @__PURE__ */ jsx(ButtonIcon, { icon })
+	});
+}
+//#endregion
+export { IconButton as default };
+
+//# sourceMappingURL=IconButton.js.map

package/dist/components/button/IconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconButton.js","names":[],"sources":["../../../src/components/button/IconButton.tsx"],"sourcesContent":["import type { IconButtonProps } from './Button.types.js';\nimport ButtonIcon from './ButtonIcon.js';\nimport { getButtonClassName } from './buttonClassName.js';\n\nfunction IconButton({\n  className,\n  icon,\n  type = 'button',\n  variant,\n  ...buttonProps\n}: IconButtonProps) {\n  const resolvedClassName = getButtonClassName('chayns-icon-button', variant, className);\n\n  return (\n    <button {...buttonProps} className={resolvedClassName} type={type}>\n      <ButtonIcon icon={icon} />\n    </button>\n  );\n}\n\nexport default IconButton;\n"],"mappings":";;;;AAIA,SAAS,WAAW,EAClB,WACA,MACA,OAAO,UACP,SACA,GAAG,eACe;CAClB,MAAM,oBAAoB,mBAAmB,sBAAsB,SAAS,SAAS;CAErF,OACE,oBAAC,UAAD;EAAQ,GAAI;EAAa,WAAW;EAAyB;EAC3D,UAAA,oBAAC,YAAD,EAAkB,KAAO,CAAA;CACnB,CAAA;AAEZ"}

package/dist/components/button/buttonClassName.d.ts

@@ -0,0 +1,3 @@
+import type { ButtonVariant } from './Button.types.js';
+export declare function getButtonClassName(componentClassName: 'chayns-button' | 'chayns-icon-button', variant: ButtonVariant, className?: string): string;
+//# sourceMappingURL=buttonClassName.d.ts.map

package/dist/components/button/buttonClassName.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"buttonClassName.d.ts","sourceRoot":"","sources":["../../../src/components/button/buttonClassName.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAEvD,wBAAgB,kBAAkB,CAChC,kBAAkB,EAAE,eAAe,GAAG,oBAAoB,EAC1D,OAAO,EAAE,aAAa,EACtB,SAAS,CAAC,EAAE,MAAM,GACjB,MAAM,CAMR"}

package/dist/components/button/buttonClassName.js

@@ -0,0 +1,9 @@
+//#region src/components/button/buttonClassName.ts
+function getButtonClassName(componentClassName, variant, className) {
+	const variantClassName = `${componentClassName}--${variant}`;
+	return className ? `${componentClassName} ${variantClassName} ${className}` : `${componentClassName} ${variantClassName}`;
+}
+//#endregion
+export { getButtonClassName };
+
+//# sourceMappingURL=buttonClassName.js.map

package/dist/components/button/buttonClassName.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"buttonClassName.js","names":[],"sources":["../../../src/components/button/buttonClassName.ts"],"sourcesContent":["import type { ButtonVariant } from './Button.types.js';\n\nexport function getButtonClassName(\n  componentClassName: 'chayns-button' | 'chayns-icon-button',\n  variant: ButtonVariant,\n  className?: string,\n): string {\n  const variantClassName = `${componentClassName}--${variant}`;\n\n  return className\n    ? `${componentClassName} ${variantClassName} ${className}`\n    : `${componentClassName} ${variantClassName}`;\n}\n"],"mappings":";AAEA,SAAgB,mBACd,oBACA,SACA,WACQ;CACR,MAAM,mBAAmB,GAAG,mBAAmB,IAAI;CAEnD,OAAO,YACH,GAAG,mBAAmB,GAAG,iBAAiB,GAAG,cAC7C,GAAG,mBAAmB,GAAG;AAC/B"}

package/dist/components/button/index.d.ts

@@ -0,0 +1,4 @@
+export { default as Button } from './Button.js';
+export { default as IconButton } from './IconButton.js';
+export type { ButtonContent, ButtonIcon, ButtonProps, ButtonVariant, IconButtonProps, } from './Button.types.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,iBAAiB,CAAC;AACxD,YAAY,EACV,aAAa,EACb,UAAU,EACV,WAAW,EACX,aAAa,EACb,eAAe,GAChB,MAAM,mBAAmB,CAAC"}

package/dist/components/button/index.js

@@ -0,0 +1,3 @@
+import Button from "./Button.js";
+import IconButton from "./IconButton.js";
+export { Button, IconButton };

package/dist/components/card/Card.d.ts

@@ -0,0 +1,4 @@
+import type { CardProps } from './Card.types.js';
+declare function Card({ children, className, elevated, ...cardProps }: CardProps): import("react").JSX.Element;
+export default Card;
+//# sourceMappingURL=Card.d.ts.map

package/dist/components/card/Card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/components/card/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAEjD,iBAAS,IAAI,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAgB,EAAE,GAAG,SAAS,EAAE,EAAE,SAAS,+BAU/E;AAED,eAAe,IAAI,CAAC"}

package/dist/components/card/Card.js

@@ -0,0 +1,18 @@
+import { jsx } from "react/jsx-runtime";
+//#region src/components/card/Card.tsx
+function Card({ children, className, elevated = false, ...cardProps }) {
+	const resolvedClassName = [
+		"chayns-card",
+		elevated ? "chayns-card--elevated" : null,
+		className
+	].filter(Boolean).join(" ");
+	return /* @__PURE__ */ jsx("div", {
+		...cardProps,
+		className: resolvedClassName,
+		children
+	});
+}
+//#endregion
+export { Card as default };
+
+//# sourceMappingURL=Card.js.map

package/dist/components/card/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.js","names":[],"sources":["../../../src/components/card/Card.tsx"],"sourcesContent":["import type { CardProps } from './Card.types.js';\n\nfunction Card({ children, className, elevated = false, ...cardProps }: CardProps) {\n  const resolvedClassName = ['chayns-card', elevated ? 'chayns-card--elevated' : null, className]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div {...cardProps} className={resolvedClassName}>\n      {children}\n    </div>\n  );\n}\n\nexport default Card;\n"],"mappings":";;AAEA,SAAS,KAAK,EAAE,UAAU,WAAW,WAAW,OAAO,GAAG,aAAwB;CAChF,MAAM,oBAAoB;EAAC;EAAe,WAAW,0BAA0B;EAAM;CAAS,CAAC,CAC5F,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;CAEX,OACE,oBAAC,OAAD;EAAK,GAAI;EAAW,WAAW;EAC5B;CACE,CAAA;AAET"}

package/dist/components/card/Card.types.d.ts

@@ -0,0 +1,9 @@
+import type { ComponentPropsWithRef, ReactNode } from 'react';
+/** Props for the presentational surface container. */
+export interface CardProps extends ComponentPropsWithRef<'div'> {
+    /** Content rendered inside the card surface. */
+    children?: ReactNode;
+    /** Adds the subtle resting card elevation token. */
+    elevated?: boolean;
+}
+//# sourceMappingURL=Card.types.d.ts.map

package/dist/components/card/Card.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.types.d.ts","sourceRoot":"","sources":["../../../src/components/card/Card.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,sDAAsD;AACtD,MAAM,WAAW,SAAU,SAAQ,qBAAqB,CAAC,KAAK,CAAC;IAC7D,gDAAgD;IAChD,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,oDAAoD;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB"}

package/dist/components/card/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Card } from './Card.js';
+export type { CardProps } from './Card.types.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/card/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/card/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,WAAW,CAAC;AAC5C,YAAY,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/components/card/index.js

@@ -0,0 +1,2 @@
+import Card from "./Card.js";
+export { Card };

package/dist/components/list/List.d.ts

@@ -0,0 +1,4 @@
+import type { ListProps } from './List.types.js';
+declare function List({ children, className, ...listProps }: ListProps): import("react").JSX.Element;
+export default List;
+//# sourceMappingURL=List.d.ts.map

package/dist/components/list/List.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../src/components/list/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAEjD,iBAAS,IAAI,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,SAAS,+BAQ7D;AAED,eAAe,IAAI,CAAC"}

package/dist/components/list/List.js

@@ -0,0 +1,14 @@
+import { jsx } from "react/jsx-runtime";
+//#region src/components/list/List.tsx
+function List({ children, className, ...listProps }) {
+	const resolvedClassName = ["chayns-list", className].filter(Boolean).join(" ");
+	return /* @__PURE__ */ jsx("ul", {
+		...listProps,
+		className: resolvedClassName,
+		children
+	});
+}
+//#endregion
+export { List as default };
+
+//# sourceMappingURL=List.js.map

package/dist/components/list/List.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.js","names":[],"sources":["../../../src/components/list/List.tsx"],"sourcesContent":["import type { ListProps } from './List.types.js';\n\nfunction List({ children, className, ...listProps }: ListProps) {\n  const resolvedClassName = ['chayns-list', className].filter(Boolean).join(' ');\n\n  return (\n    <ul {...listProps} className={resolvedClassName}>\n      {children}\n    </ul>\n  );\n}\n\nexport default List;\n"],"mappings":";;AAEA,SAAS,KAAK,EAAE,UAAU,WAAW,GAAG,aAAwB;CAC9D,MAAM,oBAAoB,CAAC,eAAe,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAE7E,OACE,oBAAC,MAAD;EAAI,GAAI;EAAW,WAAW;EAC3B;CACC,CAAA;AAER"}

package/dist/components/list/List.types.d.ts

@@ -0,0 +1,32 @@
+import type { ComponentPropsWithRef, MouseEventHandler, ReactNode } from 'react';
+/** Props for the vertical list container. */
+export interface ListProps extends ComponentPropsWithRef<'ul'> {
+    /** List items, typically ListItem elements. */
+    children?: ReactNode;
+}
+/** Props for a single list row. */
+export interface ListItemProps {
+    /** Primary single-line row label. */
+    title: ReactNode;
+    /** Optional secondary single-line preview text. */
+    subtitle?: ReactNode;
+    /** Optional leading slot, for example an avatar or icon. */
+    leading?: ReactNode;
+    /** Optional trailing slot for row-level actions or metadata. */
+    trailing?: ReactNode;
+    /** Shows an accent unread indicator. */
+    unread?: boolean;
+    /** Localized accessible name for the unread indicator. */
+    unreadLabel?: string;
+    /** Renders the row as a navigation link with this destination. */
+    href?: string;
+    /** Renders the row as an action button with this handler. */
+    onClick?: MouseEventHandler<HTMLButtonElement>;
+    /** Disables the action button variant. */
+    disabled?: boolean;
+    /** Additional class names on the list item element. */
+    className?: string;
+    /** Optional id on the list item element. */
+    id?: string;
+}
+//# sourceMappingURL=List.types.d.ts.map

package/dist/components/list/List.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.types.d.ts","sourceRoot":"","sources":["../../../src/components/list/List.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEjF,6CAA6C;AAC7C,MAAM,WAAW,SAAU,SAAQ,qBAAqB,CAAC,IAAI,CAAC;IAC5D,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,mCAAmC;AACnC,MAAM,WAAW,aAAa;IAC5B,qCAAqC;IACrC,KAAK,EAAE,SAAS,CAAC;IAEjB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB,gEAAgE;IAChE,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,wCAAwC;IACxC,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,0DAA0D;IAC1D,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,kEAAkE;IAClE,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,6DAA6D;IAC7D,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAE/C,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,4CAA4C;IAC5C,EAAE,CAAC,EAAE,MAAM,CAAC;CACb"}

package/dist/components/list/ListItem.d.ts

@@ -0,0 +1,4 @@
+import type { ListItemProps } from './List.types.js';
+declare function ListItem({ className, disabled, href, id, leading, onClick, subtitle, title, trailing, unread, unreadLabel, }: ListItemProps): import("react").JSX.Element;
+export default ListItem;
+//# sourceMappingURL=ListItem.d.ts.map

package/dist/components/list/ListItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../../src/components/list/ListItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AA+BrD,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,QAAgB,EAChB,IAAI,EACJ,EAAE,EACF,OAAO,EACP,OAAO,EACP,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,MAAc,EACd,WAAW,GACZ,EAAE,aAAa,+BA0Cf;AAED,eAAe,QAAQ,CAAC"}

package/dist/components/list/ListItem.js

@@ -0,0 +1,67 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/list/ListItem.tsx
+function ListItemBody({ leading, subtitle, title, unread, unreadLabel }) {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		unread ? /* @__PURE__ */ jsx("span", {
+			className: "chayns-list-item__unread",
+			"aria-hidden": unreadLabel ? void 0 : true,
+			children: unreadLabel ? /* @__PURE__ */ jsx("span", {
+				className: "chayns-visually-hidden",
+				children: unreadLabel
+			}) : null
+		}) : null,
+		leading ? /* @__PURE__ */ jsx("span", {
+			className: "chayns-list-item__leading",
+			children: leading
+		}) : null,
+		/* @__PURE__ */ jsxs("span", {
+			className: "chayns-list-item__body",
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "chayns-list-item__title",
+				children: title
+			}), subtitle ? /* @__PURE__ */ jsx("span", {
+				className: "chayns-list-item__subtitle",
+				children: subtitle
+			}) : null]
+		})
+	] });
+}
+function ListItem({ className, disabled = false, href, id, leading, onClick, subtitle, title, trailing, unread = false, unreadLabel }) {
+	const actionClassName = ["chayns-list-item__action", Boolean(href) || Boolean(onClick) ? "chayns-list-item__action--interactive" : null].filter(Boolean).join(" ");
+	const body = /* @__PURE__ */ jsx(ListItemBody, {
+		leading,
+		subtitle,
+		title,
+		unread,
+		unreadLabel
+	});
+	let action;
+	if (href) action = /* @__PURE__ */ jsx("a", {
+		className: actionClassName,
+		href,
+		children: body
+	});
+	else if (onClick) action = /* @__PURE__ */ jsx("button", {
+		className: actionClassName,
+		disabled,
+		onClick,
+		type: "button",
+		children: body
+	});
+	else action = /* @__PURE__ */ jsx("div", {
+		className: actionClassName,
+		children: body
+	});
+	return /* @__PURE__ */ jsxs("li", {
+		className: ["chayns-list-item", className].filter(Boolean).join(" "),
+		id,
+		children: [action, trailing ? /* @__PURE__ */ jsx("span", {
+			className: "chayns-list-item__trailing",
+			children: trailing
+		}) : null]
+	});
+}
+//#endregion
+export { ListItem as default };
+
+//# sourceMappingURL=ListItem.js.map

package/dist/components/list/ListItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItem.js","names":[],"sources":["../../../src/components/list/ListItem.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport type { ListItemProps } from './List.types.js';\n\nfunction ListItemBody({\n  leading,\n  subtitle,\n  title,\n  unread,\n  unreadLabel,\n}: {\n  leading?: ReactNode;\n  subtitle?: ReactNode;\n  title: ReactNode;\n  unread?: boolean;\n  unreadLabel?: string | undefined;\n}) {\n  return (\n    <>\n      {unread ? (\n        <span className=\"chayns-list-item__unread\" aria-hidden={unreadLabel ? undefined : true}>\n          {unreadLabel ? <span className=\"chayns-visually-hidden\">{unreadLabel}</span> : null}\n        </span>\n      ) : null}\n      {leading ? <span className=\"chayns-list-item__leading\">{leading}</span> : null}\n      <span className=\"chayns-list-item__body\">\n        <span className=\"chayns-list-item__title\">{title}</span>\n        {subtitle ? <span className=\"chayns-list-item__subtitle\">{subtitle}</span> : null}\n      </span>\n    </>\n  );\n}\n\nfunction ListItem({\n  className,\n  disabled = false,\n  href,\n  id,\n  leading,\n  onClick,\n  subtitle,\n  title,\n  trailing,\n  unread = false,\n  unreadLabel,\n}: ListItemProps) {\n  const interactive = Boolean(href) || Boolean(onClick);\n  const actionClassName = [\n    'chayns-list-item__action',\n    interactive ? 'chayns-list-item__action--interactive' : null,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  const body = (\n    <ListItemBody\n      leading={leading}\n      subtitle={subtitle}\n      title={title}\n      unread={unread}\n      unreadLabel={unreadLabel}\n    />\n  );\n\n  let action: ReactNode;\n  if (href) {\n    action = (\n      <a className={actionClassName} href={href}>\n        {body}\n      </a>\n    );\n  } else if (onClick) {\n    action = (\n      <button className={actionClassName} disabled={disabled} onClick={onClick} type=\"button\">\n        {body}\n      </button>\n    );\n  } else {\n    action = <div className={actionClassName}>{body}</div>;\n  }\n\n  return (\n    <li className={['chayns-list-item', className].filter(Boolean).join(' ')} id={id}>\n      {action}\n      {trailing ? <span className=\"chayns-list-item__trailing\">{trailing}</span> : null}\n    </li>\n  );\n}\n\nexport default ListItem;\n"],"mappings":";;AAIA,SAAS,aAAa,EACpB,SACA,UACA,OACA,QACA,eAOC;CACD,OACE,qBAAA,UAAA,EAAA,UAAA;EACG,SACC,oBAAC,QAAD;GAAM,WAAU;GAA2B,eAAa,cAAc,KAAA,IAAY;GAC/E,UAAA,cAAc,oBAAC,QAAD;IAAM,WAAU;IAA0B,UAAA;GAAkB,CAAA,IAAI;EAC3E,CAAA,IACJ;EACH,UAAU,oBAAC,QAAD;GAAM,WAAU;GAA6B,UAAA;EAAc,CAAA,IAAI;EAC1E,qBAAC,QAAD;GAAM,WAAU;GAAhB,UAAA,CACE,oBAAC,QAAD;IAAM,WAAU;IAA2B,UAAA;GAAY,CAAA,GACtD,WAAW,oBAAC,QAAD;IAAM,WAAU;IAA8B,UAAA;GAAe,CAAA,IAAI,IACzE;;CACN,EAAA,CAAA;AAEN;AAEA,SAAS,SAAS,EAChB,WACA,WAAW,OACX,MACA,IACA,SACA,SACA,UACA,OACA,UACA,SAAS,OACT,eACgB;CAEhB,MAAM,kBAAkB,CACtB,4BAFkB,QAAQ,IAAI,KAAK,QAAQ,OAAO,IAGpC,0CAA0C,IAC1D,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;CAEX,MAAM,OACJ,oBAAC,cAAD;EACW;EACC;EACH;EACC;EACK;CACd,CAAA;CAGH,IAAI;CACJ,IAAI,MACF,SACE,oBAAC,KAAD;EAAG,WAAW;EAAuB;EAClC,UAAA;CACA,CAAA;MAEA,IAAI,SACT,SACE,oBAAC,UAAD;EAAQ,WAAW;EAA2B;EAAmB;EAAS,MAAK;EAC5E,UAAA;CACK,CAAA;MAGV,SAAS,oBAAC,OAAD;EAAK,WAAW;EAAkB,UAAA;CAAU,CAAA;CAGvD,OACE,qBAAC,MAAD;EAAI,WAAW,CAAC,oBAAoB,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;EAAO;EAA9E,UAAA,CACG,QACA,WAAW,oBAAC,QAAD;GAAM,WAAU;GAA8B,UAAA;EAAe,CAAA,IAAI,IAC3E;;AAER"}

package/dist/components/list/index.d.ts

@@ -0,0 +1,4 @@
+export { default as List } from './List.js';
+export { default as ListItem } from './ListItem.js';
+export type { ListItemProps, ListProps } from './List.types.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/list/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/list/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,WAAW,CAAC;AAC5C,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAC;AACpD,YAAY,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/components/list/index.js

@@ -0,0 +1,3 @@
+import List from "./List.js";
+import ListItem from "./ListItem.js";
+export { List, ListItem };

package/dist/index.d.ts

@@ -0,0 +1,9 @@
+export { Button, IconButton } from './components/button/index.js';
+export type { ButtonContent, ButtonIcon, ButtonProps, ButtonVariant, IconButtonProps, } from './components/button/index.js';
+export { Card } from './components/card/index.js';
+export type { CardProps } from './components/card/index.js';
+export { List, ListItem } from './components/list/index.js';
+export type { ListItemProps, ListProps } from './components/list/index.js';
+export { Accordion, AccordionGroup } from './components/accordion/index.js';
+export type { AccordionGroupProps, AccordionProps } from './components/accordion/index.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAClE,YAAY,EACV,aAAa,EACb,UAAU,EACV,WAAW,EACX,aAAa,EACb,eAAe,GAChB,MAAM,8BAA8B,CAAC;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAClD,YAAY,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE5D,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAC5D,YAAY,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE3E,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAC5E,YAAY,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC"}

package/dist/index.js

@@ -0,0 +1,8 @@
+import Button from "./components/button/Button.js";
+import IconButton from "./components/button/IconButton.js";
+import Card from "./components/card/Card.js";
+import List from "./components/list/List.js";
+import ListItem from "./components/list/ListItem.js";
+import Accordion from "./components/accordion/Accordion.js";
+import AccordionGroup from "./components/accordion/AccordionGroup.js";
+export { Accordion, AccordionGroup, Button, Card, IconButton, List, ListItem };

package/dist/list.css

@@ -0,0 +1,121 @@
+@layer chayns.components {
+  .chayns-list {
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: column;
+    margin: 0;
+    padding: 0;
+    list-style: none;
+  }
+
+  .chayns-list-item {
+    position: relative;
+    display: flex;
+    align-items: stretch;
+  }
+
+  .chayns-list-item__action {
+    box-sizing: border-box;
+    flex: 1;
+    min-inline-size: 0;
+    display: flex;
+    align-items: center;
+    gap: var(--k12);
+    margin: 0;
+    padding: var(--k10) var(--k16);
+    border: 0;
+    border-radius: 10px;
+    background: transparent;
+    font: inherit;
+    font-size: var(--fs-body);
+    color: var(--text);
+    text-align: start;
+    text-decoration: none;
+  }
+
+  .chayns-list-item__action--interactive {
+    cursor: pointer;
+    transition: background 0.16s ease;
+  }
+
+  .chayns-list-item__action--interactive:disabled {
+    cursor: not-allowed;
+    color: var(--disabled-fg);
+  }
+
+  .chayns-list-item__action--interactive:focus-visible {
+    outline: none;
+    box-shadow: 0 0 0 var(--focus-ring-size)
+      rgb(var(--focus-ring-rgb), var(--focus-ring-alpha-strong));
+  }
+
+  .chayns-list-item__leading {
+    flex: none;
+    display: flex;
+    align-items: center;
+  }
+
+  .chayns-list-item__body {
+    min-inline-size: 0;
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .chayns-list-item__title {
+    min-inline-size: 0;
+    overflow: hidden;
+    color: var(--text);
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+
+  .chayns-list-item__subtitle {
+    min-inline-size: 0;
+    overflow: hidden;
+    font-size: var(--fs-meta);
+    color: var(--text-3);
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+
+  .chayns-list-item__unread {
+    flex: none;
+    inline-size: var(--k8);
+    block-size: var(--k8);
+    border-radius: 50%;
+    background: var(--accent);
+  }
+
+  .chayns-list-item__trailing {
+    flex: none;
+    display: flex;
+    align-items: center;
+    gap: var(--k8);
+    padding-inline-end: var(--k16);
+  }
+
+  .chayns-visually-hidden {
+    position: absolute;
+    inline-size: 1px;
+    block-size: 1px;
+    margin: -1px;
+    padding: 0;
+    overflow: hidden;
+    clip-path: inset(50%);
+    white-space: nowrap;
+    border: 0;
+  }
+
+  @media (hover: hover) {
+    .chayns-list-item__action--interactive:hover:not(:disabled) {
+      background: var(--hover);
+    }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .chayns-list-item__action--interactive {
+      transition: none;
+    }
+  }
+}

package/dist/styles.css

@@ -0,0 +1,4 @@
+@import url('./button.css');
+@import url('./card.css');
+@import url('./list.css');
+@import url('./accordion.css');

package/package.json

@@ -0,0 +1,57 @@
+{
+  "name": "@chayns-ui/core",
+  "version": "0.2.0",
+  "description": "Accessible React core components for chayns UI",
+  "license": "MIT",
+  "type": "module",
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "files": [
+    "dist",
+    "LICENSE",
+    "README.md"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./button": {
+      "types": "./dist/components/button/index.d.ts",
+      "import": "./dist/components/button/index.js"
+    },
+    "./button.css": "./dist/button.css",
+    "./card": {
+      "types": "./dist/components/card/index.d.ts",
+      "import": "./dist/components/card/index.js"
+    },
+    "./card.css": "./dist/card.css",
+    "./list": {
+      "types": "./dist/components/list/index.d.ts",
+      "import": "./dist/components/list/index.js"
+    },
+    "./list.css": "./dist/list.css",
+    "./accordion": {
+      "types": "./dist/components/accordion/index.d.ts",
+      "import": "./dist/components/accordion/index.js"
+    },
+    "./accordion.css": "./dist/accordion.css",
+    "./styles.css": "./dist/styles.css",
+    "./package.json": "./package.json"
+  },
+  "peerDependencies": {
+    "react": ">=19.2 <20"
+  },
+  "engines": {
+    "node": ">=24"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "vite build && node ../../tooling/copy-core-css.mjs && tsc -b tsconfig.build.json --force",
+    "clean": "node ../../tooling/clean-package.mjs core",
+    "typecheck": "tsc -p tsconfig.json --noEmit"
+  }
+}