reshaped 2.8.0 → 2.8.1

package/components/Checkbox/Checkbox.js

@@ -1,43 +0,0 @@
-"use client";
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import useIsomorphicLayoutEffect from "../../hooks/useIsomorphicLayoutEffect.js";
-import HiddenInput from "../_private/HiddenInput/index.js";
-import { useFormControl } from "../FormControl/index.js";
-import { useCheckboxGroup } from "../CheckboxGroup/index.js";
-import Icon from "../Icon/index.js";
-import IconCheckmark from "../../icons/Checkmark.js";
-import s from "./Checkbox.module.css";
-const Checkbox = (props) => {
-    var _a;
-    const { children, value, onChange, onFocus, onBlur, indeterminate, className, attributes, inputAttributes, } = props;
-    const checkboxGroup = useCheckboxGroup();
-    const formControl = useFormControl();
-    const hasError = (formControl === null || formControl === void 0 ? void 0 : formControl.hasError) || props.hasError || (checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.hasError);
-    const disabled = (formControl === null || formControl === void 0 ? void 0 : formControl.disabled) || props.disabled || (checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.disabled);
-    const checked = checkboxGroup ? (_a = checkboxGroup.value) === null || _a === void 0 ? void 0 : _a.includes(value) : props.checked;
-    const defaultChecked = checkboxGroup ? undefined : props.defaultChecked;
-    const name = checkboxGroup ? checkboxGroup.name : props.name;
-    const inputRef = React.useRef(null);
-    const rootClassName = classNames(s.root, className, hasError && s["--error"], disabled && s["--disabled"]);
-    const handleChange = (event) => {
-        if (!name)
-            return;
-        const { checked } = event.target;
-        const changeArgs = { name, value, checked, event };
-        if (onChange)
-            onChange(changeArgs);
-        if (checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.onChange)
-            checkboxGroup.onChange(changeArgs);
-    };
-    useIsomorphicLayoutEffect(() => {
-        inputRef.current.indeterminate = indeterminate || false;
-    }, [indeterminate, checked]);
-    return (React.createElement("label", Object.assign({}, attributes, { className: rootClassName }),
-        React.createElement("span", { className: s.field },
-            React.createElement(HiddenInput, { className: s.input, type: "checkbox", checked: checked, defaultChecked: defaultChecked, name: name, disabled: disabled, value: value, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, attributes: Object.assign(Object.assign({}, inputAttributes), { ref: inputRef }) }),
-            React.createElement("div", { className: s.decorator },
-                React.createElement(Icon, { svg: IconCheckmark, className: s.icon }))),
-        children && React.createElement("span", { className: s.text }, children)));
-};
-export default Checkbox;

package/components/Checkbox/Checkbox.types.d.ts

@@ -1,26 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-type BaseProps = {
-    children?: React.ReactNode;
-    name?: string;
-    disabled?: boolean;
-    hasError?: boolean;
-    value?: string;
-    indeterminate?: boolean;
-    onChange?: G.ChangeHandler<boolean>;
-    onFocus?: (e: React.FocusEvent) => void;
-    onBlur?: (e: React.FocusEvent) => void;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"label", Props>;
-    inputAttributes?: G.Attributes<"input", Props>;
-};
-export type ControlledProps = BaseProps & {
-    checked: boolean;
-    defaultChecked?: never;
-};
-export type UncontrolledProps = BaseProps & {
-    checked?: never;
-    defaultChecked?: boolean;
-};
-export type Props = ControlledProps | UncontrolledProps;
-export {};

package/components/CheckboxGroup/CheckboxGroup.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type * as T from "./CheckboxGroup.types";
-declare const CheckboxGroup: (props: T.Props) => React.JSX.Element;
-export default CheckboxGroup;

package/components/CheckboxGroup/CheckboxGroup.js

@@ -1,10 +0,0 @@
-import React from "react";
-import CheckboxGroupControlled from "./CheckboxGroupControlled.js";
-import CheckboxGroupUncontrolled from "./CheckboxGroupUncontrolled.js";
-const CheckboxGroup = (props) => {
-    const { value } = props;
-    if (value !== undefined)
-        return React.createElement(CheckboxGroupControlled, Object.assign({}, props));
-    return React.createElement(CheckboxGroupUncontrolled, Object.assign({}, props));
-};
-export default CheckboxGroup;

package/components/CheckboxGroup/CheckboxGroup.types.d.ts

@@ -1,28 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-import { CheckboxProps } from "../Checkbox";
-type BaseProps = {
-    id?: string;
-    children?: React.ReactNode;
-    hasError?: boolean;
-    disabled?: boolean;
-    name: string;
-    onChange?: G.ChangeHandler<string[]>;
-};
-export type ControlledProps = BaseProps & {
-    value: string[];
-    defaultValue?: never;
-};
-export type UncontrolledProps = BaseProps & {
-    value?: never;
-    defaultValue?: string[];
-};
-export type Props = ControlledProps | UncontrolledProps;
-export type Context = {
-    onChange: CheckboxProps["onChange"];
-    hasError?: boolean;
-    disabled?: boolean;
-    name: string;
-    value?: string[];
-};
-export {};

package/components/CheckboxGroup/CheckboxGroupControlled.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type * as T from "./CheckboxGroup.types";
-declare const CheckboxGroupControlled: (props: T.ControlledProps) => React.JSX.Element;
-export default CheckboxGroupControlled;

package/components/CheckboxGroup/CheckboxGroupControlled.js

@@ -1,22 +0,0 @@
-"use client";
-import React from "react";
-import Context from "./CheckboxGroup.context.js";
-const CheckboxGroupControlled = (props) => {
-    const { onChange, name, disabled, value, children, hasError } = props;
-    const handleChange = (args) => {
-        const { event, value: fieldValue, checked } = args;
-        if (!fieldValue)
-            return;
-        let nextValue = [...value];
-        if (checked) {
-            nextValue.push(fieldValue);
-        }
-        else {
-            nextValue = nextValue.filter((v) => v !== fieldValue);
-        }
-        if (onChange)
-            onChange({ name, value: nextValue, event });
-    };
-    return (React.createElement(Context.Provider, { value: { onChange: handleChange, disabled, value, name, hasError } }, children));
-};
-export default CheckboxGroupControlled;

package/components/CheckboxGroup/CheckboxGroupUncontrolled.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type * as T from "./CheckboxGroup.types";
-declare const CheckboxGroupUncontrolled: (props: T.UncontrolledProps) => React.JSX.Element;
-export default CheckboxGroupUncontrolled;

package/components/CheckboxGroup/CheckboxGroupUncontrolled.js

@@ -1,16 +0,0 @@
-"use client";
-import React from "react";
-import CheckboxGroupControlled from "./CheckboxGroupControlled.js";
-const CheckboxGroupUncontrolled = (props) => {
-    const { defaultValue, onChange } = props;
-    const [value, setValue] = React.useState(defaultValue || []);
-    const handleChange = (args) => {
-        if (!args.value)
-            return;
-        setValue(args.value);
-        if (onChange)
-            onChange(args);
-    };
-    return (React.createElement(CheckboxGroupControlled, Object.assign({}, props, { value: value, defaultValue: undefined, onChange: handleChange })));
-};
-export default CheckboxGroupUncontrolled;

package/components/Container/Container.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type * as T from "./Container.types";
-declare const Container: (props: T.Props) => React.JSX.Element;
-export default Container;

package/components/Container/Container.js

@@ -1,10 +0,0 @@
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import View from "../View/index.js";
-import s from "./Container.module.css";
-const Container = (props) => {
-    const { children, padding = 4, width, className, attributes } = props;
-    const rootClassNames = classNames(s.root, className);
-    return (React.createElement(View, { attributes: attributes, className: rootClassNames, paddingInline: padding, width: width, maxWidth: "100%" }, children));
-};
-export default Container;

package/components/Container/Container.types.d.ts

@@ -1,9 +0,0 @@
-import React from "react";
-import type { ViewProps } from "../View";
-import type * as G from "../../types/global";
-export type Props = Pick<ViewProps, "padding"> & {
-    width?: G.Responsive<string | number>;
-    children?: React.ReactNode;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"div">;
-};

package/components/Dismissible/Dismissible.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type * as T from "./Dismissible.types";
-declare const Dismissible: (props: T.Props) => React.JSX.Element;
-export default Dismissible;

package/components/Dismissible/Dismissible.js

@@ -1,15 +0,0 @@
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import Button from "../Button/index.js";
-import IconClose from "../../icons/Close.js";
-import s from "./Dismissible.module.css";
-const Dismissible = (props) => {
-    const { children, align, onClose, hideCloseButton, variant, closeAriaLabel, className, attributes, } = props;
-    const rootClassNames = classNames(s.root, className, variant && s[`--variant-${variant}`], align && s[`--align-${align}`], hideCloseButton && s["--hide-close"]);
-    const WrapperTag = variant === "media" ? "div" : Button.Aligner;
-    return (React.createElement("div", Object.assign({}, attributes, { className: rootClassNames }),
-        children,
-        !hideCloseButton && (React.createElement(WrapperTag, { className: s.close },
-            React.createElement(Button, Object.assign({ size: "small" }, (variant === "media" ? { color: "black", variant: "faded" } : { variant: "ghost" }), { onClick: onClose, attributes: { "aria-label": onClose ? closeAriaLabel : undefined }, icon: IconClose }))))));
-};
-export default Dismissible;

package/components/Dismissible/Dismissible.types.d.ts

@@ -1,20 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-type WithClose = {
-    hideCloseButton: true;
-    closeAriaLabel?: string;
-};
-type WithoutClose = {
-    hideCloseButton?: false;
-    closeAriaLabel: string;
-};
-export type CloseProps = WithClose | WithoutClose;
-export type Props = CloseProps & {
-    variant?: "media";
-    align?: "top" | "center";
-    children?: React.ReactNode;
-    onClose?: () => void;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"div", Props>;
-};
-export {};

package/components/Divider/Divider.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type * as T from "./Divider.types";
-declare const Divider: (props: T.Props) => React.JSX.Element;
-export default Divider;

package/components/Divider/Divider.js

@@ -1,14 +0,0 @@
-import React from "react";
-import { classNames, responsiveClassNames } from "../../utilities/helpers.js";
-import s from "./Divider.module.css";
-const Divider = (props) => {
-    const { vertical, blank, className, attributes } = props;
-    const rootClassNames = classNames(s.root, className, blank && s["--blank"], ...responsiveClassNames(s, "--vertical", vertical));
-    // Only support aria-orientation for non-responsive dividers
-    let ariaOrientation;
-    if (typeof vertical === "boolean" || vertical === undefined) {
-        ariaOrientation = vertical ? "vertical" : "horizontal";
-    }
-    return (React.createElement("div", Object.assign({}, attributes, { role: "separator", "aria-orientation": ariaOrientation, className: rootClassNames })));
-};
-export default Divider;

package/components/DropdownMenu/DropdownMenu.d.ts

@@ -1,13 +0,0 @@
-import React from "react";
-import { MenuItemProps } from "../MenuItem";
-import type * as T from "./DropdownMenu.types";
-declare const DropdownMenu: {
-    (props: T.Props): React.JSX.Element;
-    Trigger: (props: import("../_private/Flyout").FlyoutTriggerProps) => React.JSX.Element;
-    Content: (props: T.ContentProps) => React.JSX.Element;
-    Section: (props: T.SectionProps) => React.JSX.Element;
-    Item: (props: Omit<MenuItemProps, "roundedCorners">) => React.JSX.Element;
-    SubMenu: (props: T.SubMenuProps) => React.JSX.Element;
-    SubTrigger: (props: T.SubTriggerProps) => React.JSX.Element;
-};
-export default DropdownMenu;

package/components/DropdownMenu/DropdownMenu.js

@@ -1,90 +0,0 @@
-"use client";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import React from "react";
-import Popover from "../Popover/index.js";
-import MenuItem from "../MenuItem/index.js";
-import Icon from "../Icon/index.js";
-import { useFlyoutContext } from "../_private/Flyout/index.js";
-import IconChevronRight from "../../icons/ChevronRight.js";
-import useHotkeys from "../../hooks/useHotkeys.js";
-import useRTL from "../../hooks/useRTL.js";
-import { getActiveElement } from "../../utilities/a11y.js";
-import { classNames } from "../../utilities/helpers.js";
-import * as keys from "../../constants/keys.js";
-import s from "./DropdownMenu.module.css";
-const DropdownMenuSubContext = React.createContext(null);
-const DropdownMenu = (props) => {
-    const { children, position = "bottom-start", triggerType = "click", trapFocusMode = "action-menu" } = props, popoverProps = __rest(props, ["children", "position", "triggerType", "trapFocusMode"]);
-    return (React.createElement(Popover, Object.assign({}, popoverProps, { position: position, padding: 0, trapFocusMode: trapFocusMode, triggerType: triggerType }), children));
-};
-const DropdownMenuContent = (props) => {
-    const { children, attributes, className } = props;
-    const subMenuInstance = React.useContext(DropdownMenuSubContext);
-    const [rtl] = useRTL();
-    const { ref } = useHotkeys({
-        [rtl ? keys.RIGHT : keys.LEFT]: () => {
-            var _a;
-            (_a = subMenuInstance === null || subMenuInstance === void 0 ? void 0 : subMenuInstance.current) === null || _a === void 0 ? void 0 : _a.close();
-        },
-        [keys.ENTER]: () => {
-            const el = getActiveElement();
-            el === null || el === void 0 ? void 0 : el.click();
-        },
-    }, [subMenuInstance === null || subMenuInstance === void 0 ? void 0 : subMenuInstance.current]);
-    const contentClassName = classNames(s.menu, className);
-    return (React.createElement(Popover.Content, { className: contentClassName, attributes: Object.assign(Object.assign({}, attributes), { ref }) }, children));
-};
-const DropdownMenuSection = (props) => {
-    const { children } = props;
-    return (React.createElement("div", { className: s.section, role: "group" }, children));
-};
-const DropdownMenuItem = (props) => {
-    const { onClick } = props;
-    const { handleClose } = useFlyoutContext();
-    const handleClick = (e) => {
-        if (handleClose)
-            handleClose({ closeParents: true });
-        if (onClick)
-            onClick(e);
-    };
-    return (React.createElement(MenuItem, Object.assign({}, props, { roundedCorners: true, className: s.item, attributes: Object.assign({ role: "menuitem" }, props.attributes), onClick: handleClick })));
-};
-const DropdownMenuSubMenu = (props) => {
-    const { children } = props;
-    const dropdownMenuRef = React.useRef();
-    return (React.createElement(DropdownMenuSubContext.Provider, { value: dropdownMenuRef },
-        React.createElement(DropdownMenu, { triggerType: "hover", position: "end-top", contentGap: 0.5, instanceRef: dropdownMenuRef }, children)));
-};
-const DropdownMenuSubTriggerItem = (props) => {
-    const { children, attributes } = props, menuItemProps = __rest(props, ["children", "attributes"]);
-    const subMenuInstance = React.useContext(DropdownMenuSubContext);
-    const [rtl] = useRTL();
-    const { ref } = useHotkeys({
-        [rtl ? keys.LEFT : keys.RIGHT]: () => {
-            var _a;
-            (_a = subMenuInstance === null || subMenuInstance === void 0 ? void 0 : subMenuInstance.current) === null || _a === void 0 ? void 0 : _a.open();
-        },
-    }, [], { ref: attributes === null || attributes === void 0 ? void 0 : attributes.ref });
-    return (React.createElement(DropdownMenuItem, Object.assign({}, menuItemProps, { attributes: Object.assign(Object.assign({}, attributes), { ref }), endSlot: React.createElement(Icon, { autoWidth: true, svg: IconChevronRight, className: s.arrow }) }), children));
-};
-const DropdownMenuSubTrigger = (props) => {
-    const { children } = props;
-    return (React.createElement(DropdownMenu.Trigger, null, (attributes) => (React.createElement(DropdownMenuSubTriggerItem, { attributes: attributes }, children))));
-};
-DropdownMenu.Trigger = Popover.Trigger;
-DropdownMenu.Content = DropdownMenuContent;
-DropdownMenu.Section = DropdownMenuSection;
-DropdownMenu.Item = DropdownMenuItem;
-DropdownMenu.SubMenu = DropdownMenuSubMenu;
-DropdownMenu.SubTrigger = DropdownMenuSubTrigger;
-export default DropdownMenu;

package/components/DropdownMenu/DropdownMenu.types.d.ts

@@ -1,16 +0,0 @@
-import React from "react";
-import type { PopoverProps } from "../Popover";
-import type { FlyoutContentProps } from "../_private/Flyout";
-export type Props = Pick<PopoverProps, "children" | "position" | "forcePosition" | "triggerType" | "contentGap" | "onOpen" | "onClose" | "active" | "defaultActive" | "width" | "disableHideAnimation" | "instanceRef"> & {
-    trapFocusMode?: Extract<PopoverProps["trapFocusMode"], "action-menu" | "selection-menu">;
-};
-export type ContentProps = Pick<FlyoutContentProps, "attributes" | "children" | "className">;
-export type SectionProps = {
-    children: React.ReactNode;
-};
-export type SubMenuProps = {
-    children: React.ReactNode;
-};
-export type SubTriggerProps = {
-    children: React.ReactNode;
-};

package/components/FileUpload/FileUpload.d.ts

@@ -1,7 +0,0 @@
-import React from "react";
-import type * as T from "./FileUpload.types";
-declare const FileUpload: {
-    (props: T.Props): React.JSX.Element;
-    Trigger: (props: T.TriggerProps) => React.JSX.Element;
-};
-export default FileUpload;

package/components/FileUpload/FileUpload.js

@@ -1,56 +0,0 @@
-"use client";
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import View from "../View/index.js";
-import HiddenVisually from "../HiddenVisually/index.js";
-import useToggle from "../../hooks/useToggle.js";
-import s from "./FileUpload.module.css";
-const FileUploadTrigger = (props) => {
-    const { children } = props;
-    return React.createElement("span", { className: s.trigger }, children);
-};
-const FileUpload = (props) => {
-    const { name, children, className, attributes, inputAttributes, onChange } = props;
-    const highlightToggle = useToggle();
-    const rootClassNames = classNames(s.root, highlightToggle.active && s["--highlighted"], className);
-    const handleDragOver = (event) => {
-        var _a;
-        event.preventDefault();
-        (_a = attributes === null || attributes === void 0 ? void 0 : attributes.onDragOver) === null || _a === void 0 ? void 0 : _a.call(attributes, event);
-    };
-    const handleDragEnter = (event) => {
-        var _a;
-        highlightToggle.activate();
-        (_a = attributes === null || attributes === void 0 ? void 0 : attributes.onDragEnter) === null || _a === void 0 ? void 0 : _a.call(attributes, event);
-    };
-    const handleDragLeave = (event) => {
-        var _a;
-        // Ignore elements inside the field
-        if (event.currentTarget.contains(event.relatedTarget))
-            return;
-        highlightToggle.deactivate();
-        (_a = attributes === null || attributes === void 0 ? void 0 : attributes.onDragLeave) === null || _a === void 0 ? void 0 : _a.call(attributes, event);
-    };
-    const handleDrop = (event) => {
-        var _a;
-        event.preventDefault();
-        highlightToggle.deactivate();
-        onChange === null || onChange === void 0 ? void 0 : onChange({ name, value: Array.from(event.dataTransfer.files), event });
-        (_a = attributes === null || attributes === void 0 ? void 0 : attributes.onDrop) === null || _a === void 0 ? void 0 : _a.call(attributes, event);
-    };
-    const handleChange = (event) => {
-        var _a;
-        const nextValue = event.target.files;
-        if (!nextValue)
-            return;
-        onChange === null || onChange === void 0 ? void 0 : onChange({ name, event, value: Array.from(nextValue) });
-        (_a = inputAttributes === null || inputAttributes === void 0 ? void 0 : inputAttributes.onChange) === null || _a === void 0 ? void 0 : _a.call(inputAttributes, event);
-    };
-    return (React.createElement("div", Object.assign({}, attributes, { className: rootClassNames, onDragOver: handleDragOver, onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDrop: handleDrop }),
-        React.createElement(View, { as: "label", className: s.triggerLayer, padding: 6, borderRadius: "medium", gap: 2, align: "center", textAlign: "center", animated: true },
-            React.createElement(View.Item, null, children),
-            React.createElement(HiddenVisually, null,
-                React.createElement("input", Object.assign({}, inputAttributes, { type: "file", className: s.field, name: name, onChange: handleChange }))))));
-};
-FileUpload.Trigger = FileUploadTrigger;
-export default FileUpload;

package/components/FileUpload/FileUpload.types.d.ts

@@ -1,13 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-export type Props = {
-    name: string;
-    children?: React.ReactNode;
-    onChange?: G.ChangeHandler<File[], React.DragEvent<HTMLDivElement> | React.ChangeEvent<HTMLInputElement>>;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"div", Props>;
-    inputAttributes?: G.Attributes<"input">;
-};
-export type TriggerProps = {
-    children: React.ReactNode;
-};

package/components/FormControl/FormControl.d.ts

@@ -1,9 +0,0 @@
-import React from "react";
-import type * as T from "./FormControl.types";
-declare const FormControl: {
-    (props: T.Props): React.JSX.Element;
-    Label: (props: T.LabelProps) => React.JSX.Element;
-    Helper: (props: T.CaptionProps) => React.JSX.Element;
-    Error: (props: T.CaptionProps) => React.JSX.Element | null;
-};
-export default FormControl;

package/components/FormControl/FormControl.js

@@ -1,68 +0,0 @@
-"use client";
-import React from "react";
-import useElementId from "../../hooks/useElementId.js";
-import Text from "../Text/index.js";
-import { Provider, useFormControlPrivate } from "./FormControl.context.js";
-import s from "./FormControl.module.css";
-const getCaptionId = (id, variant) => `${id}-${variant || "caption"}`;
-const FormControl = (props) => {
-    const { children, id: passedId, required, hasError, group, disabled, size } = props;
-    const id = useElementId(passedId);
-    const WrapperTagName = group ? "fieldset" : "div";
-    const [helperRendered, setHelperRendered] = React.useState(false);
-    const [errorRendered, setErrorRendered] = React.useState(false);
-    const describedby = [
-        helperRendered && getCaptionId(id),
-        errorRendered && getCaptionId(id, "error"),
-    ]
-        .filter(Boolean)
-        .join(" ");
-    const attributes = { id, "aria-describedby": describedby };
-    const errorRef = () => {
-        setErrorRendered(true);
-    };
-    const helperRef = () => {
-        setHelperRendered(true);
-    };
-    return (React.createElement(WrapperTagName, null,
-        React.createElement(Provider, { value: { required, hasError, errorRef, helperRef, attributes, group, disabled, size } }, children)));
-};
-const FormControlLabel = (props) => {
-    const { children } = props;
-    const { attributes, required, group, disabled, size } = useFormControlPrivate();
-    const id = `${attributes.id}-label`;
-    const tagProps = group
-        ? { as: "legend", attributes: { id } }
-        : {
-            as: "label",
-            attributes: { id, htmlFor: attributes.id },
-        };
-    return (React.createElement(Text, Object.assign({}, tagProps, { variant: size === "large" ? "body-2" : "body-3", weight: "medium", className: s.label, color: disabled ? "disabled" : undefined }),
-        children,
-        required && (React.createElement(Text, { color: disabled ? "disabled" : "critical", as: "span" }, "*"))));
-};
-/* Private component */
-const FormControlCaption = (props) => {
-    const { children, variant, disabled } = props;
-    const { attributes, size, helperRef, errorRef } = useFormControlPrivate();
-    const id = getCaptionId(attributes.id, variant);
-    const color = variant === "error" ? "critical" : "neutral-faded";
-    const ref = variant === "error" ? errorRef : helperRef;
-    return (React.createElement(Text, { as: "span", variant: size === "large" ? "body-3" : "caption-1", color: disabled && !variant ? "disabled" : color, attributes: { id, role: color ? "alert" : undefined, ref }, className: s.caption }, children));
-};
-const FormControlHelper = (props) => {
-    const { children } = props;
-    const { disabled } = useFormControlPrivate();
-    return React.createElement(FormControlCaption, { disabled: disabled }, children);
-};
-const FormControlError = (props) => {
-    const { children } = props;
-    const { hasError } = useFormControlPrivate();
-    if (!hasError)
-        return null;
-    return React.createElement(FormControlCaption, { variant: "error" }, children);
-};
-FormControl.Label = FormControlLabel;
-FormControl.Helper = FormControlHelper;
-FormControl.Error = FormControlError;
-export default FormControl;

package/components/FormControl/FormControl.types.d.ts

@@ -1,33 +0,0 @@
-import React from "react";
-export type Props = {
-    children: React.ReactNode;
-    size?: "medium" | "large";
-    hasError?: boolean;
-    required?: boolean;
-    disabled?: boolean;
-    group?: boolean;
-    id?: string;
-};
-export type LabelProps = {
-    children: React.ReactNode;
-};
-export type CaptionProps = {
-    children: React.ReactNode;
-};
-export type PrivateCaptionProps = CaptionProps & {
-    variant?: "error";
-    disabled?: boolean;
-};
-type Attributes = {
-    [K in keyof React.HTMLAttributes<HTMLElement>]?: React.HTMLAttributes<HTMLElement>[K];
-};
-export type Context = {
-    required?: boolean;
-    group?: boolean;
-    attributes: Attributes & {
-        id: string;
-    };
-    helperRef: () => void;
-    errorRef: () => void;
-} & Pick<Props, "hasError" | "disabled" | "size">;
-export {};

package/components/Hidden/Hidden.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type * as T from "./Hidden.types";
-declare const Hidden: (props: T.Props) => React.JSX.Element;
-export default Hidden;

package/components/Hidden/Hidden.js

@@ -1,11 +0,0 @@
-import React from "react";
-import { classNames, responsiveClassNames } from "../../utilities/helpers.js";
-import s from "./Hidden.module.css";
-const Hidden = (props) => {
-    const { as: TagName = "div", children, visibility, hide, displayStyle } = props;
-    const rootClassNames = classNames(s.root, ...responsiveClassNames(s, "--hidden", hide), visibility && s["--visibility"], displayStyle && s[`--display-${displayStyle}`]);
-    if (typeof children === "function")
-        return React.createElement(React.Fragment, null, children(rootClassNames));
-    return React.createElement(TagName, { className: rootClassNames }, children);
-};
-export default Hidden;

package/components/Hidden/Hidden.types.d.ts

@@ -1,9 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-export type Props = {
-    hide?: G.Responsive<boolean>;
-    visibility?: boolean;
-    as?: keyof JSX.IntrinsicElements;
-    displayStyle?: "inline" | "flex";
-    children: ((className: string) => React.ReactNode) | React.ReactNode;
-};

package/components/HiddenVisually/HiddenVisually.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type * as T from "./HiddenVisually.types";
-declare const HiddenVisually: (props: T.Props) => React.JSX.Element;
-export default HiddenVisually;

package/components/HiddenVisually/HiddenVisually.js

@@ -1,7 +0,0 @@
-import React from "react";
-import s from "./HiddenVisually.module.css";
-const HiddenVisually = (props) => {
-    const { children } = props;
-    return React.createElement("div", { className: s.root }, children);
-};
-export default HiddenVisually;

package/components/HiddenVisually/HiddenVisually.types.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-export type Props = {
-    children?: React.ReactNode;
-};

package/components/Hotkey/Hotkey.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type * as T from "./Hotkey.types";
-declare const Hotkey: (props: T.Props) => React.JSX.Element;
-export default Hotkey;