@arc-ui/components 11.5.0 → 11.6.0

package/dist/Checkbox/Checkbox.cjs.js

@@ -2,68 +2,19 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
-var React = require('react');
-var BtIconTickAlt2Px = require('../_shared/cjs/BtIconTickAlt2Px-bdf06f8c.js');
-var BtIconAlert = require('../_shared/cjs/BtIconAlert-637db790.js');
-var index = require('../_shared/cjs/index-45bfb67b.js');
-var FormControl = require('../_shared/cjs/FormControl-42360ae8.js');
-var Surface = require('../_shared/cjs/Surface-6da0a78e.js');
-require('../_shared/cjs/DisclosureMini-5af13d3c.js');
+var Checkbox = require('../_shared/cjs/Checkbox-21d3c4f6.js');
+require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
+require('react');
+require('../_shared/cjs/BtIconTickAlt2Px-bdf06f8c.js');
+require('../_shared/cjs/BtIconAlert-637db790.js');
+require('../_shared/cjs/index-45bfb67b.js');
+require('../_shared/cjs/FormControl-9aaddd54.js');
+require('../_shared/cjs/Surface-6da0a78e.js');
+require('../_shared/cjs/DisclosureMini-067e0319.js');
 require('../_shared/cjs/BtIconChevronDown2Px-8fb4e2eb.js');
 require('../_shared/cjs/Text-6f2827e6.js');
 require('../_shared/cjs/suffix-modifier-1ee2da04.js');
-require('../_shared/cjs/VerticalSpace-86f697e7.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-/**
- *  Use `Checkbox` to allow users to select individual options.
- */
-var Checkbox = React.forwardRef(function (_a, ref) {
-    var _b = _a.checked, checked = _b === void 0 ? false : _b, errorMessage = _a.errorMessage, helper = _a.helper, id = _a.id, _c = _a.isDisabled, isDisabled = _c === void 0 ? false : _c, _d = _a.isRequired, isRequired = _d === void 0 ? false : _d, label = _a.label, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, _e = _a.size, size = _e === void 0 ? "l" : _e, value = _a.value, _f = _a.checkboxAlignment, checkboxAlignment = _f === void 0 ? "center" : _f, props = filterDataAttrs.__rest(_a, ["checked", "errorMessage", "helper", "id", "isDisabled", "isRequired", "label", "name", "onBlur", "onChange", "size", "value", "checkboxAlignment"]);
-    var requirementStatus = React.useContext(FormControl.Context).requirementStatus;
-    var surface = React.useContext(Surface.Context).surface;
-    var _g = FormControl.useAriaDescribedby({
-        id: id,
-        errorMessage: errorMessage
-    }), ariaDescribedby = _g.ariaDescribedby, idError = _g.idError;
-    var idLabel = "".concat(id, "-label");
-    var checkedProps = {};
-    if (typeof onChange === "function") {
-        checkedProps.checked = checked;
-    }
-    else if (checked && !onChange) {
-        checkedProps.defaultChecked = true;
-    }
-    if (requirementStatus === "required") {
-        isRequired = true;
-    }
-    return (React__default["default"].createElement("div", { className: index.classNames({
-            "arc-Checkbox": true,
-            "arc-Checkbox--disabled": isDisabled,
-            "arc-Checkbox--invalid": errorMessage,
-            "arc-Checkbox--small": size === "s",
-            "arc-Checkbox--onDarkSurface": surface === "dark"
-        }) },
-        React__default["default"].createElement("label", { id: idLabel, htmlFor: id, className: index.classNames("arc-Checkbox-label", {
-                "arc-Checkbox-label--top": checkboxAlignment === "top"
-            }) },
-            React__default["default"].createElement("input", filterDataAttrs.__assign({ "aria-describedby": ariaDescribedby, "aria-invalid": errorMessage ? "true" : "false", className: "arc-Checkbox-input" }, checkedProps, { disabled: isDisabled, id: id, name: name, onBlur: onBlur, onChange: onChange, ref: ref, required: isRequired, type: "checkbox", value: value }, filterDataAttrs.filterDataAttrs(props))),
-            React__default["default"].createElement("span", { className: "arc-Checkbox-box" },
-                React__default["default"].createElement(BtIconTickAlt2Px.BtIconTickAlt2Px_2, null)),
-            React__default["default"].createElement("span", filterDataAttrs.__assign({}, (checkboxAlignment === "top" && {
-                className: "arc-Checkbox-content--marginTop"
-            })),
-                label,
-                !isRequired && requirementStatus !== "optional" ? (React__default["default"].createElement("span", { className: "arc-Checkbox-labelOptional" }, "(optional)")) : null,
-                helper && React__default["default"].createElement("span", { className: "arc-Checkbox-helper" }, helper))),
-        errorMessage && (React__default["default"].createElement("div", { id: idError, className: "arc-Checkbox-error" },
-            React__default["default"].createElement("span", { className: "arc-Checkbox-error--icon" },
-                React__default["default"].createElement(BtIconAlert.BtIconAlert_2, null)),
-            errorMessage))));
-});
-
-exports.Checkbox = Checkbox;
+exports.Checkbox = Checkbox.Checkbox;

package/dist/Checkbox/Checkbox.esm.d.ts

@@ -1,64 +1 @@
-/// <reference types="react" />
-import React from "react";
-type EventType = React.ChangeEvent<HTMLInputElement>;
-/**
- *  Use `Checkbox` to allow users to select individual options.
- */
-declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
-interface CheckboxProps {
-    /**
-     * Error message for the Checkbox.
-     */
-    errorMessage?: string;
-    /**
-     * Helper text for the Checkbox, shown below the label.
-     */
-    helper?: React.ReactNode;
-    /**
-     * Determine the alignment the Checkbox.
-     *
-     */
-    checkboxAlignment?: "top" | "center";
-    /**
-     * ID for the Checkbox.
-     */
-    id: string;
-    /**
-     * Is the input checked?
-     */
-    checked?: boolean;
-    /**
-     * `isDisabled` is a legacy property and not recommended from a UX usability best practice perspective.
-     */
-    isDisabled?: boolean;
-    /**
-     * Is the Checkbox required?
-     */
-    isRequired?: boolean;
-    /**
-     * Label for the Checkbox.
-     */
-    label: React.ReactNode;
-    /**
-     * Name for the Checkbox.
-     */
-    name?: string;
-    /**
-     * Function to call when the Checkbox loses focus.
-     */
-    onBlur?: (e: EventType) => void;
-    /**
-     * Callback function to update the Checkbox's controlled `checked` prop, for
-     * example `e => setChecked(e.target.checked)`.
-     */
-    onChange?: (event: EventType) => void;
-    /**
-     * Size of the Checkbox.
-     */
-    size?: "s" | "l";
-    /**
-     * Value for the Checkbox.
-     */
-    value?: string;
-}
-export { Checkbox };
+export { Checkbox } from "../_shared/esm/Checkbox-94300d8c";

package/dist/Checkbox/Checkbox.esm.js

@@ -1,61 +1,12 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-afdb7d32.js';
-import React__default, { forwardRef, useContext } from 'react';
-import { B as BtIconTickAlt2Px_2 } from '../_shared/esm/BtIconTickAlt2Px-da97e9ae.js';
-import { B as BtIconAlert_2 } from '../_shared/esm/BtIconAlert-55a6ed5c.js';
-import { c as classNames } from '../_shared/esm/index-2ae58626.js';
-import { C as Context, u as useAriaDescribedby } from '../_shared/esm/FormControl-0744f93f.js';
-import { C as Context$1 } from '../_shared/esm/Surface-bb100ef8.js';
-import '../_shared/esm/DisclosureMini-322fccc0.js';
+export { C as Checkbox } from '../_shared/esm/Checkbox-94300d8c.js';
+import '../_shared/esm/filter-data-attrs-afdb7d32.js';
+import 'react';
+import '../_shared/esm/BtIconTickAlt2Px-da97e9ae.js';
+import '../_shared/esm/BtIconAlert-55a6ed5c.js';
+import '../_shared/esm/index-2ae58626.js';
+import '../_shared/esm/FormControl-5e3fdca3.js';
+import '../_shared/esm/Surface-bb100ef8.js';
+import '../_shared/esm/DisclosureMini-022beae3.js';
 import '../_shared/esm/BtIconChevronDown2Px-782876e2.js';
 import '../_shared/esm/Text-00e9743b.js';
 import '../_shared/esm/suffix-modifier-7e640670.js';
-import '../_shared/esm/VerticalSpace-93980c9c.js';
-
-/**
- *  Use `Checkbox` to allow users to select individual options.
- */
-var Checkbox = forwardRef(function (_a, ref) {
-    var _b = _a.checked, checked = _b === void 0 ? false : _b, errorMessage = _a.errorMessage, helper = _a.helper, id = _a.id, _c = _a.isDisabled, isDisabled = _c === void 0 ? false : _c, _d = _a.isRequired, isRequired = _d === void 0 ? false : _d, label = _a.label, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, _e = _a.size, size = _e === void 0 ? "l" : _e, value = _a.value, _f = _a.checkboxAlignment, checkboxAlignment = _f === void 0 ? "center" : _f, props = __rest(_a, ["checked", "errorMessage", "helper", "id", "isDisabled", "isRequired", "label", "name", "onBlur", "onChange", "size", "value", "checkboxAlignment"]);
-    var requirementStatus = useContext(Context).requirementStatus;
-    var surface = useContext(Context$1).surface;
-    var _g = useAriaDescribedby({
-        id: id,
-        errorMessage: errorMessage
-    }), ariaDescribedby = _g.ariaDescribedby, idError = _g.idError;
-    var idLabel = "".concat(id, "-label");
-    var checkedProps = {};
-    if (typeof onChange === "function") {
-        checkedProps.checked = checked;
-    }
-    else if (checked && !onChange) {
-        checkedProps.defaultChecked = true;
-    }
-    if (requirementStatus === "required") {
-        isRequired = true;
-    }
-    return (React__default.createElement("div", { className: classNames({
-            "arc-Checkbox": true,
-            "arc-Checkbox--disabled": isDisabled,
-            "arc-Checkbox--invalid": errorMessage,
-            "arc-Checkbox--small": size === "s",
-            "arc-Checkbox--onDarkSurface": surface === "dark"
-        }) },
-        React__default.createElement("label", { id: idLabel, htmlFor: id, className: classNames("arc-Checkbox-label", {
-                "arc-Checkbox-label--top": checkboxAlignment === "top"
-            }) },
-            React__default.createElement("input", __assign({ "aria-describedby": ariaDescribedby, "aria-invalid": errorMessage ? "true" : "false", className: "arc-Checkbox-input" }, checkedProps, { disabled: isDisabled, id: id, name: name, onBlur: onBlur, onChange: onChange, ref: ref, required: isRequired, type: "checkbox", value: value }, filterDataAttrs(props))),
-            React__default.createElement("span", { className: "arc-Checkbox-box" },
-                React__default.createElement(BtIconTickAlt2Px_2, null)),
-            React__default.createElement("span", __assign({}, (checkboxAlignment === "top" && {
-                className: "arc-Checkbox-content--marginTop"
-            })),
-                label,
-                !isRequired && requirementStatus !== "optional" ? (React__default.createElement("span", { className: "arc-Checkbox-labelOptional" }, "(optional)")) : null,
-                helper && React__default.createElement("span", { className: "arc-Checkbox-helper" }, helper))),
-        errorMessage && (React__default.createElement("div", { id: idError, className: "arc-Checkbox-error" },
-            React__default.createElement("span", { className: "arc-Checkbox-error--icon" },
-                React__default.createElement(BtIconAlert_2, null)),
-            errorMessage))));
-});
-
-export { Checkbox };

package/dist/Columns/Columns.cjs.d.ts

@@ -1,76 +1 @@
-import { FC, ReactNode } from "react";
-/**
- * Use `Columns` to compose layouts on a 12-column grid.
- */
-declare const Columns: FC<ColumnsProps> & {
-    Col: typeof Col;
-};
-declare const Col: FC<ColProps>;
-type Span = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
-type Offset = "0" | "24" | "48" | "72" | "96" | "120" | "144" | "168" | "192" | "216" | "240" | "264" | "288" | "312" | "336" | "360" | "384";
-interface ColProps {
-    /**
-     * Vertically align the Column.
-     */
-    align?: "top" | "center" | "bottom";
-    /**
-     * Content to display in the Column.
-     */
-    children?: ReactNode;
-    /**
-     * Should the Column be visible for debugging and documentation
-     * purposes?
-     */
-    isDebugVisible?: boolean;
-    /**
-     * Overlay the column over the previous content on the default breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
-     */
-    offset?: Offset;
-    /**
-     * Overlay the column over the previous content on the S breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
-     */
-    offsetS?: Offset;
-    /**
-     * Overlay the column over the previous content on the M breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
-     */
-    offsetM?: Offset;
-    /**
-     * Overlay the column over the previous content on the L breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
-     */
-    offsetL?: Offset;
-    /**
-     * Overlay the column over the previous content on the XL breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
-     */
-    offsetXL?: Offset;
-    /**
-     * The number of columns to span on the default breakpoint and above, from 1 to 12.
-     */
-    span?: Span;
-    /**
-     * The number of columns to span on the S breakpoint and above, from 1 to 12.
-     */
-    spanS?: Span;
-    /**
-     * The number of columns to span on the M breakpoint and above, from 1 to 12.
-     */
-    spanM?: Span;
-    /**
-     * The number of columns to span on the L breakpoint and above, from 1 to 12.
-     */
-    spanL?: Span;
-    /**
-     * The number of columns to span on the XL breakpoint and above, from 1 to 12.
-     */
-    spanXL?: Span;
-}
-interface ColumnsProps {
-    /**
-     * Contents of the Columns. Should only contain `Columns.Col`.
-     */
-    children: ReactNode;
-    /**
-     * Should the Columns be gutterless?
-     */
-    isGutterless?: boolean;
-}
-export { Columns };
+export { Columns } from "../_shared/cjs/Columns-e90798f8";

package/dist/Columns/Columns.cjs.js

@@ -2,58 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
-var index = require('../_shared/cjs/index-45bfb67b.js');
-var React = require('react');
-var suffixModifier = require('../_shared/cjs/suffix-modifier-1ee2da04.js');
+var Columns = require('../_shared/cjs/Columns-e90798f8.js');
+require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
+require('../_shared/cjs/index-45bfb67b.js');
+require('react');
+require('../_shared/cjs/suffix-modifier-1ee2da04.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-/**
- * Use `Columns` to compose layouts on a 12-column grid.
- */
-var Columns = function (_a) {
-    var children = _a.children, _b = _a.isGutterless, isGutterless = _b === void 0 ? false : _b, props = filterDataAttrs.__rest(_a, ["children", "isGutterless"]);
-    React.useEffect(function () {
-        React__default["default"].Children.map(children, function (item) {
-            if (item && item.type !== Col) {
-                throw new Error("Illegal child passed to <Columns />. Ensure to only use <Columns.Col />.");
-            }
-        });
-    }, [children]);
-    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames({
-            "arc-Columns": true,
-            "arc-Columns--gutterless": isGutterless
-        }) }, filterDataAttrs.filterDataAttrs(props)),
-        React__default["default"].createElement("div", { className: "arc-Columns-inner" }, children)));
-};
-var Col = function (_a) {
-    var _b;
-    var align = _a.align, children = _a.children, _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, offset = _a.offset, offsetS = _a.offsetS, offsetM = _a.offsetM, offsetL = _a.offsetL, offsetXL = _a.offsetXL, span = _a.span, spanS = _a.spanS, spanM = _a.spanM, spanL = _a.spanL, spanXL = _a.spanXL, props = filterDataAttrs.__rest(_a, ["align", "children", "isDebugVisible", "offset", "offsetS", "offsetM", "offsetL", "offsetXL", "span", "spanS", "spanM", "spanL", "spanXL"]);
-    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames((_b = {},
-            _b["arc-Columns-col"] = true,
-            _b[suffixModifier.suffixModifier("arc-Columns-col--align", align || "")] = align,
-            _b["arc-Columns-col--".concat(span)] = typeof span !== "undefined",
-            _b["arc-Columns-col--s".concat(spanS)] = typeof spanS !== "undefined",
-            _b["arc-Columns-col--m".concat(spanM)] = typeof spanM !== "undefined",
-            _b["arc-Columns-col--l".concat(spanL)] = typeof spanL !== "undefined",
-            _b["arc-Columns-col--xL".concat(spanXL)] = typeof spanXL !== "undefined",
-            _b["arc-Columns-col--offset"] = typeof offset !== "undefined" ||
-                typeof offsetS !== "undefined" ||
-                typeof offsetM !== "undefined" ||
-                typeof offsetL !== "undefined" ||
-                typeof offsetXL !== "undefined",
-            _b["arc-Columns-col--offset".concat(offset)] = typeof offset !== "undefined",
-            _b["arc-Columns-col--offsetS".concat(offsetS)] = typeof offsetS !== "undefined",
-            _b["arc-Columns-col--offsetM".concat(offsetM)] = typeof offsetM !== "undefined",
-            _b["arc-Columns-col--offsetL".concat(offsetL)] = typeof offsetL !== "undefined",
-            _b["arc-Columns-col--offsetXL".concat(offsetXL)] = typeof offsetXL !== "undefined",
-            _b["arc-Columns-col--debugVisible"] = isDebugVisible,
-            _b)) }, filterDataAttrs.filterDataAttrs(props)), children));
-};
-Col.displayName = "Columns.Col";
-Columns.Col = Col;
-
-exports.Columns = Columns;
+exports.Columns = Columns.Columns;

package/dist/Columns/Columns.esm.d.ts

@@ -1,76 +1 @@
-import { FC, ReactNode } from "react";
-/**
- * Use `Columns` to compose layouts on a 12-column grid.
- */
-declare const Columns: FC<ColumnsProps> & {
-    Col: typeof Col;
-};
-declare const Col: FC<ColProps>;
-type Span = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
-type Offset = "0" | "24" | "48" | "72" | "96" | "120" | "144" | "168" | "192" | "216" | "240" | "264" | "288" | "312" | "336" | "360" | "384";
-interface ColProps {
-    /**
-     * Vertically align the Column.
-     */
-    align?: "top" | "center" | "bottom";
-    /**
-     * Content to display in the Column.
-     */
-    children?: ReactNode;
-    /**
-     * Should the Column be visible for debugging and documentation
-     * purposes?
-     */
-    isDebugVisible?: boolean;
-    /**
-     * Overlay the column over the previous content on the default breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
-     */
-    offset?: Offset;
-    /**
-     * Overlay the column over the previous content on the S breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
-     */
-    offsetS?: Offset;
-    /**
-     * Overlay the column over the previous content on the M breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
-     */
-    offsetM?: Offset;
-    /**
-     * Overlay the column over the previous content on the L breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
-     */
-    offsetL?: Offset;
-    /**
-     * Overlay the column over the previous content on the XL breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
-     */
-    offsetXL?: Offset;
-    /**
-     * The number of columns to span on the default breakpoint and above, from 1 to 12.
-     */
-    span?: Span;
-    /**
-     * The number of columns to span on the S breakpoint and above, from 1 to 12.
-     */
-    spanS?: Span;
-    /**
-     * The number of columns to span on the M breakpoint and above, from 1 to 12.
-     */
-    spanM?: Span;
-    /**
-     * The number of columns to span on the L breakpoint and above, from 1 to 12.
-     */
-    spanL?: Span;
-    /**
-     * The number of columns to span on the XL breakpoint and above, from 1 to 12.
-     */
-    spanXL?: Span;
-}
-interface ColumnsProps {
-    /**
-     * Contents of the Columns. Should only contain `Columns.Col`.
-     */
-    children: ReactNode;
-    /**
-     * Should the Columns be gutterless?
-     */
-    isGutterless?: boolean;
-}
-export { Columns };
+export { Columns } from "../_shared/esm/Columns-8704515b";

package/dist/Columns/Columns.esm.js

@@ -1,51 +1,5 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-afdb7d32.js';
-import { c as classNames } from '../_shared/esm/index-2ae58626.js';
-import React__default, { useEffect } from 'react';
-import { s as suffixModifier } from '../_shared/esm/suffix-modifier-7e640670.js';
-
-/**
- * Use `Columns` to compose layouts on a 12-column grid.
- */
-var Columns = function (_a) {
-    var children = _a.children, _b = _a.isGutterless, isGutterless = _b === void 0 ? false : _b, props = __rest(_a, ["children", "isGutterless"]);
-    useEffect(function () {
-        React__default.Children.map(children, function (item) {
-            if (item && item.type !== Col) {
-                throw new Error("Illegal child passed to <Columns />. Ensure to only use <Columns.Col />.");
-            }
-        });
-    }, [children]);
-    return (React__default.createElement("div", __assign({ className: classNames({
-            "arc-Columns": true,
-            "arc-Columns--gutterless": isGutterless
-        }) }, filterDataAttrs(props)),
-        React__default.createElement("div", { className: "arc-Columns-inner" }, children)));
-};
-var Col = function (_a) {
-    var _b;
-    var align = _a.align, children = _a.children, _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, offset = _a.offset, offsetS = _a.offsetS, offsetM = _a.offsetM, offsetL = _a.offsetL, offsetXL = _a.offsetXL, span = _a.span, spanS = _a.spanS, spanM = _a.spanM, spanL = _a.spanL, spanXL = _a.spanXL, props = __rest(_a, ["align", "children", "isDebugVisible", "offset", "offsetS", "offsetM", "offsetL", "offsetXL", "span", "spanS", "spanM", "spanL", "spanXL"]);
-    return (React__default.createElement("div", __assign({ className: classNames((_b = {},
-            _b["arc-Columns-col"] = true,
-            _b[suffixModifier("arc-Columns-col--align", align || "")] = align,
-            _b["arc-Columns-col--".concat(span)] = typeof span !== "undefined",
-            _b["arc-Columns-col--s".concat(spanS)] = typeof spanS !== "undefined",
-            _b["arc-Columns-col--m".concat(spanM)] = typeof spanM !== "undefined",
-            _b["arc-Columns-col--l".concat(spanL)] = typeof spanL !== "undefined",
-            _b["arc-Columns-col--xL".concat(spanXL)] = typeof spanXL !== "undefined",
-            _b["arc-Columns-col--offset"] = typeof offset !== "undefined" ||
-                typeof offsetS !== "undefined" ||
-                typeof offsetM !== "undefined" ||
-                typeof offsetL !== "undefined" ||
-                typeof offsetXL !== "undefined",
-            _b["arc-Columns-col--offset".concat(offset)] = typeof offset !== "undefined",
-            _b["arc-Columns-col--offsetS".concat(offsetS)] = typeof offsetS !== "undefined",
-            _b["arc-Columns-col--offsetM".concat(offsetM)] = typeof offsetM !== "undefined",
-            _b["arc-Columns-col--offsetL".concat(offsetL)] = typeof offsetL !== "undefined",
-            _b["arc-Columns-col--offsetXL".concat(offsetXL)] = typeof offsetXL !== "undefined",
-            _b["arc-Columns-col--debugVisible"] = isDebugVisible,
-            _b)) }, filterDataAttrs(props)), children));
-};
-Col.displayName = "Columns.Col";
-Columns.Col = Col;
-
-export { Columns };
+export { C as Columns } from '../_shared/esm/Columns-8704515b.js';
+import '../_shared/esm/filter-data-attrs-afdb7d32.js';
+import '../_shared/esm/index-2ae58626.js';
+import 'react';
+import '../_shared/esm/suffix-modifier-7e640670.js';

package/dist/DisclosureMini/DisclosureMini.cjs.d.ts

@@ -1 +1 @@
-export { DisclosureMini } from "../_shared/cjs/DisclosureMini-5af13d3c";
+export { DisclosureMini } from "../_shared/cjs/DisclosureMini-067e0319";

package/dist/DisclosureMini/DisclosureMini.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var DisclosureMini = require('../_shared/cjs/DisclosureMini-5af13d3c.js');
+var DisclosureMini = require('../_shared/cjs/DisclosureMini-067e0319.js');
 require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
 require('../_shared/cjs/index-45bfb67b.js');
 require('react');

package/dist/DisclosureMini/DisclosureMini.esm.d.ts

@@ -1 +1 @@
-export { DisclosureMini } from "../_shared/esm/DisclosureMini-322fccc0";
+export { DisclosureMini } from "../_shared/esm/DisclosureMini-022beae3";

package/dist/DisclosureMini/DisclosureMini.esm.js

@@ -1,4 +1,4 @@
-export { D as DisclosureMini } from '../_shared/esm/DisclosureMini-322fccc0.js';
+export { D as DisclosureMini } from '../_shared/esm/DisclosureMini-022beae3.js';
 import '../_shared/esm/filter-data-attrs-afdb7d32.js';
 import '../_shared/esm/index-2ae58626.js';
 import 'react';

package/dist/Filter/Filter.cjs.d.ts

@@ -0,0 +1 @@
+export { Filter } from "../_shared/cjs/Filter-f7d2fbda";

package/dist/Filter/Filter.cjs.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Filter = require('../_shared/cjs/Filter-f7d2fbda.js');
+require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
+require('react');
+require('../_shared/cjs/Surface-6da0a78e.js');
+require('../_shared/cjs/index-45bfb67b.js');
+
+
+
+exports.Filter = Filter.Filter;

package/dist/Filter/Filter.esm.d.ts

@@ -0,0 +1 @@
+export { Filter } from "../_shared/esm/Filter-41b391e3";

package/dist/Filter/Filter.esm.js

@@ -0,0 +1,5 @@
+export { F as Filter } from '../_shared/esm/Filter-41b391e3.js';
+import '../_shared/esm/filter-data-attrs-afdb7d32.js';
+import 'react';
+import '../_shared/esm/Surface-bb100ef8.js';
+import '../_shared/esm/index-2ae58626.js';

package/dist/Filter/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@arc-ui/filter",
+  "types": "./Filter.esm.d.ts",
+  "main": "./Filter.cjs.js",
+  "module": "./Filter.esm.js",
+  "private": true
+}

package/dist/FormControl/FormControl.cjs.d.ts

@@ -1 +1 @@
-export { FormControl, FormControlContext } from "../_shared/cjs/FormControl-42360ae8";
+export { FormControl, FormControlContext } from "../_shared/cjs/FormControl-9aaddd54";

package/dist/FormControl/FormControl.cjs.js

@@ -2,17 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var FormControl = require('../_shared/cjs/FormControl-42360ae8.js');
+var FormControl = require('../_shared/cjs/FormControl-9aaddd54.js');
 require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
 require('../_shared/cjs/index-45bfb67b.js');
 require('react');
 require('../_shared/cjs/BtIconAlert-637db790.js');
 require('../_shared/cjs/Surface-6da0a78e.js');
-require('../_shared/cjs/DisclosureMini-5af13d3c.js');
+require('../_shared/cjs/DisclosureMini-067e0319.js');
 require('../_shared/cjs/BtIconChevronDown2Px-8fb4e2eb.js');
 require('../_shared/cjs/Text-6f2827e6.js');
 require('../_shared/cjs/suffix-modifier-1ee2da04.js');
-require('../_shared/cjs/VerticalSpace-86f697e7.js');
 
 
 

package/dist/FormControl/FormControl.esm.d.ts

@@ -1 +1 @@
-export { FormControl, FormControlContext } from "../_shared/esm/FormControl-0744f93f";
+export { FormControl, FormControlContext } from "../_shared/esm/FormControl-5e3fdca3";

package/dist/FormControl/FormControl.esm.js

@@ -1,11 +1,10 @@
-export { F as FormControl, C as FormControlContext } from '../_shared/esm/FormControl-0744f93f.js';
+export { F as FormControl, C as FormControlContext } from '../_shared/esm/FormControl-5e3fdca3.js';
 import '../_shared/esm/filter-data-attrs-afdb7d32.js';
 import '../_shared/esm/index-2ae58626.js';
 import 'react';
 import '../_shared/esm/BtIconAlert-55a6ed5c.js';
 import '../_shared/esm/Surface-bb100ef8.js';
-import '../_shared/esm/DisclosureMini-322fccc0.js';
+import '../_shared/esm/DisclosureMini-022beae3.js';
 import '../_shared/esm/BtIconChevronDown2Px-782876e2.js';
 import '../_shared/esm/Text-00e9743b.js';
 import '../_shared/esm/suffix-modifier-7e640670.js';
-import '../_shared/esm/VerticalSpace-93980c9c.js';