@acmekit/ui 4.1.1

package/dist/cjs/components/calendar/calendar.js

@@ -0,0 +1,63 @@
+"use strict";
+"use client";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Calendar = void 0;
+const tslib_1 = require("tslib");
+const date_1 = require("@internationalized/date");
+const icons_1 = require("@acmekit/icons");
+const React = tslib_1.__importStar(require("react"));
+const react_aria_1 = require("react-aria");
+const react_stately_1 = require("react-stately");
+const calendar_1 = require("../../utils/calendar");
+const calendar_button_1 = require("./calendar-button");
+const calendar_grid_1 = require("./calendar-grid");
+/**
+ * Calendar component used to select a date.
+ * Its props are based on [React Aria Calendar](https://react-spectrum.adobe.com/react-aria/Calendar.html#calendar-1).
+ *
+ * @excludeExternal
+ */
+const Calendar = (props) => {
+    const [value, setValue] = React.useState(() => (0, calendar_1.getDefaultCalendarDate)(props.value, props.defaultValue));
+    const { locale } = (0, react_aria_1.useLocale)();
+    const _props = React.useMemo(() => convertProps(props, setValue), [props]);
+    const state = (0, react_stately_1.useCalendarState)({
+        ..._props,
+        value,
+        locale,
+        createCalendar: date_1.createCalendar,
+    });
+    React.useEffect(() => {
+        setValue(props.value ? (0, calendar_1.updateCalendarDate)(value, props.value) : null);
+    }, [props.value]);
+    const { calendarProps, prevButtonProps, nextButtonProps, title } = (0, react_aria_1.useCalendar)({ value, ..._props }, state);
+    return (React.createElement("div", { ...calendarProps, className: "flex flex-col gap-y-2" },
+        React.createElement("div", { className: "bg-ui-bg-field border-base grid grid-cols-[28px_1fr_28px] items-center gap-1 rounded-md border p-0.5" },
+            React.createElement(calendar_button_1.CalendarButton, { ...prevButtonProps },
+                React.createElement(icons_1.TriangleLeftMini, null)),
+            React.createElement("div", { className: "flex items-center justify-center" },
+                React.createElement("h2", { className: "txt-compact-small-plus" }, title)),
+            React.createElement(calendar_button_1.CalendarButton, { ...nextButtonProps },
+                React.createElement(icons_1.TriangleRightMini, null))),
+        React.createElement(calendar_grid_1.CalendarGrid, { state: state })));
+};
+exports.Calendar = Calendar;
+function convertProps(props, setValue) {
+    const { minValue, maxValue, isDateUnavailable: _isDateUnavailable, onChange: _onChange, value: __value__, defaultValue: __defaultValue__, ...rest } = props;
+    const onChange = (value) => {
+        setValue(value);
+        _onChange === null || _onChange === void 0 ? void 0 : _onChange(value ? value.toDate((0, date_1.getLocalTimeZone)()) : null);
+    };
+    const isDateUnavailable = (date) => {
+        const _date = date.toDate((0, date_1.getLocalTimeZone)());
+        return _isDateUnavailable ? _isDateUnavailable(_date) : false;
+    };
+    return {
+        ...rest,
+        onChange,
+        isDateUnavailable,
+        minValue: minValue ? (0, calendar_1.createCalendarDate)(minValue) : minValue,
+        maxValue: maxValue ? (0, calendar_1.createCalendarDate)(maxValue) : maxValue,
+    };
+}
+//# sourceMappingURL=calendar.js.map

package/dist/cjs/components/calendar/calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.js","sourceRoot":"","sources":["../../../../src/components/calendar/calendar.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport {\n  CalendarDate,\n  createCalendar,\n  getLocalTimeZone\n} from \"@internationalized/date\"\nimport { TriangleLeftMini, TriangleRightMini } from \"@acmekit/icons\"\nimport * as React from \"react\"\nimport {\n  DateValue,\n  useCalendar,\n  useLocale,\n  type CalendarProps as BaseCalendarProps,\n} from \"react-aria\"\nimport { useCalendarState } from \"react-stately\"\n\nimport { createCalendarDate, getDefaultCalendarDate, updateCalendarDate } from \"@/utils/calendar\"\n\nimport { CalendarButton } from \"./calendar-button\"\nimport { CalendarGrid } from \"./calendar-grid\"\n\ninterface CalendarValueProps {\n  /**\n   * The currently selected date.\n   */\n  value?: Date | null\n  /**\n   * The date that is selected when the calendar first mounts (uncontrolled).\n   */\n  defaultValue?: Date | null\n  /**\n   * A function that is triggered when the selected date changes.\n   */\n  onChange?: (value: Date | null) => void\n  /**\n   * A function that determines whether a date is unavailable for selection.\n   */\n  isDateUnavailable?: (date: Date) => boolean\n  /**\n   * The minimum date that can be selected.\n   */\n  minValue?: Date\n  /**\n   * The maximum date that can be selected.\n   */\n  maxValue?: Date\n}\n\ninterface CalendarProps\n  extends Omit<BaseCalendarProps<CalendarDate>, keyof CalendarValueProps>,\n    CalendarValueProps {}\n\n/**\n * Calendar component used to select a date.\n * Its props are based on [React Aria Calendar](https://react-spectrum.adobe.com/react-aria/Calendar.html#calendar-1).\n * \n * @excludeExternal\n */\nconst Calendar = (props: CalendarProps) => {\n  const [value, setValue] = React.useState<CalendarDate  | null | undefined>(\n    () => getDefaultCalendarDate(props.value, props.defaultValue)\n  )\n\n  const { locale } = useLocale()\n  const _props = React.useMemo(() => convertProps(props, setValue), [props])\n\n  const state = useCalendarState({\n    ..._props,\n    value,\n    locale,\n    createCalendar,\n  })\n\n  React.useEffect(() => {\n    setValue(props.value ? updateCalendarDate(value, props.value) : null)\n  }, [props.value])\n\n  const { calendarProps, prevButtonProps, nextButtonProps, title } =\n    useCalendar({ value, ..._props }, state)\n\n  return (\n    <div {...calendarProps} className=\"flex flex-col gap-y-2\">\n      <div className=\"bg-ui-bg-field border-base grid grid-cols-[28px_1fr_28px] items-center gap-1 rounded-md border p-0.5\">\n        <CalendarButton {...prevButtonProps}>\n          <TriangleLeftMini />\n        </CalendarButton>\n        <div className=\"flex items-center justify-center\">\n          <h2 className=\"txt-compact-small-plus\">{title}</h2>\n        </div>\n        <CalendarButton {...nextButtonProps}>\n          <TriangleRightMini />\n        </CalendarButton>\n      </div>\n      <CalendarGrid state={state} />\n    </div>\n  )\n}\n\nfunction convertProps(\n  props: CalendarProps,\n  setValue: React.Dispatch<\n    React.SetStateAction<CalendarDate | null | undefined>\n  >\n): BaseCalendarProps<CalendarDate> {\n  const {\n    minValue,\n    maxValue,\n    isDateUnavailable: _isDateUnavailable,\n    onChange: _onChange,\n    value: __value__,\n    defaultValue: __defaultValue__,\n    ...rest\n  } = props\n\n  const onChange = (value: CalendarDate | null) => {\n    setValue(value)\n    _onChange?.(value ? value.toDate(getLocalTimeZone()) : null)\n  }\n\n  const isDateUnavailable = (date: DateValue) => {\n    const _date = date.toDate(getLocalTimeZone())\n\n    return _isDateUnavailable ? _isDateUnavailable(_date) : false\n  }\n\n  return {\n    ...rest,\n    onChange,\n    isDateUnavailable,\n    minValue: minValue ? createCalendarDate(minValue) : minValue,\n    maxValue: maxValue ? createCalendarDate(maxValue) : maxValue,\n  }\n}\n\nexport { Calendar }\n"]}

package/dist/cjs/components/calendar/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./_internal-calendar";
+export * from "./calendar";
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/calendar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/calendar/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAA;AACpC,cAAc,YAAY,CAAA"}

package/dist/cjs/components/calendar/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./_internal-calendar"), exports);
+tslib_1.__exportStar(require("./calendar"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/calendar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/calendar/index.ts"],"names":[],"mappings":";;;AAAA,+DAAoC;AACpC,qDAA0B","sourcesContent":["export * from \"./_internal-calendar\"\nexport * from \"./calendar\"\n"]}

package/dist/cjs/components/checkbox/checkbox.d.ts

@@ -0,0 +1,11 @@
+import { Checkbox as RadixCheckbox } from "radix-ui";
+import * as React from "react";
+import { CheckboxCheckedState } from "./types";
+/**
+ * This component is based on the [Radix UI Checkbox](https://www.radix-ui.com/primitives/docs/components/checkbox) primitive.
+ */
+declare const Checkbox: React.ForwardRefExoticComponent<Omit<RadixCheckbox.CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
+    checked?: CheckboxCheckedState | undefined;
+} & React.RefAttributes<HTMLButtonElement>>;
+export { Checkbox };
+//# sourceMappingURL=checkbox.d.ts.map

package/dist/cjs/components/checkbox/checkbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,QAAQ,IAAI,aAAa,EAAE,MAAM,UAAU,CAAA;AACpD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAE9C;;GAEG;AACH,QAAA,MAAM,QAAQ;cAGA,oBAAoB,GAAG,SAAS;2CA6B5C,CAAA;AAGF,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/cjs/components/checkbox/checkbox.js

@@ -0,0 +1,20 @@
+"use strict";
+"use client";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Checkbox = void 0;
+const tslib_1 = require("tslib");
+const icons_1 = require("@acmekit/icons");
+const radix_ui_1 = require("radix-ui");
+const React = tslib_1.__importStar(require("react"));
+const clx_1 = require("../../utils/clx");
+/**
+ * This component is based on the [Radix UI Checkbox](https://www.radix-ui.com/primitives/docs/components/checkbox) primitive.
+ */
+const Checkbox = React.forwardRef(({ className, checked, ...props }, ref) => {
+    return (React.createElement(radix_ui_1.Checkbox.Root, { ...props, ref: ref, checked: checked, className: (0, clx_1.clx)("group inline-flex h-5 w-5 items-center justify-center outline-none ", className) },
+        React.createElement("div", { className: (0, clx_1.clx)("text-ui-fg-on-inverted bg-ui-bg-base shadow-borders-base [&_path]:shadow-details-contrast-on-bg-interactive transition-fg h-[15px] w-[15px] rounded-[3px]", "group-disabled:cursor-not-allowed group-disabled:opacity-50", "group-focus-visible:!shadow-borders-interactive-with-focus", "group-hover:group-enabled:group-data-[state=unchecked]:bg-ui-bg-base-hover", "group-data-[state=checked]:bg-ui-bg-interactive group-data-[state=checked]:shadow-borders-interactive-with-shadow", "group-data-[state=indeterminate]:bg-ui-bg-interactive group-data-[state=indeterminate]:shadow-borders-interactive-with-shadow") },
+            React.createElement(radix_ui_1.Checkbox.Indicator, null, checked === "indeterminate" ? React.createElement(icons_1.MinusMini, null) : React.createElement(icons_1.CheckMini, null)))));
+});
+exports.Checkbox = Checkbox;
+Checkbox.displayName = "Checkbox";
+//# sourceMappingURL=checkbox.js.map

package/dist/cjs/components/checkbox/checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAA;;;;AAEZ,0CAAqD;AACrD,uCAAoD;AACpD,qDAA8B;AAE9B,qCAAiC;AAGjC;;GAEG;AACH,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAK/B,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC1C,OAAO,CACL,oBAAC,mBAAa,CAAC,IAAI,OACb,KAAK,EACT,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,IAAA,SAAG,EACZ,qEAAqE,EACrE,SAAS,CACV;QAED,6BACE,SAAS,EAAE,IAAA,SAAG,EACZ,2JAA2J,EAC3J,6DAA6D,EAC7D,4DAA4D,EAC5D,4EAA4E,EAC5E,mHAAmH,EACnH,+HAA+H,CAChI;YAED,oBAAC,mBAAa,CAAC,SAAS,QACrB,OAAO,KAAK,eAAe,CAAC,CAAC,CAAC,oBAAC,iBAAS,OAAG,CAAC,CAAC,CAAC,oBAAC,iBAAS,OAAG,CACpC,CACtB,CACa,CACtB,CAAA;AACH,CAAC,CAAC,CAAA;AAGO,4BAAQ;AAFjB,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAA","sourcesContent":["\"use client\"\n\nimport { CheckMini, MinusMini } from \"@acmekit/icons\"\nimport { Checkbox as RadixCheckbox } from \"radix-ui\"\nimport * as React from \"react\"\n\nimport { clx } from \"@/utils/clx\"\nimport { CheckboxCheckedState } from \"./types\"\n\n/**\n * This component is based on the [Radix UI Checkbox](https://www.radix-ui.com/primitives/docs/components/checkbox) primitive.\n */\nconst Checkbox = React.forwardRef<\n  React.ElementRef<typeof RadixCheckbox.Root>,\n  React.ComponentPropsWithoutRef<typeof RadixCheckbox.Root> & {\n    checked?: CheckboxCheckedState | undefined\n  }\n>(({ className, checked, ...props }, ref) => {\n  return (\n    <RadixCheckbox.Root\n      {...props}\n      ref={ref}\n      checked={checked}\n      className={clx(\n        \"group inline-flex h-5 w-5 items-center justify-center outline-none \",\n        className\n      )}\n    >\n      <div\n        className={clx(\n          \"text-ui-fg-on-inverted bg-ui-bg-base shadow-borders-base [&_path]:shadow-details-contrast-on-bg-interactive transition-fg h-[15px] w-[15px] rounded-[3px]\",\n          \"group-disabled:cursor-not-allowed group-disabled:opacity-50\",\n          \"group-focus-visible:!shadow-borders-interactive-with-focus\",\n          \"group-hover:group-enabled:group-data-[state=unchecked]:bg-ui-bg-base-hover\",\n          \"group-data-[state=checked]:bg-ui-bg-interactive group-data-[state=checked]:shadow-borders-interactive-with-shadow\",\n          \"group-data-[state=indeterminate]:bg-ui-bg-interactive group-data-[state=indeterminate]:shadow-borders-interactive-with-shadow\"\n        )}\n      >\n        <RadixCheckbox.Indicator>\n          {checked === \"indeterminate\" ? <MinusMini /> : <CheckMini />}\n        </RadixCheckbox.Indicator>\n      </div>\n    </RadixCheckbox.Root>\n  )\n})\nCheckbox.displayName = \"Checkbox\"\n\nexport { Checkbox }\n"]}

package/dist/cjs/components/checkbox/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./checkbox";
+export * from "./types";
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/checkbox/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/checkbox/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA"}

package/dist/cjs/components/checkbox/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./checkbox"), exports);
+tslib_1.__exportStar(require("./types"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/checkbox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/checkbox/index.ts"],"names":[],"mappings":";;;AAAA,qDAA0B;AAC1B,kDAAuB","sourcesContent":["export * from \"./checkbox\"\nexport * from \"./types\"\n"]}

package/dist/cjs/components/checkbox/types.d.ts

@@ -0,0 +1,3 @@
+import type { Checkbox } from "radix-ui";
+export type CheckboxCheckedState = Checkbox.CheckedState;
+//# sourceMappingURL=types.d.ts.map

package/dist/cjs/components/checkbox/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/checkbox/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AAExC,MAAM,MAAM,oBAAoB,GAAG,QAAQ,CAAC,YAAY,CAAA"}

package/dist/cjs/components/checkbox/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/cjs/components/checkbox/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/checkbox/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Checkbox } from \"radix-ui\"\n\nexport type CheckboxCheckedState = Checkbox.CheckedState\n"]}

package/dist/cjs/components/code/code.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+/**
+ * This component is based on the `code` element and supports all of its props
+ */
+declare const Code: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+export { Code };
+//# sourceMappingURL=code.d.ts.map

package/dist/cjs/components/code/code.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"code.d.ts","sourceRoot":"","sources":["../../../../src/components/code/code.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B;;GAEG;AACH,QAAA,MAAM,IAAI,0JAcR,CAAA;AAIF,OAAO,EAAE,IAAI,EAAE,CAAA"}

package/dist/cjs/components/code/code.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Code = void 0;
+const tslib_1 = require("tslib");
+const clx_1 = require("../../utils/clx");
+const React = tslib_1.__importStar(require("react"));
+/**
+ * This component is based on the `code` element and supports all of its props
+ */
+const Code = React.forwardRef(({ className, ...props }, ref) => {
+    return (React.createElement("code", { ref: ref, className: (0, clx_1.clx)("border-ui-tag-neutral-border bg-ui-tag-neutral-bg text-ui-tag-neutral-text txt-compact-small inline-flex rounded-md border px-[6px] font-mono", className), ...props }));
+});
+exports.Code = Code;
+Code.displayName = "Code";
+//# sourceMappingURL=code.js.map

package/dist/cjs/components/code/code.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code.js","sourceRoot":"","sources":["../../../../src/components/code/code.tsx"],"names":[],"mappings":";;;;AAAA,qCAAiC;AACjC,qDAA8B;AAE9B;;GAEG;AACH,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAG3B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjC,OAAO,CACL,8BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,SAAG,EACZ,+IAA+I,EAC/I,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAIO,oBAAI;AAFb,IAAI,CAAC,WAAW,GAAG,MAAM,CAAA","sourcesContent":["import { clx } from \"@/utils/clx\"\nimport * as React from \"react\"\n\n/**\n * This component is based on the `code` element and supports all of its props\n */\nconst Code = React.forwardRef<\n  HTMLElement,\n  React.ComponentPropsWithoutRef<\"code\">\n>(({ className, ...props }, ref) => {\n  return (\n    <code\n      ref={ref}\n      className={clx(\n        \"border-ui-tag-neutral-border bg-ui-tag-neutral-bg text-ui-tag-neutral-text txt-compact-small inline-flex rounded-md border px-[6px] font-mono\",\n        className\n      )}\n      {...props}\n    />\n  )\n})\n\nCode.displayName = \"Code\"\n\nexport { Code }\n"]}

package/dist/cjs/components/code/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./code";
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/code/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/code/index.tsx"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAA"}

package/dist/cjs/components/code/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./code"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/code/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/code/index.tsx"],"names":[],"mappings":";;;AAAA,iDAAsB","sourcesContent":["export * from \"./code\"\n"]}

package/dist/cjs/components/code-block/code-block.d.ts

@@ -0,0 +1,53 @@
+import * as React from "react";
+export type CodeSnippet = {
+    /**
+     * The label of the code snippet's tab.
+     */
+    label: string;
+    /**
+     * The language of the code snippet. For example, `tsx`.
+     */
+    language: string;
+    /**
+     * The code snippet.
+     */
+    code: string;
+    /**
+     * Whether to hide the line numbers shown as the side of the code snippet.
+     */
+    hideLineNumbers?: boolean;
+    /**
+     * Whether to hide the copy button.
+     */
+    hideCopy?: boolean;
+};
+type RootProps = {
+    snippets: CodeSnippet[];
+};
+type HeaderProps = {
+    hideLabels?: boolean;
+};
+declare const CodeBlock: {
+    ({ snippets, className, children, ...props }: React.HTMLAttributes<HTMLDivElement> & RootProps): React.JSX.Element;
+    displayName: string;
+} & {
+    Body: {
+        ({ className, children, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+        displayName: string;
+    };
+    Header: {
+        ({ children, className, hideLabels, ...props }: React.HTMLAttributes<HTMLDivElement> & HeaderProps): React.JSX.Element;
+        displayName: string;
+    } & {
+        Meta: {
+            ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+            displayName: string;
+        };
+    };
+    Meta: {
+        ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+        displayName: string;
+    };
+};
+export { CodeBlock };
+//# sourceMappingURL=code-block.d.ts.map

package/dist/cjs/components/code-block/code-block.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../../../src/components/code-block/code-block.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAC7B;AAQD,MAAM,MAAM,WAAW,GAAG;IACxB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAA;IAChB;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAqBD,KAAK,SAAS,GAAG;IACf,QAAQ,EAAE,WAAW,EAAE,CAAA;CACxB,CAAA;AAgCD,KAAK,WAAW,GAAG;IACjB,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AA+QD,QAAA,MAAM,SAAS;kDApSZ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG,SAAS;;;;4CA6IhD,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;;;;wDA3GpC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG,WAAW;;;;sCAqFlD,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;;;;;kCAApC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;;;CA6KsB,CAAA;AAE7D,OAAO,EAAE,SAAS,EAAE,CAAA"}

package/dist/cjs/components/code-block/code-block.js

@@ -0,0 +1,176 @@
+"use strict";
+"use client";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CodeBlock = void 0;
+const tslib_1 = require("tslib");
+const prism_react_renderer_1 = require("prism-react-renderer");
+const React = tslib_1.__importStar(require("react"));
+(typeof global !== "undefined" ? global : window).Prism = prism_react_renderer_1.Prism;
+// @ts-ignore
+Promise.resolve().then(() => tslib_1.__importStar(require("prismjs/components/prism-json")));
+const copy_1 = require("../copy");
+const clx_1 = require("../../utils/clx");
+const CodeBlockContext = React.createContext(null);
+const useCodeBlockContext = () => {
+    const context = React.useContext(CodeBlockContext);
+    if (context === null)
+        throw new Error("useCodeBlockContext can only be used within a CodeBlockContext");
+    return context;
+};
+/**
+ * This component is based on the `div` element and supports all of its props
+ */
+const Root = ({ 
+/**
+ * The code snippets.
+ */
+snippets, className, children, ...props }) => {
+    const [active, setActive] = React.useState(snippets[0]);
+    return (React.createElement(CodeBlockContext.Provider, { value: { snippets, active, setActive } },
+        React.createElement("div", { className: (0, clx_1.clx)("bg-ui-contrast-bg-base shadow-elevation-code-block flex flex-col overflow-hidden rounded-xl", className), ...props }, children)));
+};
+Root.displayName = "CodeBlock";
+/**
+ * This component is based on the `div` element and supports all of its props
+ */
+const HeaderComponent = ({ children, className, 
+/**
+ * Whether to hide the code snippets' labels.
+ */
+hideLabels = false, ...props }) => {
+    const { snippets, active, setActive } = useCodeBlockContext();
+    const tabRefs = React.useRef([]);
+    const tabIndicatorRef = React.useRef(null);
+    React.useEffect(() => {
+        const activeTabRef = tabRefs.current.find((ref) => (ref === null || ref === void 0 ? void 0 : ref.dataset.label) === active.label);
+        if (activeTabRef && tabIndicatorRef.current) {
+            const activeTabIndex = tabRefs.current.indexOf(activeTabRef);
+            const prevTabRef = activeTabIndex > 0 ? tabRefs.current[activeTabIndex - 1] : null;
+            tabIndicatorRef.current.style.width = `${activeTabRef.offsetWidth}px`;
+            tabIndicatorRef.current.style.left = prevTabRef
+                ? `${tabRefs.current
+                    .slice(0, activeTabIndex)
+                    .reduce((total, tab) => total + ((tab === null || tab === void 0 ? void 0 : tab.offsetWidth) || 0) + 12, 0) +
+                    15}px`
+                : "15px";
+        }
+    }, [active]);
+    return (React.createElement("div", null,
+        React.createElement("div", { className: (0, clx_1.clx)("flex items-start px-4 pt-2.5", className), ...props },
+            !hideLabels &&
+                snippets.map((snippet, idx) => (React.createElement("div", { className: (0, clx_1.clx)("text-ui-contrast-fg-secondary txt-compact-small-plus transition-fg relative cursor-pointer pb-[9px] pr-3", {
+                        "text-ui-contrast-fg-primary cursor-default": active.label === snippet.label,
+                    }), key: snippet.label, onClick: () => setActive(snippet) },
+                    React.createElement("span", { ref: (ref) => {
+                            tabRefs.current[idx] = ref;
+                            return undefined;
+                        }, "data-label": snippet.label }, snippet.label)))),
+            children),
+        React.createElement("div", { className: "w-full px-0.5" },
+            React.createElement("div", { className: "bg-ui-contrast-border-top relative h-px w-full" },
+                React.createElement("div", { ref: tabIndicatorRef, className: (0, clx_1.clx)("absolute bottom-0 transition-all motion-reduce:transition-none", "duration-150 ease-linear") },
+                    React.createElement("div", { className: "bg-ui-contrast-fg-primary h-px rounded-full" }))))));
+};
+HeaderComponent.displayName = "CodeBlock.Header";
+/**
+ * This component is based on the `div` element and supports all of its props
+ */
+const Meta = ({ className, ...props }) => {
+    return (React.createElement("div", { className: (0, clx_1.clx)("txt-compact-small text-ui-contrast-fg-secondary ml-auto", className), ...props }));
+};
+Meta.displayName = "CodeBlock.Header.Meta";
+const Header = Object.assign(HeaderComponent, { Meta });
+/**
+ * This component is based on the `div` element and supports all of its props
+ */
+const Body = ({ className, children, ...props }) => {
+    const { active } = useCodeBlockContext();
+    const showToolbar = children || !active.hideCopy;
+    return (React.createElement("div", null,
+        showToolbar && (React.createElement("div", { className: "border-ui-contrast-border-bot flex min-h-10 items-center gap-x-3 border-t px-4 py-2" },
+            React.createElement("div", { className: "code-body text-ui-contrast-fg-secondary flex-1" }, children),
+            !active.hideCopy && (React.createElement(copy_1.Copy, { content: active.code, className: "text-ui-contrast-fg-secondary" })))),
+        React.createElement("div", { className: "flex h-full flex-col overflow-hidden px-[5px] pb-[5px]" },
+            React.createElement("div", { className: (0, clx_1.clx)("bg-ui-contrast-bg-subtle border-ui-contrast-border-bot relative h-full overflow-y-auto rounded-lg border p-4", className), ...props },
+                React.createElement("div", { className: "max-w-[90%]" },
+                    React.createElement(prism_react_renderer_1.Highlight, { theme: {
+                            ...prism_react_renderer_1.themes.palenight,
+                            plain: {
+                                color: "rgba(249, 250, 251, 1)",
+                                backgroundColor: "var(--contrast-fg-primary)",
+                            },
+                            styles: [
+                                ...prism_react_renderer_1.themes.palenight.styles,
+                                {
+                                    types: ["keyword"],
+                                    style: {
+                                        fontStyle: "normal",
+                                        color: "rgb(187,160,255)",
+                                    },
+                                },
+                                {
+                                    types: ["punctuation", "operator"],
+                                    style: {
+                                        fontStyle: "normal",
+                                        color: "rgb(255,255,255)",
+                                    },
+                                },
+                                {
+                                    types: ["constant", "boolean"],
+                                    style: {
+                                        fontStyle: "normal",
+                                        color: "rgb(187,77,96)",
+                                    },
+                                },
+                                {
+                                    types: ["function"],
+                                    style: {
+                                        fontStyle: "normal",
+                                        color: "rgb(27,198,242)",
+                                    },
+                                },
+                                {
+                                    types: ["number"],
+                                    style: {
+                                        color: "rgb(247,208,25)",
+                                    },
+                                },
+                                {
+                                    types: ["property"],
+                                    style: {
+                                        color: "rgb(247,208,25)",
+                                    },
+                                },
+                                {
+                                    types: ["maybe-class-name"],
+                                    style: {
+                                        color: "rgb(255,203,107)",
+                                    },
+                                },
+                                {
+                                    types: ["string"],
+                                    style: {
+                                        color: "rgb(73,209,110)",
+                                    },
+                                },
+                                {
+                                    types: ["comment"],
+                                    style: {
+                                        color: "var(--contrast-fg-secondary)",
+                                        fontStyle: "normal",
+                                    },
+                                },
+                            ],
+                        }, code: active.code, language: active.language }, ({ style, tokens, getLineProps, getTokenProps }) => (React.createElement("pre", { className: (0, clx_1.clx)("code-body whitespace-pre-wrap bg-transparent", {
+                            "grid grid-cols-[auto,1fr] gap-x-4": !active.hideLineNumbers,
+                        }), style: {
+                            ...style,
+                            background: "transparent",
+                        } },
+                        !active.hideLineNumbers && (React.createElement("div", { role: "presentation", className: "flex flex-col text-right" }, tokens.map((_, i) => (React.createElement("span", { key: i, className: "text-ui-contrast-fg-secondary tabular-nums" }, i + 1))))),
+                        React.createElement("div", null, tokens.map((line, i) => (React.createElement("div", { key: i, ...getLineProps({ line }) }, line.map((token, key) => (React.createElement("span", { key: key, ...getTokenProps({ token }) })))))))))))))));
+};
+Body.displayName = "CodeBlock.Body";
+const CodeBlock = Object.assign(Root, { Body, Header, Meta });
+exports.CodeBlock = CodeBlock;
+//# sourceMappingURL=code-block.js.map

package/dist/cjs/components/code-block/code-block.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-block.js","sourceRoot":"","sources":["../../../../src/components/code-block/code-block.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\nimport { Highlight, Prism, themes } from \"prism-react-renderer\"\nimport * as React from \"react\"\n;(typeof global !== \"undefined\" ? global : window).Prism = Prism\n\n// @ts-ignore\nimport(\"prismjs/components/prism-json\")\n\nimport { Copy } from \"@/components/copy\"\nimport { clx } from \"@/utils/clx\"\n\nexport type CodeSnippet = {\n  /**\n   * The label of the code snippet's tab.\n   */\n  label: string\n  /**\n   * The language of the code snippet. For example, `tsx`.\n   */\n  language: string\n  /**\n   * The code snippet.\n   */\n  code: string\n  /**\n   * Whether to hide the line numbers shown as the side of the code snippet.\n   */\n  hideLineNumbers?: boolean\n  /**\n   * Whether to hide the copy button.\n   */\n  hideCopy?: boolean\n}\n\ntype CodeBlockState = {\n  snippets: CodeSnippet[]\n  active: CodeSnippet\n  setActive: (active: CodeSnippet) => void\n} | null\n\nconst CodeBlockContext = React.createContext<CodeBlockState>(null)\n\nconst useCodeBlockContext = () => {\n  const context = React.useContext(CodeBlockContext)\n\n  if (context === null)\n    throw new Error(\n      \"useCodeBlockContext can only be used within a CodeBlockContext\"\n    )\n\n  return context\n}\n\ntype RootProps = {\n  snippets: CodeSnippet[]\n}\n\n/**\n * This component is based on the `div` element and supports all of its props\n */\nconst Root = ({\n  /**\n   * The code snippets.\n   */\n  snippets,\n  className,\n  children,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement> & RootProps) => {\n  const [active, setActive] = React.useState(snippets[0])\n\n  return (\n    <CodeBlockContext.Provider value={{ snippets, active, setActive }}>\n      <div\n        className={clx(\n          \"bg-ui-contrast-bg-base shadow-elevation-code-block flex flex-col overflow-hidden rounded-xl\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    </CodeBlockContext.Provider>\n  )\n}\nRoot.displayName = \"CodeBlock\"\n\ntype HeaderProps = {\n  hideLabels?: boolean\n}\n\n/**\n * This component is based on the `div` element and supports all of its props\n */\nconst HeaderComponent = ({\n  children,\n  className,\n  /**\n   * Whether to hide the code snippets' labels.\n   */\n  hideLabels = false,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement> & HeaderProps) => {\n  const { snippets, active, setActive } = useCodeBlockContext()\n\n  const tabRefs = React.useRef<Array<HTMLSpanElement | null>>([])\n  const tabIndicatorRef = React.useRef<HTMLDivElement | null>(null)\n\n  React.useEffect(() => {\n    const activeTabRef = tabRefs.current.find(\n      (ref) => ref?.dataset.label === active.label\n    )\n\n    if (activeTabRef && tabIndicatorRef.current) {\n      const activeTabIndex = tabRefs.current.indexOf(activeTabRef)\n\n      const prevTabRef =\n        activeTabIndex > 0 ? tabRefs.current[activeTabIndex - 1] : null\n\n      tabIndicatorRef.current.style.width = `${activeTabRef.offsetWidth}px`\n      tabIndicatorRef.current.style.left = prevTabRef\n        ? `${\n            tabRefs.current\n              .slice(0, activeTabIndex)\n              .reduce((total, tab) => total + (tab?.offsetWidth || 0) + 12, 0) +\n            15\n          }px`\n        : \"15px\"\n    }\n  }, [active])\n\n  return (\n    <div>\n      <div\n        className={clx(\"flex items-start px-4 pt-2.5\", className)}\n        {...props}\n      >\n        {!hideLabels &&\n          snippets.map((snippet, idx) => (\n            <div\n              className={clx(\n                \"text-ui-contrast-fg-secondary txt-compact-small-plus transition-fg relative cursor-pointer pb-[9px] pr-3\",\n                {\n                  \"text-ui-contrast-fg-primary cursor-default\":\n                    active.label === snippet.label,\n                }\n              )}\n              key={snippet.label}\n              onClick={() => setActive(snippet)}\n            >\n              <span\n                ref={(ref) => {\n                  tabRefs.current[idx] = ref\n                  return undefined\n                }}\n                data-label={snippet.label}\n              >\n                {snippet.label}\n              </span>\n            </div>\n          ))}\n        {children}\n      </div>\n      <div className=\"w-full px-0.5\">\n        <div className=\"bg-ui-contrast-border-top relative h-px w-full\">\n          <div\n            ref={tabIndicatorRef}\n            className={clx(\n              \"absolute bottom-0 transition-all motion-reduce:transition-none\",\n              \"duration-150 ease-linear\"\n            )}\n          >\n            <div className=\"bg-ui-contrast-fg-primary h-px rounded-full\" />\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\nHeaderComponent.displayName = \"CodeBlock.Header\"\n\n/**\n * This component is based on the `div` element and supports all of its props\n */\nconst Meta = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => {\n  return (\n    <div\n      className={clx(\n        \"txt-compact-small text-ui-contrast-fg-secondary ml-auto\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\nMeta.displayName = \"CodeBlock.Header.Meta\"\n\nconst Header = Object.assign(HeaderComponent, { Meta })\n\n/**\n * This component is based on the `div` element and supports all of its props\n */\nconst Body = ({\n  className,\n  children,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => {\n  const { active } = useCodeBlockContext()\n\n  const showToolbar = children || !active.hideCopy\n\n  return (\n    <div>\n      {showToolbar && (\n        <div className=\"border-ui-contrast-border-bot flex min-h-10 items-center gap-x-3 border-t px-4 py-2\">\n          <div className=\"code-body text-ui-contrast-fg-secondary flex-1\">\n            {children}\n          </div>\n          {!active.hideCopy && (\n            <Copy\n              content={active.code}\n              className=\"text-ui-contrast-fg-secondary\"\n            />\n          )}\n        </div>\n      )}\n      <div className=\"flex h-full flex-col overflow-hidden px-[5px] pb-[5px]\">\n        <div\n          className={clx(\n            \"bg-ui-contrast-bg-subtle border-ui-contrast-border-bot relative h-full overflow-y-auto rounded-lg border p-4\",\n            className\n          )}\n          {...props}\n        >\n          <div className=\"max-w-[90%]\">\n            <Highlight\n              theme={{\n                ...themes.palenight,\n                plain: {\n                  color: \"rgba(249, 250, 251, 1)\",\n                  backgroundColor: \"var(--contrast-fg-primary)\",\n                },\n                styles: [\n                  ...themes.palenight.styles,\n                  {\n                    types: [\"keyword\"],\n                    style: {\n                      fontStyle: \"normal\",\n                      color: \"rgb(187,160,255)\",\n                    },\n                  },\n                  {\n                    types: [\"punctuation\", \"operator\"],\n                    style: {\n                      fontStyle: \"normal\",\n                      color: \"rgb(255,255,255)\",\n                    },\n                  },\n                  {\n                    types: [\"constant\", \"boolean\"],\n                    style: {\n                      fontStyle: \"normal\",\n                      color: \"rgb(187,77,96)\",\n                    },\n                  },\n                  {\n                    types: [\"function\"],\n                    style: {\n                      fontStyle: \"normal\",\n                      color: \"rgb(27,198,242)\",\n                    },\n                  },\n                  {\n                    types: [\"number\"],\n                    style: {\n                      color: \"rgb(247,208,25)\",\n                    },\n                  },\n                  {\n                    types: [\"property\"],\n                    style: {\n                      color: \"rgb(247,208,25)\",\n                    },\n                  },\n                  {\n                    types: [\"maybe-class-name\"],\n                    style: {\n                      color: \"rgb(255,203,107)\",\n                    },\n                  },\n                  {\n                    types: [\"string\"],\n                    style: {\n                      color: \"rgb(73,209,110)\",\n                    },\n                  },\n                  {\n                    types: [\"comment\"],\n                    style: {\n                      color: \"var(--contrast-fg-secondary)\",\n                      fontStyle: \"normal\",\n                    },\n                  },\n                ],\n              }}\n              code={active.code}\n              language={active.language}\n            >\n              {({ style, tokens, getLineProps, getTokenProps }) => (\n                <pre\n                  className={clx(\n                    \"code-body whitespace-pre-wrap bg-transparent\",\n                    {\n                      \"grid grid-cols-[auto,1fr] gap-x-4\":\n                        !active.hideLineNumbers,\n                    }\n                  )}\n                  style={{\n                    ...style,\n                    background: \"transparent\",\n                  }}\n                >\n                  {!active.hideLineNumbers && (\n                    <div\n                      role=\"presentation\"\n                      className=\"flex flex-col text-right\"\n                    >\n                      {tokens.map((_, i) => (\n                        <span\n                          key={i}\n                          className=\"text-ui-contrast-fg-secondary tabular-nums\"\n                        >\n                          {i + 1}\n                        </span>\n                      ))}\n                    </div>\n                  )}\n                  <div>\n                    {tokens.map((line, i) => (\n                      <div key={i} {...getLineProps({ line })}>\n                        {line.map((token, key) => (\n                          <span key={key} {...getTokenProps({ token })} />\n                        ))}\n                      </div>\n                    ))}\n                  </div>\n                </pre>\n              )}\n            </Highlight>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\nBody.displayName = \"CodeBlock.Body\"\n\nconst CodeBlock = Object.assign(Root, { Body, Header, Meta })\n\nexport { CodeBlock }\n"]}

package/dist/cjs/components/code-block/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./code-block";
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/code-block/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/code-block/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA"}

package/dist/cjs/components/code-block/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./code-block"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/code-block/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/code-block/index.ts"],"names":[],"mappings":";;;AAAA,uDAA4B","sourcesContent":["export * from \"./code-block\"\n"]}

package/dist/cjs/components/command/command.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+declare const Command: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    displayName: string;
+} & {
+    Copy: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLButtonElement> & {
+        content: string;
+        variant?: "mini" | "default" | null;
+        asChild?: boolean;
+    } & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+};
+export { Command };
+//# sourceMappingURL=command.d.ts.map

package/dist/cjs/components/command/command.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"command.d.ts","sourceRoot":"","sources":["../../../../src/components/command/command.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAA;AAoCzB,QAAA,MAAM,OAAO;8BA5BV,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;;;;;;;;CA4B+B,CAAA;AAEtE,OAAO,EAAE,OAAO,EAAE,CAAA"}

package/dist/cjs/components/command/command.js

@@ -0,0 +1,22 @@
+"use strict";
+"use client";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Command = void 0;
+const tslib_1 = require("tslib");
+const copy_1 = require("../copy");
+const clx_1 = require("../../utils/clx");
+const react_1 = tslib_1.__importDefault(require("react"));
+/**
+ * This component is based on the div element and supports all of its props
+ */
+const CommandComponent = ({ className, ...props }) => {
+    return (react_1.default.createElement("div", { className: (0, clx_1.clx)("bg-ui-contrast-bg-base shadow-elevation-code-block flex items-center rounded-lg px-4 py-1.5", "[&>code]:text-ui-contrast-fg-primary [&>code]:code-body [&>code]:mx-2", className), ...props }));
+};
+CommandComponent.displayName = "Command";
+const CommandCopy = react_1.default.forwardRef(({ className, ...props }, ref) => {
+    return (react_1.default.createElement(copy_1.Copy, { ...props, ref: ref, className: (0, clx_1.clx)("!text-ui-contrast-fg-secondary ml-auto", className) }));
+});
+CommandCopy.displayName = "Command.Copy";
+const Command = Object.assign(CommandComponent, { Copy: CommandCopy });
+exports.Command = Command;
+//# sourceMappingURL=command.js.map

package/dist/cjs/components/command/command.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"command.js","sourceRoot":"","sources":["../../../../src/components/command/command.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAA;;;;AAEZ,4CAAwC;AACxC,qCAAiC;AACjC,0DAAyB;AAEzB;;GAEG;AACH,MAAM,gBAAgB,GAAG,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EAC6B,EAAE,EAAE;IACzC,OAAO,CACL,uCACE,SAAS,EAAE,IAAA,SAAG,EACZ,6FAA6F,EAC7F,uEAAuE,EACvE,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC,CAAA;AACD,gBAAgB,CAAC,WAAW,GAAG,SAAS,CAAA;AAExC,MAAM,WAAW,GAAG,eAAK,CAAC,UAAU,CAGlC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjC,OAAO,CACL,8BAAC,WAAI,OACC,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,SAAG,EAAC,wCAAwC,EAAE,SAAS,CAAC,GACnE,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AACF,WAAW,CAAC,WAAW,GAAG,cAAc,CAAA;AAExC,MAAM,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC,gBAAgB,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,CAAA;AAE7D,0BAAO","sourcesContent":["\"use client\"\n\nimport { Copy } from \"@/components/copy\"\nimport { clx } from \"@/utils/clx\"\nimport React from \"react\"\n\n/**\n * This component is based on the div element and supports all of its props\n */\nconst CommandComponent = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => {\n  return (\n    <div\n      className={clx(\n        \"bg-ui-contrast-bg-base shadow-elevation-code-block flex items-center rounded-lg px-4 py-1.5\",\n        \"[&>code]:text-ui-contrast-fg-primary [&>code]:code-body [&>code]:mx-2\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\nCommandComponent.displayName = \"Command\"\n\nconst CommandCopy = React.forwardRef<\n  React.ElementRef<typeof Copy>,\n  React.ComponentPropsWithoutRef<typeof Copy>\n>(({ className, ...props }, ref) => {\n  return (\n    <Copy\n      {...props}\n      ref={ref}\n      className={clx(\"!text-ui-contrast-fg-secondary ml-auto\", className)}\n    />\n  )\n})\nCommandCopy.displayName = \"Command.Copy\"\n\nconst Command = Object.assign(CommandComponent, { Copy: CommandCopy })\n\nexport { Command }\n"]}

package/dist/cjs/components/command/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./command";
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/command/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/command/index.tsx"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA"}

package/dist/cjs/components/command/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./command"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/command/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/command/index.tsx"],"names":[],"mappings":";;;AAAA,oDAAyB","sourcesContent":["export * from \"./command\"\n"]}