@spark-ui/components 11.1.0 → 11.1.2

package/dist/DialogTrigger-woU7vsJi.d.ts

@@ -0,0 +1,142 @@
+import { Dialog as Dialog$1 } from 'radix-ui';
+import { ReactElement, ReactNode, Ref } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+
+interface DialogProps {
+    /**
+     * Children of the component.
+     */
+    children?: Dialog$1.DialogProps['children'];
+    /**
+     * Specifies if the dialog is open or not.
+     */
+    open?: Dialog$1.DialogProps['open'];
+    /**
+     * Default open state.
+     */
+    defaultOpen?: Dialog$1.DialogProps['defaultOpen'];
+    /**
+     * Handler executen on every dialog open state change.
+     */
+    onOpenChange?: Dialog$1.DialogProps['onOpenChange'];
+    /**
+     * Specifies if the dialog is a modal.
+     */
+    modal?: Dialog$1.DialogProps['modal'];
+    /**
+     * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).
+     */
+    withFade?: boolean;
+}
+declare const Dialog: {
+    ({ children, withFade, ...rest }: DialogProps): ReactElement;
+    displayName: string;
+};
+
+interface BodyProps {
+    children: ReactNode;
+    className?: string;
+    tabIndex?: number;
+    ref?: Ref<HTMLDivElement>;
+    inset?: boolean;
+}
+declare const Body: {
+    ({ children, className, inset, ref: forwardedRef, ...rest }: BodyProps): ReactElement;
+    displayName: string;
+};
+
+type CloseProps = Dialog$1.DialogCloseProps & {
+    ref?: Ref<HTMLButtonElement>;
+};
+declare const Close: {
+    (props: CloseProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+declare const dialogContentStyles: (props?: ({
+    size?: "fullscreen" | "sm" | "md" | "lg" | null | undefined;
+    isNarrow?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type DialogContentStylesProps = VariantProps<typeof dialogContentStyles>;
+
+interface ContentProps extends Dialog$1.DialogContentProps, DialogContentStylesProps {
+    /**
+     * When set to true, the content will adjust its width to fit the content rather than taking up the full available width.
+     */
+    isNarrow?: boolean;
+    ref?: Ref<HTMLDivElement>;
+}
+declare const Content: {
+    ({ children, className, isNarrow, size, onInteractOutside, ref, ...rest }: ContentProps): ReactElement;
+    displayName: string;
+};
+
+type DescriptionProps = Dialog$1.DialogDescriptionProps & {
+    ref?: Ref<HTMLParagraphElement>;
+};
+declare const Description: {
+    (props: DescriptionProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface FooterProps {
+    children: ReactNode;
+    className?: string;
+    ref?: Ref<HTMLDivElement>;
+}
+declare const Footer: {
+    ({ children, className, ref, ...rest }: FooterProps): ReactElement;
+    displayName: string;
+};
+
+interface HeaderProps {
+    children: ReactNode;
+    className?: string;
+    ref?: Ref<HTMLDivElement>;
+}
+declare const Header: {
+    ({ children, className, ref, ...rest }: HeaderProps): ReactElement;
+    displayName: string;
+};
+
+type OverlayProps = Dialog$1.DialogOverlayProps & {
+    ref?: Ref<HTMLDivElement>;
+};
+declare const Overlay: {
+    ({ className, ref, ...rest }: OverlayProps): ReactElement | null;
+    displayName: string;
+};
+
+type PortalProps = Dialog$1.DialogPortalProps;
+declare const Portal: {
+    ({ children, ...rest }: PortalProps): ReactElement;
+    displayName: string;
+};
+
+type TitleProps = Dialog$1.DialogTitleProps & {
+    ref?: Ref<HTMLHeadingElement>;
+};
+declare const Title: {
+    ({ className, ref, ...others }: TitleProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface TriggerProps {
+    /**
+     * Children of the component.
+     */
+    children?: ReactNode;
+    /**
+     * Change the component to the HTML tag or custom component of the only child.
+     */
+    asChild?: Dialog$1.DialogTriggerProps['asChild'];
+    ref?: Ref<HTMLButtonElement>;
+}
+declare const Trigger: {
+    (props: TriggerProps): ReactElement;
+    displayName: string;
+};
+
+export { Body as B, type CloseProps as C, Dialog as D, Footer as F, Header as H, Overlay as O, Portal as P, Trigger as T, Content as a, Close as b, Title as c, Description as d, type DialogProps as e, type ContentProps as f, type HeaderProps as g, type BodyProps as h, type FooterProps as i, type TriggerProps as j, type OverlayProps as k, type PortalProps as l, type TitleProps as m, type DescriptionProps as n };

package/dist/Input-N8AWWSmt.d.ts

@@ -0,0 +1,41 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { PropsWithChildren, ComponentPropsWithoutRef, Ref } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+
+declare const inputGroupStyles: (props?: ({
+    disabled?: boolean | null | undefined;
+    readOnly?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type InputGroupStylesProps = VariantProps<typeof inputGroupStyles>;
+
+interface InputGroupProps extends ComponentPropsWithoutRef<'div'>, InputGroupStylesProps {
+    /**
+     * Use `state` prop to assign a specific state to the group, choosing from: `error`, `alert` and `success`. By doing so, the outline styles will be updated.
+     */
+    state?: 'error' | 'alert' | 'success';
+    /**
+     * Function handler to be executed after the input has been cleared.
+     */
+    onClear?: () => void;
+    ref?: Ref<HTMLDivElement>;
+}
+declare const InputGroup: {
+    ({ className, children: childrenProp, state: stateProp, disabled: disabledProp, readOnly: readOnlyProp, onClear, ref: forwardedRef, ...others }: PropsWithChildren<InputGroupProps>): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+type InputPrimitiveProps = ComponentPropsWithoutRef<'input'>;
+interface InputProps extends InputPrimitiveProps {
+    asChild?: boolean;
+    onValueChange?: (value: string) => void;
+    ref?: Ref<HTMLInputElement>;
+}
+declare const Input: {
+    ({ className, asChild, onValueChange, onChange, onKeyDown, disabled: disabledProp, readOnly: readOnlyProp, ref, ...others }: InputProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+} & {
+    id: string;
+};
+
+export { type InputGroupProps as I, type InputProps as a, InputGroup as b, Input as c };

package/dist/InputTrailingIcon-ZZx8PoJy.d.ts

@@ -0,0 +1,20 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { IconProps } from './icon/index.js';
+
+type InputIconProps = IconProps;
+
+type InputLeadingIconProps = InputIconProps;
+declare const InputLeadingIcon: {
+    ({ className, ...others }: InputLeadingIconProps): react_jsx_runtime.JSX.Element;
+    id: string;
+    displayName: string;
+};
+
+type InputTrailingIconProps = InputIconProps;
+declare const InputTrailingIcon: {
+    ({ className, ...others }: InputTrailingIconProps): react_jsx_runtime.JSX.Element;
+    id: string;
+    displayName: string;
+};
+
+export { type InputLeadingIconProps as I, type InputTrailingIconProps as a, InputLeadingIcon as b, InputTrailingIcon as c };

package/dist/LabelRequiredIndicator-DRnCzHMU.d.ts

@@ -0,0 +1,19 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Label as Label$1 } from 'radix-ui';
+import { Ref, ComponentPropsWithRef } from 'react';
+
+type LabelProps = Label$1.LabelProps & {
+    ref?: Ref<HTMLLabelElement>;
+};
+declare const Label: {
+    ({ className, ref, ...others }: LabelProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+type LabelRequiredIndicatorProps = ComponentPropsWithRef<'span'>;
+declare const LabelRequiredIndicator: {
+    ({ className, children, ref, ...others }: LabelRequiredIndicatorProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+export { Label as L, LabelRequiredIndicator as a, type LabelProps as b, type LabelRequiredIndicatorProps as c };

package/dist/accordion/index.d.ts

@@ -0,0 +1,73 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Accordion as Accordion$2 } from '@base-ui-components/react/accordion';
+import { ComponentProps, Ref } from 'react';
+
+type ExtentedZagInterface$3 = Omit<ComponentProps<typeof Accordion$2.Root>, 'openMultiple' | 'render'>;
+interface AccordionProps extends ExtentedZagInterface$3 {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     */
+    asChild?: boolean;
+    /**
+     * Whether the accordion items are disabled
+     */
+    disabled?: boolean;
+    /**
+     * Whether multiple items can be open at the same time.
+     */
+    multiple?: boolean;
+    design?: 'filled' | 'outlined';
+    ref?: Ref<HTMLDivElement>;
+}
+declare const Accordion$1: {
+    ({ asChild, children, design, hiddenUntilFound, multiple, className, ref, ...props }: AccordionProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+type ExtentedZagInterface$2 = Omit<ComponentProps<typeof Accordion$2.Item>, 'render'>;
+interface AccordionItemProps extends ExtentedZagInterface$2 {
+    asChild?: boolean;
+    ref?: Ref<HTMLDivElement>;
+}
+declare const Item: {
+    ({ asChild, className, children, ref, ...props }: AccordionItemProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+type ExtentedZagInterface$1 = Omit<ComponentProps<typeof Accordion$2.Panel>, 'render'>;
+interface AccordionItemContentProps extends ExtentedZagInterface$1 {
+    asChild?: boolean;
+    ref?: Ref<HTMLDivElement>;
+}
+declare const ItemContent: {
+    ({ asChild, className, children, ref, ...props }: AccordionItemContentProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface AccordionItemHeaderProps extends ComponentProps<'h3'> {
+    asChild?: boolean;
+    ref?: Ref<HTMLHeadingElement>;
+}
+declare const ItemHeader: {
+    ({ asChild, children, className, ref, }: AccordionItemHeaderProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+type ExtentedZagInterface = Omit<ComponentProps<typeof Accordion$2.Trigger>, 'render'>;
+interface AccordionItemTriggerProps extends ExtentedZagInterface {
+    asChild?: boolean;
+    ref?: Ref<HTMLButtonElement>;
+}
+declare const ItemTrigger: {
+    ({ asChild, children, className, ref, ...props }: AccordionItemTriggerProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+declare const Accordion: typeof Accordion$1 & {
+    Item: typeof Item;
+    ItemHeader: typeof ItemHeader;
+    ItemTrigger: typeof ItemTrigger;
+    ItemContent: typeof ItemContent;
+};
+
+export { Accordion, type AccordionItemContentProps, type AccordionItemHeaderProps, type AccordionItemTriggerProps, type AccordionProps };

package/dist/accordion/index.js

@@ -0,0 +1,325 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/accordion/index.ts
+var accordion_exports = {};
+__export(accordion_exports, {
+  Accordion: () => Accordion2
+});
+module.exports = __toCommonJS(accordion_exports);
+
+// src/accordion/Accordion.tsx
+var import_accordion = require("@base-ui-components/react/accordion");
+var import_class_variance_authority = require("class-variance-authority");
+var import_react2 = require("react");
+
+// src/slot/Slot.tsx
+var import_radix_ui = require("radix-ui");
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var Slottable = import_radix_ui.Slot.Slottable;
+var Slot = ({ ref, ...props }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Slot.Root, { ref, ...props });
+};
+
+// src/accordion/useRenderSlot.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function useRenderSlot(asChild, defaultTag) {
+  const Component = asChild ? Slot : defaultTag;
+  return asChild ? ({ ...props }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Component, { ...props }) : void 0;
+}
+
+// src/accordion/Accordion.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var AccordionContext = (0, import_react2.createContext)(null);
+var Accordion = ({
+  asChild = false,
+  children,
+  design = "outlined",
+  hiddenUntilFound = true,
+  multiple = false,
+  className,
+  ref,
+  ...props
+}) => {
+  const renderSlot = useRenderSlot(asChild, "div");
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(AccordionContext.Provider, { value: { design }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    import_accordion.Accordion.Root,
+    {
+      "data-spark-component": "accordion",
+      ref,
+      openMultiple: multiple,
+      hiddenUntilFound,
+      className: (0, import_class_variance_authority.cx)("bg-surface h-fit rounded-lg", className),
+      render: renderSlot,
+      ...props,
+      children
+    }
+  ) });
+};
+Accordion.displayName = "Accordion";
+var useAccordionContext = () => {
+  const context = (0, import_react2.useContext)(AccordionContext);
+  if (!context) {
+    throw Error("useAccordionContext must be used within a Accordion provider");
+  }
+  return context;
+};
+
+// src/accordion/AccordionItem.tsx
+var import_accordion2 = require("@base-ui-components/react/accordion");
+var import_class_variance_authority2 = require("class-variance-authority");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var Item = ({
+  asChild = false,
+  className,
+  children,
+  ref,
+  ...props
+}) => {
+  const accordion = useAccordionContext();
+  const renderSlot = useRenderSlot(asChild, "div");
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    import_accordion2.Accordion.Item,
+    {
+      ref,
+      "data-spark-component": "accordion-item",
+      render: renderSlot,
+      className: (0, import_class_variance_authority2.cx)(
+        "relative first:rounded-t-lg last:rounded-b-lg",
+        "not-last:border-b-0",
+        { "border-sm border-outline": accordion.design === "outlined" },
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+};
+Item.displayName = "Accordion.Item";
+
+// src/accordion/AccordionItemContent.tsx
+var import_accordion3 = require("@base-ui-components/react/accordion");
+var import_class_variance_authority3 = require("class-variance-authority");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var ItemContent = ({
+  asChild = false,
+  className,
+  children,
+  ref,
+  ...props
+}) => {
+  const renderSlot = useRenderSlot(asChild, "div");
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    import_accordion3.Accordion.Panel,
+    {
+      ref,
+      "data-spark-component": "accordion-item-content",
+      className: (0, import_class_variance_authority3.cx)(
+        "[&>:first-child]:p-lg overflow-hidden",
+        "h-[var(--accordion-panel-height)] transition-all duration-200 data-[ending-style]:h-0 data-[starting-style]:h-0",
+        "text-body-1 text-on-surface",
+        className
+      ),
+      render: renderSlot,
+      ...props,
+      children
+    }
+  );
+};
+ItemContent.displayName = "Accordion.ItemContent";
+
+// src/accordion/AccordionItemHeader.tsx
+var import_class_variance_authority4 = require("class-variance-authority");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var ItemHeader = ({
+  asChild = false,
+  children,
+  className,
+  ref
+}) => {
+  const Component = asChild ? Slot : "h3";
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    Component,
+    {
+      ref,
+      "data-spark-component": "accordion-item-header",
+      className: (0, import_class_variance_authority4.cx)("rounded-[inherit]", className),
+      children
+    }
+  );
+};
+ItemHeader.displayName = "Accordion.ItemHeader";
+
+// src/accordion/AccordionItemTrigger.tsx
+var import_accordion4 = require("@base-ui-components/react/accordion");
+var import_ArrowHorizontalDown = require("@spark-ui/icons/ArrowHorizontalDown");
+var import_class_variance_authority6 = require("class-variance-authority");
+
+// src/icon/Icon.tsx
+var import_react3 = require("react");
+
+// src/visually-hidden/VisuallyHidden.tsx
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var VisuallyHidden = ({ asChild = false, ref, ...props }) => {
+  const Component = asChild ? Slot : "span";
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    Component,
+    {
+      ...props,
+      ref,
+      style: {
+        // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss
+        position: "absolute",
+        border: 0,
+        width: 1,
+        height: 1,
+        padding: 0,
+        margin: -1,
+        overflow: "hidden",
+        clip: "rect(0, 0, 0, 0)",
+        whiteSpace: "nowrap",
+        wordWrap: "normal",
+        ...props.style
+      }
+    }
+  );
+};
+VisuallyHidden.displayName = "VisuallyHidden";
+
+// src/icon/Icon.styles.tsx
+var import_internal_utils = require("@spark-ui/internal-utils");
+var import_class_variance_authority5 = require("class-variance-authority");
+var iconStyles = (0, import_class_variance_authority5.cva)(["fill-current shrink-0"], {
+  variants: {
+    /**
+     * Color scheme of the icon.
+     */
+    intent: (0, import_internal_utils.makeVariants)({
+      current: ["text-current"],
+      main: ["text-main"],
+      support: ["text-support"],
+      accent: ["text-accent"],
+      basic: ["text-basic"],
+      success: ["text-success"],
+      alert: ["text-alert"],
+      error: ["text-error"],
+      info: ["text-info"],
+      neutral: ["text-neutral"]
+    }),
+    /**
+     * Sets the size of the icon.
+     */
+    size: (0, import_internal_utils.makeVariants)({
+      current: ["u-current-font-size"],
+      sm: ["w-sz-16", "h-sz-16"],
+      md: ["w-sz-24", "h-sz-24"],
+      lg: ["w-sz-32", "h-sz-32"],
+      xl: ["w-sz-40", "h-sz-40"]
+    })
+  }
+});
+
+// src/icon/Icon.tsx
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var Icon = ({
+  label,
+  className,
+  size = "current",
+  intent = "current",
+  children,
+  ...others
+}) => {
+  const child = import_react3.Children.only(children);
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
+    (0, import_react3.cloneElement)(child, {
+      className: iconStyles({ className, size, intent }),
+      "data-spark-component": "icon",
+      "aria-hidden": "true",
+      focusable: "false",
+      ...others
+    }),
+    label && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(VisuallyHidden, { children: label })
+  ] });
+};
+Icon.displayName = "Icon";
+
+// src/accordion/AccordionItemTrigger.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var ItemTrigger = ({
+  asChild = false,
+  children,
+  className,
+  ref,
+  ...props
+}) => {
+  const renderSlot = useRenderSlot(asChild, "button");
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+    import_accordion4.Accordion.Trigger,
+    {
+      ref,
+      "data-spark-component": "accordion-item-trigger",
+      render: renderSlot,
+      className: (0, import_class_variance_authority6.cx)(
+        "group",
+        "gap-lg min-h-sz-48 relative flex items-center justify-between",
+        "px-lg py-md text-headline-2 text-on-surface data-[panel-open]:rounded-b-0 w-full rounded-[inherit] text-left",
+        "hover:enabled:bg-surface-hovered focus:bg-surface-hovered",
+        "focus-visible:u-outline focus-visible:z-raised focus-visible:outline-hidden",
+        "disabled:opacity-dim-3 cursor-pointer disabled:cursor-not-allowed",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "gap-lg flex grow items-center", children }),
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+          Icon,
+          {
+            intent: "neutral",
+            className: (0, import_class_variance_authority6.cx)(
+              "shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none",
+              "group-data-[panel-open]:rotate-180"
+            ),
+            size: "sm",
+            children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_ArrowHorizontalDown.ArrowHorizontalDown, {})
+          }
+        )
+      ]
+    }
+  );
+};
+ItemTrigger.displayName = "Accordion.ItemTrigger";
+
+// src/accordion/index.ts
+var Accordion2 = Object.assign(Accordion, {
+  Item,
+  ItemHeader,
+  ItemTrigger,
+  ItemContent
+});
+Accordion2.displayName = "Accordion";
+Item.displayName = "Item";
+ItemHeader.displayName = "ItemHeader";
+ItemTrigger.displayName = "Accordion.Trigger";
+ItemContent.displayName = "Accordion.Content";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Accordion
+});
+//# sourceMappingURL=index.js.map

package/dist/accordion/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/accordion/index.ts","../../src/accordion/Accordion.tsx","../../src/slot/Slot.tsx","../../src/accordion/useRenderSlot.tsx","../../src/accordion/AccordionItem.tsx","../../src/accordion/AccordionItemContent.tsx","../../src/accordion/AccordionItemHeader.tsx","../../src/accordion/AccordionItemTrigger.tsx","../../src/icon/Icon.tsx","../../src/visually-hidden/VisuallyHidden.tsx","../../src/icon/Icon.styles.tsx"],"sourcesContent":["import { Accordion as Root } from './Accordion'\nimport { Item } from './AccordionItem'\nimport { ItemContent } from './AccordionItemContent'\nimport { ItemHeader } from './AccordionItemHeader'\nimport { ItemTrigger } from './AccordionItemTrigger'\n\nexport const Accordion: typeof Root & {\n  Item: typeof Item\n  ItemHeader: typeof ItemHeader\n  ItemTrigger: typeof ItemTrigger\n  ItemContent: typeof ItemContent\n} = Object.assign(Root, {\n  Item,\n  ItemHeader,\n  ItemTrigger,\n  ItemContent,\n})\n\nAccordion.displayName = 'Accordion'\nItem.displayName = 'Item'\nItemHeader.displayName = 'ItemHeader'\nItemTrigger.displayName = 'Accordion.Trigger'\nItemContent.displayName = 'Accordion.Content'\n\nexport { type AccordionProps } from './Accordion'\nexport { type AccordionItemHeaderProps } from './AccordionItemHeader'\nexport { type AccordionItemContentProps } from './AccordionItemContent'\nexport { type AccordionItemTriggerProps } from './AccordionItemTrigger'\n","import { Accordion as BaseAccordion } from '@base-ui-components/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, createContext, Ref, useContext } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<\n  ComponentProps<typeof BaseAccordion.Root>,\n  'openMultiple' | 'render'\n>\n\nexport interface AccordionProps extends ExtentedZagInterface {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  /**\n   * Whether the accordion items are disabled\n   */\n  disabled?: boolean\n  /**\n   * Whether multiple items can be open at the same time.\n   */\n  multiple?: boolean\n  design?: 'filled' | 'outlined'\n  ref?: Ref<HTMLDivElement>\n}\n\nconst AccordionContext = createContext<{\n  design: 'filled' | 'outlined'\n} | null>(null)\n\nexport const Accordion = ({\n  asChild = false,\n  children,\n  design = 'outlined',\n  hiddenUntilFound = true,\n  multiple = false,\n  className,\n  ref,\n  ...props\n}: AccordionProps) => {\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <AccordionContext.Provider value={{ design }}>\n      <BaseAccordion.Root\n        data-spark-component=\"accordion\"\n        ref={ref}\n        openMultiple={multiple}\n        hiddenUntilFound={hiddenUntilFound}\n        className={cx('bg-surface h-fit rounded-lg', className)}\n        render={renderSlot}\n        {...props}\n      >\n        {children}\n      </BaseAccordion.Root>\n    </AccordionContext.Provider>\n  )\n}\n\nAccordion.displayName = 'Accordion'\n\nexport const useAccordionContext = () => {\n  const context = useContext(AccordionContext)\n\n  if (!context) {\n    throw Error('useAccordionContext must be used within a Accordion provider')\n  }\n\n  return context\n}\n","import { Slot as RadixSlot } from 'radix-ui'\nimport {\n  cloneElement,\n  HTMLAttributes,\n  isValidElement,\n  PropsWithChildren,\n  ReactNode,\n  Ref,\n} from 'react'\n\nexport const Slottable: typeof RadixSlot.Slottable = RadixSlot.Slottable\n\nexport type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n  ref?: Ref<HTMLElement>\n}\n\nexport const Slot = ({ ref, ...props }: SlotProps) => {\n  return <RadixSlot.Root ref={ref} {...props} />\n}\n\n/**\n * When using Radix `Slot` component, it will consider its first child to merge its props with.\n * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.\n */\nexport const wrapPolymorphicSlot = (\n  asChild: boolean | undefined,\n  children: ReactNode,\n  callback: (children: ReactNode) => ReactNode\n) => {\n  if (!asChild) return callback(children) // If polymorphic behaviour is not used, we keep the original children\n\n  return isValidElement(children)\n    ? cloneElement(\n        children,\n        undefined,\n        callback((children.props as { children: ReactNode }).children)\n      )\n    : null\n}\n","import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n  const Component = asChild ? Slot : defaultTag\n\n  return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { Accordion as BaseAccordion } from '@base-ui-components/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { useAccordionContext } from './Accordion'\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Item>, 'render'>\n\nexport interface AccordionItemProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const Item = ({\n  asChild = false,\n  className,\n  children,\n  ref,\n  ...props\n}: AccordionItemProps) => {\n  const accordion = useAccordionContext()\n\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <BaseAccordion.Item\n      ref={ref}\n      data-spark-component=\"accordion-item\"\n      render={renderSlot}\n      className={cx(\n        'relative first:rounded-t-lg last:rounded-b-lg',\n        'not-last:border-b-0',\n        { 'border-sm border-outline': accordion.design === 'outlined' },\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </BaseAccordion.Item>\n  )\n}\n\nItem.displayName = 'Accordion.Item'\n","import { Accordion as BaseAccordion } from '@base-ui-components/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Panel>, 'render'>\n\nexport interface AccordionItemContentProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const ItemContent = ({\n  asChild = false,\n  className,\n  children,\n  ref,\n  ...props\n}: AccordionItemContentProps) => {\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <BaseAccordion.Panel\n      ref={ref}\n      data-spark-component=\"accordion-item-content\"\n      className={cx(\n        '[&>:first-child]:p-lg overflow-hidden',\n        'h-[var(--accordion-panel-height)] transition-all duration-200 data-[ending-style]:h-0 data-[starting-style]:h-0',\n        'text-body-1 text-on-surface',\n        className\n      )}\n      render={renderSlot}\n      {...props}\n    >\n      {children}\n    </BaseAccordion.Panel>\n  )\n}\n\nItemContent.displayName = 'Accordion.ItemContent'\n","import { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport interface AccordionItemHeaderProps extends ComponentProps<'h3'> {\n  asChild?: boolean\n  ref?: Ref<HTMLHeadingElement>\n}\n\nexport const ItemHeader = ({\n  asChild = false,\n  children,\n  className,\n  ref,\n}: AccordionItemHeaderProps) => {\n  const Component = asChild ? Slot : 'h3'\n\n  return (\n    <Component\n      ref={ref}\n      data-spark-component=\"accordion-item-header\"\n      className={cx('rounded-[inherit]', className)}\n    >\n      {children}\n    </Component>\n  )\n}\n\nItemHeader.displayName = 'Accordion.ItemHeader'\n","import { Accordion as BaseAccordion } from '@base-ui-components/react/accordion'\nimport { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Trigger>, 'render'>\n\nexport interface AccordionItemTriggerProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const ItemTrigger = ({\n  asChild = false,\n  children,\n  className,\n  ref,\n  ...props\n}: AccordionItemTriggerProps) => {\n  const renderSlot = useRenderSlot(asChild, 'button')\n\n  return (\n    <BaseAccordion.Trigger\n      ref={ref}\n      data-spark-component=\"accordion-item-trigger\"\n      render={renderSlot}\n      className={cx(\n        'group',\n        'gap-lg min-h-sz-48 relative flex items-center justify-between',\n        'px-lg py-md text-headline-2 text-on-surface data-[panel-open]:rounded-b-0 w-full rounded-[inherit] text-left',\n        'hover:enabled:bg-surface-hovered focus:bg-surface-hovered',\n        'focus-visible:u-outline focus-visible:z-raised focus-visible:outline-hidden',\n        'disabled:opacity-dim-3 cursor-pointer disabled:cursor-not-allowed',\n        className\n      )}\n      {...props}\n    >\n      <div className=\"gap-lg flex grow items-center\">{children}</div>\n      <Icon\n        intent=\"neutral\"\n        className={cx(\n          'shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none',\n          'group-data-[panel-open]:rotate-180'\n        )}\n        size=\"sm\"\n      >\n        <ArrowHorizontalDown />\n      </Icon>\n    </BaseAccordion.Trigger>\n  )\n}\n\nItemTrigger.displayName = 'Accordion.ItemTrigger'\n","import { Children, cloneElement, ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react'\n\nimport { VisuallyHidden } from '../visually-hidden'\nimport { iconStyles, IconVariantsProps } from './Icon.styles'\n\nexport interface IconProps extends IconVariantsProps, ComponentPropsWithoutRef<'svg'> {\n  /**\n   * The svg icon that will be wrapped\n   */\n  children: ReactNode\n  /**\n   * The accessible label for the icon. This label will be visually hidden but announced to screen\n   * reader users, similar to `alt` text for `img` tags.\n   */\n  label?: string\n}\n\nexport const Icon = ({\n  label,\n  className,\n  size = 'current',\n  intent = 'current',\n  children,\n  ...others\n}: IconProps) => {\n  const child = Children.only(children)\n\n  return (\n    <>\n      {cloneElement(child as ReactElement<Record<string, any>>, {\n        className: iconStyles({ className, size, intent }),\n        'data-spark-component': 'icon',\n        'aria-hidden': 'true',\n        focusable: 'false',\n        ...others,\n      })}\n\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n    </>\n  )\n}\n\nIcon.displayName = 'Icon'\n","import { HTMLAttributes, PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport type VisuallyHiddenProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLElement>\n}\n\nexport const VisuallyHidden = ({ asChild = false, ref, ...props }: VisuallyHiddenProps) => {\n  const Component = asChild ? Slot : 'span'\n\n  return (\n    <Component\n      {...props}\n      ref={ref}\n      style={{\n        // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss\n        position: 'absolute',\n        border: 0,\n        width: 1,\n        height: 1,\n        padding: 0,\n        margin: -1,\n        overflow: 'hidden',\n        clip: 'rect(0, 0, 0, 0)',\n        whiteSpace: 'nowrap',\n        wordWrap: 'normal',\n        ...props.style,\n      }}\n    />\n  )\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const iconStyles = cva(['fill-current shrink-0'], {\n  variants: {\n    /**\n     * Color scheme of the icon.\n     */\n    intent: makeVariants<\n      'intent',\n      [\n        'current',\n        'main',\n        'support',\n        'accent',\n        'basic',\n        'success',\n        'alert',\n        'error',\n        'info',\n        'neutral',\n      ]\n    >({\n      current: ['text-current'],\n      main: ['text-main'],\n      support: ['text-support'],\n      accent: ['text-accent'],\n      basic: ['text-basic'],\n      success: ['text-success'],\n      alert: ['text-alert'],\n      error: ['text-error'],\n      info: ['text-info'],\n      neutral: ['text-neutral'],\n    }),\n    /**\n     * Sets the size of the icon.\n     */\n    size: makeVariants<'size', ['current', 'sm', 'md', 'lg', 'xl']>({\n      current: ['u-current-font-size'],\n      sm: ['w-sz-16', 'h-sz-16'],\n      md: ['w-sz-24', 'h-sz-24'],\n      lg: ['w-sz-32', 'h-sz-32'],\n      xl: ['w-sz-40', 'h-sz-40'],\n    }),\n  },\n})\n\nexport type IconVariantsProps = VariantProps<typeof iconStyles>\n"],"mappings":"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","names":["Accordion","import_react","RadixSlot","import_jsx_runtime","import_jsx_runtime","BaseAccordion","import_accordion","import_class_variance_authority","import_jsx_runtime","BaseAccordion","import_accordion","import_class_variance_authority","import_jsx_runtime","BaseAccordion","import_class_variance_authority","import_jsx_runtime","import_accordion","import_class_variance_authority","import_react","import_jsx_runtime","import_class_variance_authority","import_jsx_runtime","import_jsx_runtime","BaseAccordion","Accordion"]}