@codeleap/web 6.8.0 → 7.0.1

package/dist/components/Modal/index.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { ModalProvider } from './context';
+import { ModalBackdrop, ModalBox, ModalHeader, ModalBody, ModalFooter, } from './elements';
+import { WebStyleRegistry } from '../../lib/WebStyleRegistry';
+export * from './styles';
+export * from './types';
+export * from './context';
+export * from './elements';
+/**
+ * Accessible dialog that blocks page interaction while open, with backdrop-click and Escape-key dismissal.
+ * Controlled via `visible` / `toggle`; defaults to `closable`, `dismissOnBackdrop`, and `closeOnEscape` all `true`.
+ * Uses: `Modal.Provider`, `Modal.Backdrop`, `Modal.Box`, `Modal.Header`, `Modal.Body`, `Modal.Footer`
+ */
+export const Modal = (props) => {
+    const { children, ...providerProps } = { ...Modal.defaultProps, ...props };
+    return (_jsx(ModalProvider, { ...providerProps, children: _jsx(ModalBackdrop, { children: _jsxs(ModalBox, { children: [_jsx(ModalHeader, {}), _jsx(ModalBody, { children: children }), _jsx(ModalFooter, {})] }) }) }));
+};
+Modal.Provider = ModalProvider;
+Modal.Backdrop = ModalBackdrop;
+Modal.Box = ModalBox;
+Modal.Header = ModalHeader;
+Modal.Body = ModalBody;
+Modal.Footer = ModalFooter;
+Modal.styleRegistryName = 'Modal';
+Modal.elements = ['backdrop', 'box', 'header', 'body', 'footer', 'title', 'description'];
+Modal.rootElement = 'backdrop';
+Modal.defaultProps = {
+    closable: true,
+    showClose: true,
+    dismissOnBackdrop: true,
+    closeOnEscape: true,
+};
+WebStyleRegistry.registerComponent(Modal);
+//# sourceMappingURL=index.js.map

package/dist/components/Modal/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA;AACzC,OAAO,EACL,aAAa,EACb,QAAQ,EACR,WAAW,EACX,SAAS,EACT,WAAW,GACZ,MAAM,YAAY,CAAA;AACnB,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAE7D,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,YAAY,CAAA;AAE1B;;;;GAIG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,KAAiB,EAAE,EAAE;IACzC,MAAM,EAAE,QAAQ,EAAE,GAAG,aAAa,EAAE,GAAG,EAAE,GAAG,KAAK,CAAC,YAAY,EAAE,GAAG,KAAK,EAAE,CAAA;IAE1E,OAAO,CACL,KAAC,aAAa,OAAK,aAAa,YAC9B,KAAC,aAAa,cACZ,MAAC,QAAQ,eACP,KAAC,WAAW,KAAG,EACf,KAAC,SAAS,cAAE,QAAQ,GAAa,EACjC,KAAC,WAAW,KAAG,IACN,GACG,GACF,CACjB,CAAA;AACH,CAAC,CAAA;AAED,KAAK,CAAC,QAAQ,GAAG,aAAa,CAAA;AAC9B,KAAK,CAAC,QAAQ,GAAG,aAAa,CAAA;AAC9B,KAAK,CAAC,GAAG,GAAG,QAAQ,CAAA;AACpB,KAAK,CAAC,MAAM,GAAG,WAAW,CAAA;AAC1B,KAAK,CAAC,IAAI,GAAG,SAAS,CAAA;AACtB,KAAK,CAAC,MAAM,GAAG,WAAW,CAAA;AAE1B,KAAK,CAAC,iBAAiB,GAAG,OAAO,CAAA;AACjC,KAAK,CAAC,QAAQ,GAAG,CAAC,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,aAAa,CAAC,CAAA;AACxF,KAAK,CAAC,WAAW,GAAG,UAAU,CAAA;AAE9B,KAAK,CAAC,YAAY,GAAG;IACnB,QAAQ,EAAE,IAAI;IACd,SAAS,EAAE,IAAI;IACf,iBAAiB,EAAE,IAAI;IACvB,aAAa,EAAE,IAAI;CACG,CAAA;AAExB,gBAAgB,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAA"}

package/dist/components/Modal/styles.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=styles.js.map

package/dist/components/Modal/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/Modal/styles.ts"],"names":[],"mappings":""}

package/dist/components/Modal/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/Modal/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/Modal/types.ts"],"names":[],"mappings":""}

package/dist/components/NumberIncrement/index.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { TypeGuards } from '@codeleap/types';
+import { PatternFormat, NumericFormat, NumberFormatBase } from 'react-number-format';
+import { WebStyleRegistry } from '../../lib/WebStyleRegistry';
+import { useStylesFor } from '../../lib/hooks/useStylesFor';
+import { useNumberIncrement } from './useNumberIncrement';
+import { Field } from '../Field';
+import { toDataAttrs } from '../../lib';
+import { Icon } from '../Icon';
+export * from './types';
+export * from './styles';
+/**
+ * Numeric stepper field with `Icon`-driven increment/decrement buttons, optional direct keyboard entry, and `Field` layout (label, helper, left/right sections).
+ * Arrow-left/right keyboard events increment or decrement the value while the field is focused; clicking outside closes focus.
+ * Uses: `Field.Provider`, `Field.Wrapper`, `Field.Box`, `Field.Heading`, `Field.Helper`, `Field.SectionSlot`, `Icon`, `useNumberIncrement`
+ */
+export const NumberIncrement = (props) => {
+    const allProps = {
+        ...NumberIncrement.defaultProps,
+        ...props,
+    };
+    const { style, disabled, editable, hasSeparator, format, mask, suffix, separator, prefix, formatter, placeholder, label, helper, } = allProps;
+    const { isFocused, hasError, hasValue, errorMessage, incrementDisabled, decrementDisabled, innerInputRef, innerWrapperRef, wrapperRef, handleBlur, handleFocus, handleChange, handleChangeInput, onPressInnerWrapper, inputValue, } = useNumberIncrement(allProps);
+    const fieldContext = {
+        disabled: !!disabled,
+        hasValue: !!hasValue,
+        error: !!hasError,
+        focused: !!isFocused,
+    };
+    const styles = useStylesFor(NumberIncrement.styleRegistryName, style, fieldContext);
+    const stateAttrs = toDataAttrs({ disabled: !!disabled, error: !!hasError, focused: !!isFocused });
+    const InputFormat = TypeGuards.isString(format) || TypeGuards.isString(mask)
+        ? PatternFormat
+        : NumericFormat;
+    const shouldUseBaseInput = TypeGuards.isFunction(formatter);
+    const Input = shouldUseBaseInput
+        ? NumberFormatBase
+        : InputFormat;
+    const thousandProps = !shouldUseBaseInput ? {
+        thousandSeparator: separator,
+        thousandsGroupStyle: hasSeparator || TypeGuards.isString(separator) ? 'thousand' : 'none',
+    } : {};
+    return (_jsx(Field.Provider, { context: fieldContext, label: label, helper: hasError ? errorMessage : helper, componentName: 'number_increment', leftSection: _jsx(Icon, { icon: 'minus', onPress: () => handleChange('decrement'), disabled: disabled || decrementDisabled, style: styles.leftSection }), rightSection: _jsx(Icon, { icon: 'plus', onPress: () => handleChange('increment'), disabled: disabled || incrementDisabled, style: styles.rightSection }), children: _jsxs(Field.Wrapper, { ref: wrapperRef, style: styles.wrapper, children: [_jsx(Field.Heading, { style: styles.heading }), _jsxs(Field.Box, { ref: innerWrapperRef, style: [styles.box, editable ? styles['box:cursor'] : undefined], onClick: onPressInnerWrapper, ...stateAttrs, children: [_jsx(Field.SectionSlot, { position: 'left' }), _jsx(Input, { displayType: 'input', css: [
+                                styles.input,
+                                {
+                                    '&:focus': { outline: 'none', borderWidth: 0, borderColor: 'transparent' },
+                                },
+                            ], inputMode: 'numeric', onValueChange: handleChangeInput, onBlur: handleBlur, onFocus: handleFocus, value: inputValue, ...thousandProps, suffix: suffix, prefix: prefix, format: TypeGuards.isFunction(formatter) ? formatter : format, mask: mask, placeholder: placeholder, getInputRef: innerInputRef, disabled: disabled }), _jsx(Field.SectionSlot, { position: 'right' })] }), _jsx(Field.Helper, { style: styles.helper })] }) }));
+};
+NumberIncrement.styleRegistryName = 'NumberIncrement';
+NumberIncrement.elements = [...Field.elements, 'input', 'placeholder'];
+NumberIncrement.rootElement = 'wrapper';
+NumberIncrement.defaultProps = {
+    max: 1000000000,
+    min: 0,
+    step: 1,
+    editable: true,
+    hasSeparator: false,
+    mask: undefined,
+    separator: null,
+    format: null,
+    formatter: null,
+};
+WebStyleRegistry.registerComponent(NumberIncrement);
+//# sourceMappingURL=index.js.map

package/dist/components/NumberIncrement/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/NumberIncrement/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/NumberIncrement/styles.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=styles.js.map

package/dist/components/NumberIncrement/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/NumberIncrement/styles.ts"],"names":[],"mappings":""}

package/dist/components/NumberIncrement/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/NumberIncrement/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/NumberIncrement/types.ts"],"names":[],"mappings":""}

package/dist/components/NumberIncrement/useNumberIncrement.js

@@ -0,0 +1,113 @@
+import { useRef, useState, useCallback, useEffect, useMemo } from 'react';
+import { useFieldInput } from '../Field';
+import { fields } from '@codeleap/form';
+import { TypeGuards } from '@codeleap/types';
+/**
+ * Manages value, focus, increment/decrement button disabled state, and keyboard arrow-key handling for `NumberIncrement`.
+ * Clamps the value to `[min, max]` on blur; registers global `keydown` and `mousedown` listeners to track focus outside of React's event system.
+ * No provider required; designed to be called only inside `NumberIncrement`.
+ */
+export function useNumberIncrement(props) {
+    const { value, onValueChange, field, min, max, forceError, step, } = props;
+    const [isFocused, setIsFocused] = useState(false);
+    const { fieldHandle, validation, innerInputRef, wrapperRef, inputValue, onInputValueChange, } = useFieldInput(field, fields.number, { value, onValueChange });
+    const innerWrapperRef = useRef(null);
+    const hasValue = TypeGuards.isString(inputValue)
+        ? inputValue?.length > 0
+        : !TypeGuards.isNil(inputValue);
+    const hasError = validation?.showError || !!forceError;
+    const errorMessage = validation?.message || forceError;
+    const incrementDisabled = useMemo(() => {
+        if (TypeGuards.isNumber(max) && (Number(inputValue) >= max)) {
+            return true;
+        }
+        return false;
+    }, [inputValue]);
+    const decrementDisabled = useMemo(() => {
+        if (TypeGuards.isNumber(min) && (Number(inputValue) <= min)) {
+            return true;
+        }
+        return false;
+    }, [inputValue]);
+    const handleChange = useCallback((action) => {
+        if (action === 'increment' && !incrementDisabled) {
+            const newValue = Number(inputValue || min) + step;
+            onInputValueChange(newValue);
+            return;
+        }
+        else if (action === 'decrement' && !decrementDisabled) {
+            const newValue = Number(inputValue || min) - step;
+            onInputValueChange(newValue);
+            return;
+        }
+        validation?.onInputBlurred?.();
+    }, [validation?.onInputBlurred, inputValue]);
+    const handleBlur = useCallback(() => {
+        if (TypeGuards.isNumber(max) && (inputValue >= max)) {
+            onInputValueChange(max);
+            return;
+        }
+        else if (TypeGuards.isNumber(min) && (inputValue <= min) || !inputValue) {
+            onInputValueChange(min);
+            return;
+        }
+        validation?.onInputBlurred?.();
+    }, [validation?.onInputBlurred, inputValue]);
+    const handleFocus = useCallback(() => {
+        setIsFocused(true);
+    }, []);
+    useEffect(() => {
+        function handleKeyboardEvent(event) {
+            if (!isFocused)
+                return;
+            if (event.keyCode === 39 || event.key === 'ArrowRight') {
+                handleChange('increment');
+            }
+            else if (event.keyCode === 37 || event.key === 'ArrowLeft') {
+                handleChange('decrement');
+            }
+        }
+        document.addEventListener('keydown', handleKeyboardEvent);
+        return () => {
+            document.removeEventListener('keydown', handleKeyboardEvent);
+        };
+    }, [handleChange, isFocused]);
+    useEffect(() => {
+        function handleClickOutside(event) {
+            if (innerWrapperRef.current && !innerWrapperRef.current.contains(event.target)) {
+                setIsFocused(false);
+            }
+        }
+        document.addEventListener('mousedown', handleClickOutside);
+        return () => {
+            document.removeEventListener('mousedown', handleClickOutside);
+        };
+    }, [innerWrapperRef]);
+    const handleChangeInput = (values) => {
+        const { floatValue } = values;
+        onInputValueChange(Number(floatValue));
+    };
+    const onPressInnerWrapper = () => {
+        setIsFocused(true);
+        innerInputRef.current?.focus?.();
+    };
+    return {
+        hasValue,
+        hasError,
+        errorMessage,
+        inputValue: inputValue || min,
+        isFocused,
+        incrementDisabled,
+        decrementDisabled,
+        innerInputRef,
+        innerWrapperRef,
+        handleBlur,
+        handleFocus,
+        handleChange,
+        handleChangeInput,
+        onPressInnerWrapper,
+        fieldHandle,
+        wrapperRef,
+    };
+}
+//# sourceMappingURL=useNumberIncrement.js.map

package/dist/components/NumberIncrement/useNumberIncrement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useNumberIncrement.js","sourceRoot":"","sources":["../../../src/components/NumberIncrement/useNumberIncrement.ts"],"names":[],"mappings":"AAAA,OAAc,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAEhF,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AACxC,OAAO,EAAS,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAG5C;;;;GAIG;AACH,MAAM,UAAU,kBAAkB,CAAC,KAAoC;IACrE,MAAM,EACJ,KAAK,EACL,aAAa,EACb,KAAK,EACL,GAAG,EACH,GAAG,EACH,UAAU,EACV,IAAI,GACL,GAAG,KAAK,CAAA;IAET,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEjD,MAAM,EACJ,WAAW,EACX,UAAU,EACV,aAAa,EACb,UAAU,EACV,UAAU,EACV,kBAAkB,GACnB,GAAG,aAAa,CACf,KAAgC,EAChC,MAAM,CAAC,MAAuC,EAC9C,EAAE,KAAK,EAAE,aAAa,EAAE,CACzB,CAAA;IAED,MAAM,eAAe,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;IAEpC,MAAM,QAAQ,GAAG,UAAU,CAAC,QAAQ,CAAC,UAAU,CAAC;QAC9C,CAAC,CAAE,UAAqB,EAAE,MAAM,GAAG,CAAC;QACpC,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,UAAU,CAAC,CAAA;IAEjC,MAAM,QAAQ,GAAG,UAAU,EAAE,SAAS,IAAI,CAAC,CAAC,UAAU,CAAA;IAEtD,MAAM,YAAY,GAAG,UAAU,EAAE,OAAO,IAAI,UAAU,CAAA;IAEtD,MAAM,iBAAiB,GAAG,OAAO,CAAC,GAAG,EAAE;QACrC,IAAI,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,GAAG,CAAC,EAAE,CAAC;YAC5D,OAAO,IAAI,CAAA;QACb,CAAC;QACD,OAAO,KAAK,CAAA;IACd,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,MAAM,iBAAiB,GAAG,OAAO,CAAC,GAAG,EAAE;QACrC,IAAI,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,GAAG,CAAC,EAAE,CAAC;YAC5D,OAAO,IAAI,CAAA;QACb,CAAC;QACD,OAAO,KAAK,CAAA;IACd,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,MAAM,YAAY,GAAG,WAAW,CAAC,CAAC,MAAiC,EAAE,EAAE;QACrE,IAAI,MAAM,KAAK,WAAW,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACjD,MAAM,QAAQ,GAAG,MAAM,CAAC,UAAU,IAAI,GAAG,CAAC,GAAG,IAAI,CAAA;YACjD,kBAAkB,CAAC,QAAQ,CAAC,CAAA;YAC5B,OAAM;QACR,CAAC;aAAM,IAAI,MAAM,KAAK,WAAW,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACxD,MAAM,QAAQ,GAAG,MAAM,CAAC,UAAU,IAAI,GAAG,CAAC,GAAG,IAAI,CAAA;YACjD,kBAAkB,CAAC,QAAQ,CAAC,CAAA;YAC5B,OAAM;QACR,CAAC;QAED,UAAU,EAAE,cAAc,EAAE,EAAE,CAAA;IAChC,CAAC,EAAE,CAAC,UAAU,EAAE,cAAc,EAAE,UAAU,CAAC,CAAC,CAAA;IAE5C,MAAM,UAAU,GAAG,WAAW,CAAC,GAAG,EAAE;QAClC,IAAI,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,IAAI,GAAG,CAAC,EAAE,CAAC;YACpD,kBAAkB,CAAC,GAAG,CAAC,CAAA;YACvB,OAAM;QACR,CAAC;aAAM,IAAI,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,IAAI,GAAG,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;YAC1E,kBAAkB,CAAC,GAAG,CAAC,CAAA;YACvB,OAAM;QACR,CAAC;QAED,UAAU,EAAE,cAAc,EAAE,EAAE,CAAA;IAChC,CAAC,EAAE,CAAC,UAAU,EAAE,cAAc,EAAE,UAAU,CAAC,CAAC,CAAA;IAE5C,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE;QACnC,YAAY,CAAC,IAAI,CAAC,CAAA;IACpB,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,mBAAmB,CAAC,KAAoB;YAC/C,IAAI,CAAC,SAAS;gBAAE,OAAM;YAEtB,IAAI,KAAK,CAAC,OAAO,KAAK,EAAE,IAAI,KAAK,CAAC,GAAG,KAAK,YAAY,EAAE,CAAC;gBACvD,YAAY,CAAC,WAAW,CAAC,CAAA;YAC3B,CAAC;iBAAM,IAAI,KAAK,CAAC,OAAO,KAAK,EAAE,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,EAAE,CAAC;gBAC7D,YAAY,CAAC,WAAW,CAAC,CAAA;YAC3B,CAAC;QACH,CAAC;QAED,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,mBAAmB,CAAC,CAAA;QAEzD,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,mBAAmB,CAAC,CAAA;QAC9D,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC,CAAA;IAE7B,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,kBAAkB,CAAC,KAAiB;YAC3C,IAAI,eAAe,CAAC,OAAO,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;gBAC/E,YAAY,CAAC,KAAK,CAAC,CAAA;YACrB,CAAC;QACH,CAAC;QAED,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAA;QAE1D,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAA;QAC/D,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAA;IAErB,MAAM,iBAAiB,GAA6B,CAAC,MAAM,EAAE,EAAE;QAC7D,MAAM,EAAE,UAAU,EAAE,GAAG,MAAM,CAAA;QAE7B,kBAAkB,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAA;IACxC,CAAC,CAAA;IAED,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,YAAY,CAAC,IAAI,CAAC,CAAA;QAClB,aAAa,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE,CAAA;IAClC,CAAC,CAAA;IAED,OAAO;QACL,QAAQ;QACR,QAAQ;QACR,YAAY;QACZ,UAAU,EAAE,UAAU,IAAI,GAAG;QAC7B,SAAS;QACT,iBAAiB;QACjB,iBAAiB;QACjB,aAAa;QACb,eAAe;QACf,UAAU;QACV,WAAW;QACX,YAAY;QACZ,iBAAiB;QACjB,mBAAmB;QACnB,WAAW;QACX,UAAU;KACX,CAAA;AACH,CAAC"}

package/dist/components/Overlay/index.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { Touchable } from '../Touchable';
+import { View } from '../View';
+import { usePopState } from '../../lib';
+import { WebStyleRegistry } from '../../lib/WebStyleRegistry';
+import { useStylesFor } from '../../lib/hooks/useStylesFor';
+export * from './styles';
+export * from './types';
+/**
+ * Visually hidden overlay that transitions to visible state and registers a
+ * browser pop-state entry so the back button can dismiss it.
+ * Renders as `Touchable` when `onPress` or `onClick` is provided, otherwise as `View`.
+ * Uses: `Touchable`, `View`, `useStylesFor`, `WebStyleRegistry`
+ */
+export const Overlay = (overlayProps) => {
+    const { visible, style, ...props } = {
+        ...Overlay.defaultProps,
+        ...overlayProps,
+    };
+    const styles = useStylesFor(Overlay.styleRegistryName, style);
+    usePopState(visible, props?.onPress);
+    const isPressable = !!props?.onClick || !!props?.onPress;
+    if (isPressable) {
+        return (_jsx(Touchable, { ...props, style: [
+                { transition: 'opacity 0.2s ease' },
+                styles.wrapper,
+                visible ? styles['wrapper:visible'] : null,
+            ] }));
+    }
+    return (_jsx(View, { ...props, style: [
+            { transition: 'opacity 0.2s ease' },
+            styles.wrapper,
+            visible ? styles['wrapper:visible'] : null,
+        ] }));
+};
+Overlay.styleRegistryName = 'Overlay';
+Overlay.elements = ['wrapper'];
+Overlay.rootElement = 'wrapper';
+Overlay.withVariantTypes = (styles) => {
+    return Overlay;
+};
+Overlay.defaultProps = {};
+WebStyleRegistry.registerComponent(Overlay);
+//# sourceMappingURL=index.js.map

package/dist/components/Overlay/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Overlay/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAE7D,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAG3D,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AAEvB;;;;;GAKG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,YAA0B,EAAE,EAAE;IACpD,MAAM,EACJ,OAAO,EACP,KAAK,EACL,GAAG,KAAK,EACT,GAAG;QACF,GAAG,OAAO,CAAC,YAAY;QACvB,GAAG,YAAY;KAChB,CAAA;IAED,MAAM,MAAM,GAAG,YAAY,CAAC,OAAO,CAAC,iBAAiB,EAAE,KAAK,CAAC,CAAA;IAE7D,WAAW,CAAC,OAAO,EAAE,KAAK,EAAE,OAAO,CAAC,CAAA;IAEpC,MAAM,WAAW,GAAG,CAAC,CAAC,KAAK,EAAE,OAAO,IAAI,CAAC,CAAC,KAAK,EAAE,OAAO,CAAA;IAExD,IAAI,WAAW,EAAE,CAAC;QAChB,OAAO,CACL,KAAC,SAAS,OACJ,KAAK,EACT,KAAK,EAAE;gBACL,EAAE,UAAU,EAAE,mBAAmB,EAAE;gBACnC,MAAM,CAAC,OAAO;gBACd,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,IAAI;aAC3C,GACD,CACH,CAAA;IACH,CAAC;IAED,OAAO,CACL,KAAC,IAAI,OACC,KAAK,EACT,KAAK,EAAE;YACL,EAAE,UAAU,EAAE,mBAAmB,EAAE;YACnC,MAAM,CAAC,OAAO;YACd,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,IAAI;SAC3C,GACD,CACH,CAAA;AACH,CAAC,CAAA;AAED,OAAO,CAAC,iBAAiB,GAAG,SAAS,CAAA;AACrC,OAAO,CAAC,QAAQ,GAAG,CAAC,SAAS,CAAC,CAAA;AAC9B,OAAO,CAAC,WAAW,GAAG,SAAS,CAAA;AAE/B,OAAO,CAAC,gBAAgB,GAAG,CAAsB,MAAS,EAAE,EAAE;IAC5D,OAAO,OAA6E,CAAA;AACtF,CAAC,CAAA;AAED,OAAO,CAAC,YAAY,GAAG,EAA2B,CAAA;AAElD,gBAAgB,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAA"}

package/dist/components/Overlay/styles.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=styles.js.map

package/dist/components/Overlay/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/Overlay/styles.ts"],"names":[],"mappings":""}

package/dist/components/Overlay/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/Overlay/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/Overlay/types.ts"],"names":[],"mappings":""}

package/dist/components/PaginationButtons/index.js

@@ -0,0 +1,100 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { TypeGuards } from '@codeleap/types';
+import { View } from '../View';
+import { Button } from '../Button';
+import { useMediaQuery, usePagination, useStylesFor, WebStyleRegistry } from '../../lib';
+import { useCompositionStyles, useTheme } from '@codeleap/styles';
+export * from './styles';
+export * from './types';
+/**
+ * Numbered page-navigation control with optional previous/next arrow buttons and responsive abbreviation of middle pages.
+ * Abbreviation behaviour and mobile layout are auto-detected from the `tabletSmall` theme breakpoint but can be overridden via props.
+ * Uses: `Button`
+ */
+export const PaginationButtons = (props) => {
+    const allProps = {
+        ...PaginationButtons.defaultProps,
+        ...props,
+    };
+    const { shouldAbbreviate, displayLeftArrow, displayRightArrow, disabled, style, itemProps, controlLeftIconName, controlRightIconName, leftArrowButtonProps, rightArrowButtonProps, abbreviationSymbol, isMobile, ...paginationProps } = allProps;
+    const themeMedia = useTheme(store => store?.theme?.media);
+    const { boundaries = 2 } = paginationProps;
+    const query = themeMedia?.down('tabletSmall');
+    const _isMobile = useMediaQuery(query);
+    const isMobileQuery = TypeGuards.isBoolean(isMobile) ? isMobile : _isMobile;
+    const centeredElementIndex = isMobileQuery ? 3 : boundaries + 1;
+    const { range, first, next, previous, setPage, page, status, } = usePagination({
+        abbreviationSymbol,
+        isMobile: isMobileQuery,
+        displayLeftArrow,
+        displayRightArrow,
+        shouldAbbreviate,
+        ...paginationProps,
+    });
+    const styles = useStylesFor(PaginationButtons.styleRegistryName, style);
+    const compositionStyles = useCompositionStyles(['button', 'arrowLeftButton', 'arrowRightButton'], styles);
+    const fetchPreviousPage = () => {
+        props?.onFetchPreviousPage?.();
+        previous?.();
+    };
+    const fetchNextPage = () => {
+        props?.onFetchNextPage?.();
+        next?.();
+    };
+    const fetchPage = (page) => {
+        setPage?.(page);
+    };
+    const onPressItem = ({ item, isArrowLeft, isArrowRight }) => {
+        if (item === abbreviationSymbol) {
+            return null;
+        }
+        if (isArrowLeft) {
+            if (displayLeftArrow) {
+                return fetchPreviousPage();
+            }
+            else {
+                return first();
+            }
+        }
+        if (displayRightArrow && isArrowRight) {
+            return fetchNextPage();
+        }
+        props?.onPressItem?.(item);
+        fetchPage(Number(item));
+    };
+    return (_jsxs(View, { style: styles.wrapper, children: [displayLeftArrow ? (_jsx(Button, { icon: controlLeftIconName, onPress: () => onPressItem({ item: null, isArrowLeft: true, isArrowRight: false }), ...leftArrowButtonProps, style: compositionStyles.arrowLeftButton })) : null, range?.map?.((item, index) => {
+                if (props?.renderItem) {
+                    return props?.renderItem?.(item, index);
+                }
+                let selected = null;
+                switch (status) {
+                    case 'initial':
+                        selected = page === index + 1;
+                        break;
+                    case 'abreviated':
+                        selected = index === centeredElementIndex - 1;
+                        break;
+                    case 'end':
+                        selected = page - (Number(item) - index) === index;
+                }
+                return (_jsx(Button, { text: String(item), selected: selected, onPress: () => onPressItem({ item, isArrowLeft: false, isArrowRight: false }), disabled: disabled, ...itemProps, style: compositionStyles.button }));
+            }), displayRightArrow ? (_jsx(Button, { icon: controlRightIconName, onPress: () => onPressItem({ item: null, isArrowLeft: false, isArrowRight: true }), ...rightArrowButtonProps, style: compositionStyles.arrowRightButton })) : null] }));
+};
+PaginationButtons.styleRegistryName = 'PaginationButtons';
+PaginationButtons.elements = ['wrapper', 'button', 'arrowLeftButton', 'arrowRightButton'];
+PaginationButtons.rootElement = 'wrapper';
+PaginationButtons.withVariantTypes = (styles) => {
+    return PaginationButtons;
+};
+PaginationButtons.defaultProps = {
+    shouldAbbreviate: true,
+    displayLeftArrow: true,
+    displayRightArrow: true,
+    disabled: false,
+    isMobile: null,
+    abbreviationSymbol: '...',
+    controlLeftIconName: 'chevron-left',
+    controlRightIconName: 'chevron-right',
+};
+WebStyleRegistry.registerComponent(PaginationButtons);
+//# sourceMappingURL=index.js.map

package/dist/components/PaginationButtons/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/PaginationButtons/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/PaginationButtons/styles.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=styles.js.map

package/dist/components/PaginationButtons/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/PaginationButtons/styles.ts"],"names":[],"mappings":""}

package/dist/components/PaginationButtons/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/PaginationButtons/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/PaginationButtons/types.ts"],"names":[],"mappings":""}

package/dist/components/PaginationIndicator/index.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { TypeGuards } from '@codeleap/types';
+import { ActivityIndicator } from '../ActivityIndicator';
+import { Text } from '../Text';
+import { View } from '../View';
+import { useStylesFor } from '../../lib/hooks/useStylesFor';
+import { WebStyleRegistry } from '../../lib/WebStyleRegistry';
+import { useNestedStylesByKey } from '@codeleap/styles';
+export * from './styles';
+export * from './types';
+/**
+ * Status indicator placed at the bottom of a paginated or infinite-scroll list — shows a spinner while fetching, a "no more items" message when exhausted, or nothing otherwise.
+ * Uses: `ActivityIndicator`, `Text`
+ */
+export const PaginationIndicator = (props) => {
+    const { hasMore, isFetching, noMoreItemsText, activityIndicator, style, indicatorProps, debugName, } = {
+        ...PaginationIndicator.defaultProps,
+        ...props,
+    };
+    const styles = useStylesFor(PaginationIndicator.styleRegistryName, style);
+    const loaderStyles = useNestedStylesByKey('loader', styles);
+    if (isFetching) {
+        return activityIndicator || (_jsx(View, { style: styles.wrapper, children: _jsx(ActivityIndicator, { debugName: debugName, ...indicatorProps, style: loaderStyles }) }));
+    }
+    if (!hasMore) {
+        if (TypeGuards.isString(noMoreItemsText) || TypeGuards.isNumber(noMoreItemsText)) {
+            return (_jsx(View, { style: styles.wrapper, children: _jsx(Text, { debugName: debugName, style: styles.text, text: String(noMoreItemsText) }) }));
+        }
+        return noMoreItemsText;
+    }
+    return null;
+};
+PaginationIndicator.styleRegistryName = 'PaginationIndicator';
+PaginationIndicator.elements = ['wrapper', 'text', 'loader'];
+PaginationIndicator.rootElement = 'wrapper';
+PaginationIndicator.withVariantTypes = (styles) => {
+    return PaginationIndicator;
+};
+PaginationIndicator.defaultProps = {};
+WebStyleRegistry.registerComponent(PaginationIndicator);
+//# sourceMappingURL=index.js.map

package/dist/components/PaginationIndicator/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/PaginationIndicator/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAC5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AACxD,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAE3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAC7D,OAAO,EAAyC,oBAAoB,EAAE,MAAM,kBAAkB,CAAA;AAE9F,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AAEvB;;;GAGG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,KAA+B,EAAE,EAAE;IACrE,MAAM,EACJ,OAAO,EACP,UAAU,EACV,eAAe,EACf,iBAAiB,EACjB,KAAK,EACL,cAAc,EACd,SAAS,GACV,GAAG;QACF,GAAG,mBAAmB,CAAC,YAAY;QACnC,GAAG,KAAK;KACT,CAAA;IAED,MAAM,MAAM,GAAG,YAAY,CAAC,mBAAmB,CAAC,iBAAiB,EAAE,KAAK,CAAC,CAAA;IAEzE,MAAM,YAAY,GAAG,oBAAoB,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAA;IAE3D,IAAI,UAAU,EAAE,CAAC;QACf,OAAO,iBAAiB,IAAI,CAC1B,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,OAAO,YACzB,KAAC,iBAAiB,IAAC,SAAS,EAAE,SAAS,KAAM,cAAc,EAAE,KAAK,EAAE,YAAY,GAAI,GAC/E,CACR,CAAA;IACH,CAAC;IAED,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,IAAI,UAAU,CAAC,QAAQ,CAAC,eAAe,CAAC,IAAI,UAAU,CAAC,QAAQ,CAAC,eAAe,CAAC,EAAE,CAAC;YACjF,OAAO,CACL,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,OAAO,YACzB,KAAC,IAAI,IACH,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,MAAM,CAAC,IAAI,EAClB,IAAI,EAAE,MAAM,CAAC,eAAe,CAAC,GAC7B,GACG,CACR,CAAA;QACH,CAAC;QAED,OAAO,eAAe,CAAA;IACxB,CAAC;IAED,OAAO,IAAI,CAAA;AACb,CAAC,CAAA;AAED,mBAAmB,CAAC,iBAAiB,GAAG,qBAAqB,CAAA;AAC7D,mBAAmB,CAAC,QAAQ,GAAG,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAA;AAC5D,mBAAmB,CAAC,WAAW,GAAG,SAAS,CAAA;AAE3C,mBAAmB,CAAC,gBAAgB,GAAG,CAAsB,MAAS,EAAE,EAAE;IACxE,OAAO,mBAAqG,CAAA;AAC9G,CAAC,CAAA;AAED,mBAAmB,CAAC,YAAY,GAAG,EAAuC,CAAA;AAE1E,gBAAgB,CAAC,iBAAiB,CAAC,mBAAmB,CAAC,CAAA"}

package/dist/components/PaginationIndicator/styles.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=styles.js.map

package/dist/components/PaginationIndicator/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/PaginationIndicator/styles.ts"],"names":[],"mappings":""}

package/dist/components/PaginationIndicator/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/PaginationIndicator/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/PaginationIndicator/types.ts"],"names":[],"mappings":""}

package/dist/components/Progress/Bar/Segmented.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { motion } from 'motion/react';
+import { View } from '../../components';
+import { WebStyleRegistry } from '../../../lib/WebStyleRegistry';
+import { mergeStyles } from '@codeleap/styles';
+import { useStylesFor } from '../../../lib/hooks/useStylesFor';
+/**
+ * Horizontal progress bar made up of N discrete pill segments.
+ * Active segments (index < `progress`) receive `styles.segmentActive` merged on top of `styles.segment`.
+ * When `animated` is true each active segment fades in with a staggered delay.
+ */
+export const ProgressBarSegmented = (props) => {
+    const { progress, segments, style, debugName, animated, animatedProps, staggerDelay, ...rest } = {
+        ...ProgressBarSegmented.defaultProps,
+        ...props,
+    };
+    const styles = useStylesFor(ProgressBarSegmented.styleRegistryName, style);
+    const SegmentComponent = animated ? motion.div : 'div';
+    return (_jsx(View, { debugName: debugName, ...rest, style: styles.wrapper, children: Array.from({ length: segments }, (_, i) => {
+            const isActive = i < progress;
+            return (_jsx(SegmentComponent, { css: mergeStyles([styles.segment, isActive ? styles.segmentActive : null]), animate: animated ? { opacity: isActive ? 1 : 0.4 } : undefined, initial: animated ? { opacity: 0.4 } : undefined, transition: animated ? { delay: isActive ? i * staggerDelay : 0, duration: 0.2 } : undefined, ...(animated ? animatedProps : {}) }, i));
+        }) }));
+};
+ProgressBarSegmented.styleRegistryName = 'ProgressBarSegmented';
+ProgressBarSegmented.elements = ['wrapper', 'segment', 'segmentActive'];
+ProgressBarSegmented.rootElement = 'wrapper';
+ProgressBarSegmented.withVariantTypes = (styles) => {
+    return ProgressBarSegmented;
+};
+ProgressBarSegmented.defaultProps = {
+    progress: 0,
+    segments: 5,
+    animated: true,
+    staggerDelay: 0.05,
+};
+WebStyleRegistry.registerComponent(ProgressBarSegmented);
+//# sourceMappingURL=Segmented.js.map

package/dist/components/Progress/Bar/Segmented.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Segmented.js","sourceRoot":"","sources":["../../../../src/components/Progress/Bar/Segmented.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAA;AAEvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AAChE,OAAO,EAAmB,WAAW,EAAwB,MAAM,kBAAkB,CAAA;AACrF,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAA;AAE9D;;;;GAIG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,KAAgC,EAAE,EAAE;IACvE,MAAM,EACJ,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,SAAS,EACT,QAAQ,EACR,aAAa,EACb,YAAY,EACZ,GAAG,IAAI,EACR,GAAG;QACF,GAAG,oBAAoB,CAAC,YAAY;QACpC,GAAG,KAAK;KACT,CAAA;IAED,MAAM,MAAM,GAAG,YAAY,CAAC,oBAAoB,CAAC,iBAAiB,EAAE,KAAK,CAAC,CAAA;IAE1E,MAAM,gBAAgB,GAAQ,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAA;IAE3D,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAE,SAAS,KAAM,IAAI,EAAE,KAAK,EAAE,MAAM,CAAC,OAAO,YACxD,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;YACzC,MAAM,QAAQ,GAAG,CAAC,GAAG,QAAQ,CAAA;YAC7B,OAAO,CACL,KAAC,gBAAgB,IAEf,GAAG,EAAE,WAAW,CAAC,CAAC,MAAM,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,EAC1E,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,SAAS,EAC/D,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,SAAS,EAChD,UAAU,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,YAAY,CAAC,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,SAAS,KACxF,CAAC,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,IAL9B,CAAC,CAMN,CACH,CAAA;QACH,CAAC,CAAC,GACG,CACR,CAAA;AACH,CAAC,CAAA;AAED,oBAAoB,CAAC,iBAAiB,GAAG,sBAAsB,CAAA;AAC/D,oBAAoB,CAAC,QAAQ,GAAG,CAAC,SAAS,EAAE,SAAS,EAAE,eAAe,CAAC,CAAA;AACvE,oBAAoB,CAAC,WAAW,GAAG,SAAS,CAAA;AAE5C,oBAAoB,CAAC,gBAAgB,GAAG,CAAsB,MAAS,EAAE,EAAE;IACzE,OAAO,oBAAuG,CAAA;AAChH,CAAC,CAAA;AAED,oBAAoB,CAAC,YAAY,GAAG;IAClC,QAAQ,EAAE,CAAC;IACX,QAAQ,EAAE,CAAC;IACX,QAAQ,EAAE,IAAI;IACd,YAAY,EAAE,IAAI;CACmB,CAAA;AAEvC,gBAAgB,CAAC,iBAAiB,CAAC,oBAAoB,CAAC,CAAA"}

package/dist/components/Progress/Bar/index.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { TypeGuards } from '@codeleap/types';
+import { motion } from 'motion/react';
+import { Icon, Text, View } from '../../components';
+import { formatProgress as _formatProgress } from '../utils';
+import { WebStyleRegistry } from '../../../lib/WebStyleRegistry';
+import { mergeStyles } from '@codeleap/styles';
+import { useStylesFor } from '../../../lib/hooks/useStylesFor';
+import { ProgressBarSegmented } from './Segmented';
+export * from './types';
+export * from './styles';
+/**
+ * Horizontal progress bar with optional left/right icons and labels.
+ * The indicator fills via a `scaleX` transform animated with Framer Motion when `animated` is true.
+ * Uses: `Icon`, `Text`
+ */
+export const ProgressBar = (props) => {
+    const { progress, style, debugName, formatProgress, showProgress, animated, animatedProps, leftIcon, leftIconProps, rightIcon, rightIconProps, text, textProps, leftText, leftTextProps, rightText, rightTextProps, ...rest } = {
+        ...ProgressBar.defaultProps,
+        ...props,
+    };
+    const styles = useStylesFor(ProgressBar.styleRegistryName, style);
+    const leftIconStyles = mergeStyles([styles.icon, styles.leftIcon]);
+    const rightIconStyles = mergeStyles([styles.icon, styles.rightIcon]);
+    const leftTextStyles = mergeStyles([styles.text, styles.leftText]);
+    const rightTextStyles = mergeStyles([styles.text, styles.rightText]);
+    const IndicatorComponent = animated ? motion.div : 'div';
+    return (_jsxs(View, { debugName: debugName, ...rest, style: styles.wrapper, children: [!TypeGuards.isNil(leftIcon) ? (_jsx(Icon, { icon: leftIcon, debugName: `leftIcon-${debugName}`, ...leftIconProps, style: leftIconStyles })) : null, TypeGuards.isString(leftText) ? (_jsx(Text, { text: leftText, ...leftTextProps, style: leftTextStyles })) : leftText, _jsx("div", { css: styles.track, role: 'progressbar', "aria-valuenow": progress, "aria-valuemin": 0, "aria-valuemax": 100, children: _jsx(IndicatorComponent, { css: styles.indicator, style: { transformOrigin: 'left' }, animate: animated ? { scaleX: progress / 100 } : undefined, initial: animated ? { scaleX: 0 } : undefined, transition: animated ? { duration: 0.6, ease: [0.65, 0, 0.35, 1] } : undefined, ...(animated ? animatedProps : {}) }) }), TypeGuards.isString(text) || showProgress ? (_jsx(Text, { text: showProgress ? formatProgress(progress) : text, ...textProps, style: styles.text })) : text, !TypeGuards.isNil(rightIcon) ? (_jsx(Icon, { icon: rightIcon, debugName: `rightIcon-${debugName}`, ...rightIconProps, style: rightIconStyles })) : null, TypeGuards.isString(rightText) ? (_jsx(Text, { text: rightText, ...rightTextProps, style: rightTextStyles })) : rightText] }));
+};
+ProgressBar.styleRegistryName = 'ProgressBar';
+ProgressBar.elements = ['wrapper', 'track', 'indicator', 'text', 'icon', 'leftIcon', 'leftText', 'rightIcon', 'rightText'];
+ProgressBar.rootElement = 'wrapper';
+ProgressBar.withVariantTypes = (styles) => {
+    return ProgressBar;
+};
+ProgressBar.defaultProps = {
+    progress: 0,
+    showProgress: false,
+    formatProgress: _formatProgress,
+    animated: true,
+};
+ProgressBar.Segmented = ProgressBarSegmented;
+WebStyleRegistry.registerComponent(ProgressBar);
+//# sourceMappingURL=index.js.map