@arc-ui/components 12.0.0-alpha.0 → 12.0.0-beta.10

package/dist/_shared/cjs/index-4dd46cbe.js

@@ -1,289 +0,0 @@
-'use strict';
-
-var _extends = require('./extends-8c5e4b48.js');
-var React = require('react');
-var index = require('./index-4aa11039.js');
-var $7SXl2$reactdom = require('react-dom');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var $7SXl2$reactdom__default = /*#__PURE__*/_interopDefaultLegacy($7SXl2$reactdom);
-
-/**
- * Listens for when the escape key is down
- */ function $addc16e1bbe58fd0$export$3a72a57244d6e765(onEscapeKeyDownProp, ownerDocument = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) {
-    const onEscapeKeyDown = index.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onEscapeKeyDownProp);
-    React.useEffect(()=>{
-        const handleKeyDown = (event)=>{
-            if (event.key === 'Escape') onEscapeKeyDown(event);
-        };
-        ownerDocument.addEventListener('keydown', handleKeyDown);
-        return ()=>ownerDocument.removeEventListener('keydown', handleKeyDown)
-        ;
-    }, [
-        onEscapeKeyDown,
-        ownerDocument
-    ]);
-}
-
-const $5cb92bef7577960e$var$CONTEXT_UPDATE = 'dismissableLayer.update';
-const $5cb92bef7577960e$var$POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';
-const $5cb92bef7577960e$var$FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';
-let $5cb92bef7577960e$var$originalBodyPointerEvents;
-const $5cb92bef7577960e$var$DismissableLayerContext = /*#__PURE__*/ React.createContext({
-    layers: new Set(),
-    layersWithOutsidePointerEventsDisabled: new Set(),
-    branches: new Set()
-});
-const $5cb92bef7577960e$export$177fb62ff3ec1f22 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
-    var _node$ownerDocument;
-    const { disableOutsidePointerEvents: disableOutsidePointerEvents = false , onEscapeKeyDown: onEscapeKeyDown , onPointerDownOutside: onPointerDownOutside , onFocusOutside: onFocusOutside , onInteractOutside: onInteractOutside , onDismiss: onDismiss , ...layerProps } = props;
-    const context = React.useContext($5cb92bef7577960e$var$DismissableLayerContext);
-    const [node1, setNode] = React.useState(null);
-    const ownerDocument = (_node$ownerDocument = node1 === null || node1 === void 0 ? void 0 : node1.ownerDocument) !== null && _node$ownerDocument !== void 0 ? _node$ownerDocument : globalThis === null || globalThis === void 0 ? void 0 : globalThis.document;
-    const [, force] = React.useState({});
-    const composedRefs = index.$6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setNode(node)
-    );
-    const layers = Array.from(context.layers);
-    const [highestLayerWithOutsidePointerEventsDisabled] = [
-        ...context.layersWithOutsidePointerEventsDisabled
-    ].slice(-1); // prettier-ignore
-    const highestLayerWithOutsidePointerEventsDisabledIndex = layers.indexOf(highestLayerWithOutsidePointerEventsDisabled); // prettier-ignore
-    const index$1 = node1 ? layers.indexOf(node1) : -1;
-    const isBodyPointerEventsDisabled = context.layersWithOutsidePointerEventsDisabled.size > 0;
-    const isPointerEventsEnabled = index$1 >= highestLayerWithOutsidePointerEventsDisabledIndex;
-    const pointerDownOutside = $5cb92bef7577960e$var$usePointerDownOutside((event)=>{
-        const target = event.target;
-        const isPointerDownOnBranch = [
-            ...context.branches
-        ].some((branch)=>branch.contains(target)
-        );
-        if (!isPointerEventsEnabled || isPointerDownOnBranch) return;
-        onPointerDownOutside === null || onPointerDownOutside === void 0 || onPointerDownOutside(event);
-        onInteractOutside === null || onInteractOutside === void 0 || onInteractOutside(event);
-        if (!event.defaultPrevented) onDismiss === null || onDismiss === void 0 || onDismiss();
-    }, ownerDocument);
-    const focusOutside = $5cb92bef7577960e$var$useFocusOutside((event)=>{
-        const target = event.target;
-        const isFocusInBranch = [
-            ...context.branches
-        ].some((branch)=>branch.contains(target)
-        );
-        if (isFocusInBranch) return;
-        onFocusOutside === null || onFocusOutside === void 0 || onFocusOutside(event);
-        onInteractOutside === null || onInteractOutside === void 0 || onInteractOutside(event);
-        if (!event.defaultPrevented) onDismiss === null || onDismiss === void 0 || onDismiss();
-    }, ownerDocument);
-    $addc16e1bbe58fd0$export$3a72a57244d6e765((event)=>{
-        const isHighestLayer = index$1 === context.layers.size - 1;
-        if (!isHighestLayer) return;
-        onEscapeKeyDown === null || onEscapeKeyDown === void 0 || onEscapeKeyDown(event);
-        if (!event.defaultPrevented && onDismiss) {
-            event.preventDefault();
-            onDismiss();
-        }
-    }, ownerDocument);
-    React.useEffect(()=>{
-        if (!node1) return;
-        if (disableOutsidePointerEvents) {
-            if (context.layersWithOutsidePointerEventsDisabled.size === 0) {
-                $5cb92bef7577960e$var$originalBodyPointerEvents = ownerDocument.body.style.pointerEvents;
-                ownerDocument.body.style.pointerEvents = 'none';
-            }
-            context.layersWithOutsidePointerEventsDisabled.add(node1);
-        }
-        context.layers.add(node1);
-        $5cb92bef7577960e$var$dispatchUpdate();
-        return ()=>{
-            if (disableOutsidePointerEvents && context.layersWithOutsidePointerEventsDisabled.size === 1) ownerDocument.body.style.pointerEvents = $5cb92bef7577960e$var$originalBodyPointerEvents;
-        };
-    }, [
-        node1,
-        ownerDocument,
-        disableOutsidePointerEvents,
-        context
-    ]);
-    /**
-   * We purposefully prevent combining this effect with the `disableOutsidePointerEvents` effect
-   * because a change to `disableOutsidePointerEvents` would remove this layer from the stack
-   * and add it to the end again so the layering order wouldn't be _creation order_.
-   * We only want them to be removed from context stacks when unmounted.
-   */ React.useEffect(()=>{
-        return ()=>{
-            if (!node1) return;
-            context.layers.delete(node1);
-            context.layersWithOutsidePointerEventsDisabled.delete(node1);
-            $5cb92bef7577960e$var$dispatchUpdate();
-        };
-    }, [
-        node1,
-        context
-    ]);
-    React.useEffect(()=>{
-        const handleUpdate = ()=>force({})
-        ;
-        document.addEventListener($5cb92bef7577960e$var$CONTEXT_UPDATE, handleUpdate);
-        return ()=>document.removeEventListener($5cb92bef7577960e$var$CONTEXT_UPDATE, handleUpdate)
-        ;
-    }, []);
-    return /*#__PURE__*/ React.createElement(index.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({}, layerProps, {
-        ref: composedRefs,
-        style: {
-            pointerEvents: isBodyPointerEventsDisabled ? isPointerEventsEnabled ? 'auto' : 'none' : undefined,
-            ...props.style
-        },
-        onFocusCapture: index.$e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onFocusCapture, focusOutside.onFocusCapture),
-        onBlurCapture: index.$e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onBlurCapture, focusOutside.onBlurCapture),
-        onPointerDownCapture: index.$e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerDownCapture, pointerDownOutside.onPointerDownCapture)
-    }));
-});
-const $5cb92bef7577960e$export$4d5eb2109db14228 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
-    const context = React.useContext($5cb92bef7577960e$var$DismissableLayerContext);
-    const ref = React.useRef(null);
-    const composedRefs = index.$6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, ref);
-    React.useEffect(()=>{
-        const node = ref.current;
-        if (node) {
-            context.branches.add(node);
-            return ()=>{
-                context.branches.delete(node);
-            };
-        }
-    }, [
-        context.branches
-    ]);
-    return /*#__PURE__*/ React.createElement(index.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({}, props, {
-        ref: composedRefs
-    }));
-});
-/* -----------------------------------------------------------------------------------------------*/ /**
- * Listens for `pointerdown` outside a react subtree. We use `pointerdown` rather than `pointerup`
- * to mimic layer dismissing behaviour present in OS.
- * Returns props to pass to the node we want to check for outside events.
- */ function $5cb92bef7577960e$var$usePointerDownOutside(onPointerDownOutside, ownerDocument = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) {
-    const handlePointerDownOutside = index.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onPointerDownOutside);
-    const isPointerInsideReactTreeRef = React.useRef(false);
-    const handleClickRef = React.useRef(()=>{});
-    React.useEffect(()=>{
-        const handlePointerDown = (event)=>{
-            if (event.target && !isPointerInsideReactTreeRef.current) {
-                const eventDetail = {
-                    originalEvent: event
-                };
-                function handleAndDispatchPointerDownOutsideEvent() {
-                    $5cb92bef7577960e$var$handleAndDispatchCustomEvent($5cb92bef7577960e$var$POINTER_DOWN_OUTSIDE, handlePointerDownOutside, eventDetail, {
-                        discrete: true
-                    });
-                }
-                /**
-         * On touch devices, we need to wait for a click event because browsers implement
-         * a ~350ms delay between the time the user stops touching the display and when the
-         * browser executres events. We need to ensure we don't reactivate pointer-events within
-         * this timeframe otherwise the browser may execute events that should have been prevented.
-         *
-         * Additionally, this also lets us deal automatically with cancellations when a click event
-         * isn't raised because the page was considered scrolled/drag-scrolled, long-pressed, etc.
-         *
-         * This is why we also continuously remove the previous listener, because we cannot be
-         * certain that it was raised, and therefore cleaned-up.
-         */ if (event.pointerType === 'touch') {
-                    ownerDocument.removeEventListener('click', handleClickRef.current);
-                    handleClickRef.current = handleAndDispatchPointerDownOutsideEvent;
-                    ownerDocument.addEventListener('click', handleClickRef.current, {
-                        once: true
-                    });
-                } else handleAndDispatchPointerDownOutsideEvent();
-            }
-            isPointerInsideReactTreeRef.current = false;
-        };
-        /**
-     * if this hook executes in a component that mounts via a `pointerdown` event, the event
-     * would bubble up to the document and trigger a `pointerDownOutside` event. We avoid
-     * this by delaying the event listener registration on the document.
-     * This is not React specific, but rather how the DOM works, ie:
-     * ```
-     * button.addEventListener('pointerdown', () => {
-     *   console.log('I will log');
-     *   document.addEventListener('pointerdown', () => {
-     *     console.log('I will also log');
-     *   })
-     * });
-     */ const timerId = window.setTimeout(()=>{
-            ownerDocument.addEventListener('pointerdown', handlePointerDown);
-        }, 0);
-        return ()=>{
-            window.clearTimeout(timerId);
-            ownerDocument.removeEventListener('pointerdown', handlePointerDown);
-            ownerDocument.removeEventListener('click', handleClickRef.current);
-        };
-    }, [
-        ownerDocument,
-        handlePointerDownOutside
-    ]);
-    return {
-        // ensures we check React component tree (not just DOM tree)
-        onPointerDownCapture: ()=>isPointerInsideReactTreeRef.current = true
-    };
-}
-/**
- * Listens for when focus happens outside a react subtree.
- * Returns props to pass to the root (node) of the subtree we want to check.
- */ function $5cb92bef7577960e$var$useFocusOutside(onFocusOutside, ownerDocument = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) {
-    const handleFocusOutside = index.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onFocusOutside);
-    const isFocusInsideReactTreeRef = React.useRef(false);
-    React.useEffect(()=>{
-        const handleFocus = (event)=>{
-            if (event.target && !isFocusInsideReactTreeRef.current) {
-                const eventDetail = {
-                    originalEvent: event
-                };
-                $5cb92bef7577960e$var$handleAndDispatchCustomEvent($5cb92bef7577960e$var$FOCUS_OUTSIDE, handleFocusOutside, eventDetail, {
-                    discrete: false
-                });
-            }
-        };
-        ownerDocument.addEventListener('focusin', handleFocus);
-        return ()=>ownerDocument.removeEventListener('focusin', handleFocus)
-        ;
-    }, [
-        ownerDocument,
-        handleFocusOutside
-    ]);
-    return {
-        onFocusCapture: ()=>isFocusInsideReactTreeRef.current = true
-        ,
-        onBlurCapture: ()=>isFocusInsideReactTreeRef.current = false
-    };
-}
-function $5cb92bef7577960e$var$dispatchUpdate() {
-    const event = new CustomEvent($5cb92bef7577960e$var$CONTEXT_UPDATE);
-    document.dispatchEvent(event);
-}
-function $5cb92bef7577960e$var$handleAndDispatchCustomEvent(name, handler, detail, { discrete: discrete  }) {
-    const target = detail.originalEvent.target;
-    const event = new CustomEvent(name, {
-        bubbles: false,
-        cancelable: true,
-        detail: detail
-    });
-    if (handler) target.addEventListener(name, handler, {
-        once: true
-    });
-    if (discrete) index.$8927f6f2acc4f386$export$6d1a0317bde7de7f(target, event);
-    else target.dispatchEvent(event);
-}
-const $5cb92bef7577960e$export$be92b6f5f03c0fe9 = $5cb92bef7577960e$export$177fb62ff3ec1f22;
-const $5cb92bef7577960e$export$aecb2ddcb55c95be = $5cb92bef7577960e$export$4d5eb2109db14228;
-
-const $f1701beae083dbae$export$602eac185826482c = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
-    var _globalThis$document;
-    const { container: container = globalThis === null || globalThis === void 0 ? void 0 : (_globalThis$document = globalThis.document) === null || _globalThis$document === void 0 ? void 0 : _globalThis$document.body , ...portalProps } = props;
-    return container ? /*#__PURE__*/ $7SXl2$reactdom__default["default"].createPortal(/*#__PURE__*/ React.createElement(index.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({}, portalProps, {
-        ref: forwardedRef
-    })), container) : null;
-});
-
-exports.$5cb92bef7577960e$export$177fb62ff3ec1f22 = $5cb92bef7577960e$export$177fb62ff3ec1f22;
-exports.$5cb92bef7577960e$export$aecb2ddcb55c95be = $5cb92bef7577960e$export$aecb2ddcb55c95be;
-exports.$5cb92bef7577960e$export$be92b6f5f03c0fe9 = $5cb92bef7577960e$export$be92b6f5f03c0fe9;
-exports.$f1701beae083dbae$export$602eac185826482c = $f1701beae083dbae$export$602eac185826482c;

package/dist/_shared/cjs/suffix-modifier-64dcd338.js

@@ -1,19 +0,0 @@
-'use strict';
-
-var filterDataAttrs = require('./filter-data-attrs-1c9a530c.js');
-
-/**
- * Suffixes a modifier value onto the end of a className, converting it to
- * pascal case. i.e. turns suffixModifier("MyComponent--display", display)
- * returns MyComponent--displayBlock.
- *
- * @param rootClassName The root className to append the suffix onto
- * @param suffix The suffix to convert into pascal case.
- */
-var suffixModifier = function (rootClassName, suffix) {
-    return "".concat(rootClassName).concat(filterDataAttrs.camelCase(suffix, {
-        pascalCase: true
-    }));
-};
-
-exports.suffixModifier = suffixModifier;

package/dist/_shared/esm/Base-f200653c.js

@@ -1,15 +0,0 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-attrs-ea8f4ed4.js';
-import React__default, { createContext } from 'react';
-
-var ArcRootElementContext = createContext(null);
-/**
- * Use `Base` as the root component of the arc system.
- */
-var Base = function (_a) {
-    var _b = _a.brand, brand = _b === void 0 ? "bt" : _b, children = _a.children, props = __rest(_a, ["brand", "children"]);
-    var _c = React__default.useState(null), arcRoot = _c[0], setArcRoot = _c[1];
-    return (React__default.createElement("div", __assign({ id: "arc-root", ref: setArcRoot, className: "arc".concat(brand ? " arc-".concat(brand) : "") }, filterDataAttrs(props)),
-        React__default.createElement(ArcRootElementContext.Provider, { value: arcRoot }, children)));
-};
-
-export { ArcRootElementContext as A, Base as B };

package/dist/_shared/esm/Card-45e8e10a.js

@@ -1,115 +0,0 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-attrs-ea8f4ed4.js';
-import { c as classNames } from './index-2e73c2e9.js';
-import React__default, { useState, useEffect, useContext } from 'react';
-import { I as Image } from './Image-12fbd327.js';
-import { H as Heading } from './Heading-d16e0e53.js';
-import { s as suffixModifier } from './suffix-modifier-3d548e45.js';
-import { C as Context, S as Surface } from './Surface-0ca6817d.js';
-import { h as handleLinkClick } from './handle-link-click-f64f55a2.js';
-import { T as ThemeIcon } from './ThemeIcon-eab5a4d0.js';
-
-/**
- * Detect interaction mode
- */
-var useInteractionMode = function () {
-    var _a = useState("pointer"), interactionMode = _a[0], setInteractionMode = _a[1];
-    useEffect(function () {
-        var onKeyDown = function (event) {
-            if (event.altKey || event.ctrlKey || event.metaKey) {
-                return;
-            }
-            setInteractionMode("keyboard");
-        };
-        var onPointerDown = function () {
-            setInteractionMode("pointer");
-        };
-        if (typeof window !== "undefined") {
-            document.addEventListener("keydown", onKeyDown, true);
-            document.addEventListener("click", onPointerDown, true);
-        }
-        return function () {
-            if (typeof window !== "undefined") {
-                document.removeEventListener("keydown", onKeyDown);
-                document.removeEventListener("click", onPointerDown);
-            }
-        };
-    }, []);
-    return { interactionMode: interactionMode };
-};
-
-/**
- * Use `Card` to contain content and actions about a single subject.
- */
-var Card = function (_a) {
-    var _b;
-    var actionId = _a.actionId, _c = _a.actionLabel, actionLabel = _c === void 0 ? "Read more" : _c, children = _a.children, _d = _a.fill, fill = _d === void 0 ? "solid" : _d, href = _a.href, imageAlt = _a.imageAlt, imageHeight = _a.imageHeight, imageLoading = _a.imageLoading, imageSrc = _a.imageSrc, imageSrcSet = _a.imageSrcSet, linkData = _a.linkData, minHeight = _a.minHeight, onClick = _a.onClick, target = _a.target, title = _a.title, _e = _a.titleSize, titleSize = _e === void 0 ? "s" : _e, props = __rest(_a, ["actionId", "actionLabel", "children", "fill", "href", "imageAlt", "imageHeight", "imageLoading", "imageSrc", "imageSrcSet", "linkData", "minHeight", "onClick", "target", "title", "titleSize"]);
-    var surface = useContext(Context).surface;
-    var interactionMode = useInteractionMode().interactionMode;
-    var Wrapper = function (_a) {
-        var children = _a.children;
-        return fill === "outlined" || fill === "neutral" ? (React__default.createElement("div", null, children)) : (React__default.createElement(Surface, { background: surface === "dark" ? "white" : "darker" }, children));
-    };
-    var coverImage = imageSrc && (React__default.createElement(CardImage, { alt: imageAlt, height: imageHeight, loading: imageLoading, src: imageSrc, srcSet: imageSrcSet }));
-    return (React__default.createElement("div", __assign({ className: classNames((_b = {
-                "arc-Card": true,
-                "arc-Card--onDarkSurface": surface === "dark"
-            },
-            _b[suffixModifier("arc-Card--fill", fill)] = fill !== "solid",
-            _b["arc-is-".concat(interactionMode, "InteractionMode")] = interactionMode,
-            _b)) }, filterDataAttrs(props)),
-        React__default.createElement(Wrapper, null,
-            React__default.createElement("div", { className: "arc-Card-inner", style: { minHeight: minHeight } },
-                React__default.createElement("div", { className: "arc-Card-header" },
-                    React__default.createElement("div", { className: "arc-Card-title" },
-                        React__default.createElement(Heading, { size: titleSize },
-                            React__default.createElement(CardLink, { stretch: true, onClick: onClick, actionId: actionId, fill: fill, href: href, linkData: linkData, target: target }, title))),
-                    coverImage),
-                React__default.createElement("div", { className: "arc-Card-children" },
-                    React__default.createElement(Card.Block, null, children)),
-                href && (React__default.createElement(CardBlock, null,
-                    React__default.createElement(CardLink, { href: href, fill: fill, actionId: actionId, onClick: onClick, isButton: true }, actionLabel)))))));
-};
-/**
- * Internal `Card.Block` component to section blocks of content within a Card.
- */
-var CardBlock = function (_a) {
-    var _b = _a.align, align = _b === void 0 ? "left" : _b, children = _a.children, _c = _a.isFullWidth, isFullWidth = _c === void 0 ? false : _c, _d = _a.grow, grow = _d === void 0 ? false : _d;
-    return (React__default.createElement("div", { className: classNames({
-            "arc-Card-block": true,
-            "arc-Card-block--alignCenter": align === "center",
-            "arc-Card-block--alignRight": align === "right",
-            "arc-Card-block--fullWidth": isFullWidth,
-            "arc-Card-block--grow": grow
-        }) },
-        React__default.createElement("div", { className: "arc-Card-blockInner" }, children)));
-};
-Card.Block = CardBlock;
-/**
- * Internal `Card.Image` component to show an image within a Card.
- */
-var CardImage = function (_a) {
-    var _b = _a.alt, alt = _b === void 0 ? "" : _b, _c = _a.height, height = _c === void 0 ? 176 : _c, loading = _a.loading, sizes = _a.sizes, src = _a.src, srcSet = _a.srcSet;
-    return (React__default.createElement("div", { className: classNames({
-            "arc-Card-image": true
-        }) },
-        React__default.createElement(Image, { alt: alt, fit: "cover", height: height, loading: loading, sizes: sizes, src: src, srcSet: srcSet })));
-};
-Card.Image = CardImage;
-/**
- * Internal `CardLink` component.
- */
-var CardLink = function (_a) {
-    var actionId = _a.actionId, isButton = _a.isButton, children = _a.children, fill = _a.fill, href = _a.href, _b = _a.linkData, linkData = _b === void 0 ? {} : _b, onClick = _a.onClick, stretch = _a.stretch, target = _a.target;
-    var surface = useContext(Context).surface;
-    return (React__default.createElement("a", __assign({ onClick: handleLinkClick({ handler: onClick }), "aria-describedby": actionId, className: classNames({
-            "arc-Card-link": true,
-            "arc-Card-link--button": isButton,
-            "arc-Card-link--onDarkSurface": surface === "dark" && fill !== "neutral",
-            "arc-Card-link--stretch": stretch
-        }), href: href, rel: target === "_blank" ? "noopener noreferrer" : undefined, tabIndex: isButton ? -1 : undefined, target: target }, filterDataAttrs(linkData)),
-        React__default.createElement("span", { className: "arc-Card-linkText" }, children),
-        isButton && (React__default.createElement("span", { className: "arc-Card-linkIcon" },
-            React__default.createElement(ThemeIcon, { "data-testid": "cardIcon", size: 24, icon: "cardButton" })))));
-};
-
-export { Card as C };

package/dist/_shared/esm/Checkbox-2a623386.js

@@ -1,55 +0,0 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-attrs-ea8f4ed4.js';
-import React__default, { forwardRef, useContext } from 'react';
-import { c as classNames } from './index-2e73c2e9.js';
-import { C as Context, u as useAriaDescribedby } from './FormControl-433228f5.js';
-import { C as Context$1 } from './Surface-0ca6817d.js';
-import { T as ThemeIcon } from './ThemeIcon-eab5a4d0.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(ThemeIcon, { icon: "checkboxChecked" })),
-            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(ThemeIcon, { icon: "checkboxError" })),
-            errorMessage))));
-});
-
-export { Checkbox as C };

package/dist/_shared/esm/Icon-9ecaaeab.js

@@ -1,27 +0,0 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-attrs-ea8f4ed4.js';
-import { c as classNames } from './index-2e73c2e9.js';
-import React__default, { useContext } from 'react';
-import { s as suffixModifier } from './suffix-modifier-3d548e45.js';
-import { C as Context } from './Surface-0ca6817d.js';
-
-/**
- * Use `Icon` to display brand iconography.
- */
-var Icon = function (_a) {
-    var _b;
-    var testId = _a.testId, icon = _a.icon, _c = _a.color, color = _c === void 0 ? "auto" : _c, _d = _a.isInline, isInline = _d === void 0 ? false : _d, label = _a.label, size = _a.size, props = __rest(_a, ["testId", "icon", "color", "isInline", "label", "size"]);
-    var surface = useContext(Context).surface;
-    var Icon = icon || (function () { return React__default.createElement(React__default.Fragment, null); });
-    return (React__default.createElement("span", __assign({ "data-testid": testId, "aria-label": label, className: classNames((_b = {},
-            _b["arc-Icon"] = true,
-            _b[suffixModifier("arc-Icon--color", color)] = color !== "auto",
-            _b["arc-Icon--inline"] = isInline,
-            _b["arc-Icon--onDarkSurface"] = surface === "dark",
-            _b)), role: label ? "img" : undefined, style: {
-            height: size,
-            width: size
-        } }, filterDataAttrs(props)),
-        React__default.createElement(Icon, null)));
-};
-
-export { Icon as I };

package/dist/_shared/esm/ProgressStepper-5de34269.js

@@ -1,82 +0,0 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-attrs-ea8f4ed4.js';
-import React__default, { useContext } from 'react';
-import { c as classNames } from './index-2e73c2e9.js';
-import { C as Context } from './Surface-0ca6817d.js';
-import { V as VerticalSpace } from './VerticalSpace-43cd9138.js';
-import { V as VisuallyHidden } from './VisuallyHidden-b9eebf71.js';
-import { T as ThemeIcon } from './ThemeIcon-eab5a4d0.js';
-
-var ProgressStepperItem = function (_a) {
-    var _b, _c, _d;
-    var title = _a.title, titleHref = _a.titleHref, subTitle = _a.subTitle, _e = _a.direction, direction = _e === void 0 ? "horizontal" : _e, _f = _a.status, status = _f === void 0 ? "todo" : _f, _g = _a.size, size = _g === void 0 ? "large" : _g, _h = _a.position, position = _h === void 0 ? "middle" : _h, isFluid = _a.isFluid, ariaLabel = _a.ariaLabel, onClick = _a.onClick, previousStep = _a.previousStep, isExpandable = _a.isExpandable, stepContent = _a.stepContent, isStepContentHidden = _a.isStepContentHidden, props = __rest(_a, ["title", "titleHref", "subTitle", "direction", "status", "size", "position", "isFluid", "ariaLabel", "onClick", "previousStep", "isExpandable", "stepContent", "isStepContentHidden"]);
-    var surface = useContext(Context).surface;
-    var statusIcons = {
-        completed: "progressStepperComplete",
-        current: "progressStepperCurrent",
-        warning: "progressStepperWarning",
-        error: "progressStepperError"
-    };
-    var onClickHandler = function (event) {
-        event.preventDefault();
-        onClick && onClick();
-    };
-    var capitaliseFirstLetter = function (word) {
-        return word.charAt(0).toUpperCase() + word.slice(1);
-    };
-    return (React__default.createElement("div", __assign({ className: classNames("arc-ProgressStepperItem", (_b = {
-                "arc-ProgressStepperItem--vertical": direction === "vertical",
-                "arc-ProgressStepperItem--isFluid": isFluid,
-                "arc-ProgressStepperItem--onDarkSurface": surface === "dark",
-                "arc-ProgressStepperItem--previousStepCompleted": previousStep === "completed"
-            },
-            _b["arc-ProgressStepperItem--".concat(size)] = size === "small",
-            _b)) }, filterDataAttrs(props)),
-        React__default.createElement("div", { className: classNames("arc-ProgressStepperItem-iconSection", (_c = {},
-                _c["arc-ProgressStepperItem-iconSection--".concat(position)] = position !== "middle",
-                _c)) },
-            React__default.createElement("div", { className: "arc-ProgressStepperItem-iconSectionTrailBefore" }),
-            React__default.createElement("div", { className: classNames("arc-ProgressStepperItem-iconWrapper", (_d = {},
-                    _d["arc-ProgressStepperItem-iconWrapper--".concat(status)] = status !== "todo",
-                    _d)), "data-testid": "arc-ProgressStepperItem-iconWrapper" }, statusIcons[status] === undefined ? (React__default.createElement("div", { style: {
-                    width: size === "small" ? "16px" : "32px",
-                    height: size === "small" ? "16px" : "32px"
-                } })) : (React__default.createElement("span", { className: "arc-ProgressStepperItem-statusIcon" },
-                React__default.createElement(ThemeIcon, { icon: statusIcons[status], size: size === "small" ? 16 : 32 })))),
-            React__default.createElement("div", { className: "arc-ProgressStepperItem-iconSectionTrailAfter" })),
-        React__default.createElement("div", { className: "arc-ProgressStepperItem-textSection" },
-            status !== "todo" && (React__default.createElement(VisuallyHidden, null,
-                capitaliseFirstLetter(status),
-                ":")),
-            titleHref ? (React__default.createElement("a", { href: titleHref, "aria-label": ariaLabel, className: "arc-ProgressStepperItem-title", onClick: onClickHandler }, title)) : (React__default.createElement("div", { className: "arc-ProgressStepperItem-title" }, title)),
-            React__default.createElement("div", { className: "arc-ProgressStepperItem-subTitle" }, subTitle),
-            isExpandable && direction === "vertical" && (React__default.createElement(React__default.Fragment, null,
-                React__default.createElement("div", { className: "arc-ProgressStepperItem-nodeItem" },
-                    React__default.createElement("div", { className: "arc-ProgressStepperItem-keyline" }),
-                    stepContent && !isStepContentHidden && (React__default.createElement(React__default.Fragment, null,
-                        React__default.createElement(VerticalSpace, { size: "8" }),
-                        stepContent))))))));
-};
-
-/** Use `ProgressStepper` to illustrate the progress of a specific task within a page, by displaying a step-by-step progress through the user journey. This is commonly used in multi-step processes or wizards.  */
-var ProgressStepper = function (_a) {
-    var children = _a.children, size = _a.size, isFluid = _a.isFluid, direction = _a.direction, isExpandable = _a.isExpandable, props = __rest(_a, ["children", "size", "isFluid", "direction", "isExpandable"]);
-    var items = React__default.Children.toArray(children);
-    var getStepStatus = function (item) {
-        var _a;
-        return (_a = item === null || item === void 0 ? void 0 : item.props) === null || _a === void 0 ? void 0 : _a.status;
-    };
-    return (React__default.createElement("div", __assign({ className: classNames("arc-ProgressStepper", {
-            "arc-ProgressStepper--vertical": direction === "vertical"
-        }) }, filterDataAttrs(props)), items.map(function (item, index) {
-        var currentPosition = index === 0
-            ? "first"
-            : index === React__default.Children.count(children) - 1
-                ? "last"
-                : undefined;
-        return (React__default.createElement(React__default.Fragment, { key: "StepperItem-".concat(index) },
-            React__default.createElement(ProgressStepperItem, __assign({ title: item.props.title, titleHref: item.props.titleHref, subTitle: item.props.subTitle, status: item.props.status, stepContent: item.props.stepContent, isStepContentHidden: item.props.isStepContentHidden, onClick: item.props.onClick, isFluid: isFluid, direction: direction, isExpandable: isExpandable, size: size, position: currentPosition, previousStep: getStepStatus(items[index - 1]) }, filterDataAttrs(item.props)))));
-    })));
-};
-ProgressStepper.Item = ProgressStepperItem;
-
-export { ProgressStepper as P };