@strapi/design-system 1.18.0 → 2.0.0-beta.0

package/dist/DatePicker/index.js

@@ -1,9 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const DatePicker = require('./DatePicker.js');
-
-
-
-exports.DatePicker = DatePicker.DatePicker;

package/dist/DatePicker/index.mjs

@@ -1 +0,0 @@
-export { DatePicker } from './DatePicker.mjs';

package/dist/DateTimePicker/DateTimePicker.js

@@ -1,165 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const React = require('react');
-const date = require('@internationalized/date');
-const styled = require('styled-components');
-const DatePicker$1 = require('../DatePicker/DatePicker.js');
-const DesignSystemProvider = require('../DesignSystemProvider.js');
-const deprecations = require('../helpers/deprecations.js');
-const useComposeRefs = require('../hooks/useComposeRefs.js');
-const useControllableState = require('../hooks/useControllableState.js');
-const useDateFormatter = require('../hooks/useDateFormatter.js');
-const useId = require('../hooks/useId.js');
-const TimePicker$1 = require('../TimePicker/TimePicker.js');
-const Field = require('../Field/Field.js');
-const Flex = require('../Flex/Flex.js');
-const FieldLabel = require('../Field/FieldLabel.js');
-const VisuallyHidden = require('../VisuallyHidden/VisuallyHidden.js');
-const FieldHint = require('../Field/FieldHint.js');
-const FieldError = require('../Field/FieldError.js');
-
-const _interopDefault = e => e && e.__esModule ? e : { default: e };
-
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
-  if (e) {
-    for (const k in e) {
-      if (k !== 'default') {
-        const d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: () => e[k]
-        });
-      }
-    }
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-
-const React__namespace = /*#__PURE__*/_interopNamespace(React);
-const styled__default = /*#__PURE__*/_interopDefault(styled);
-
-const DateTimePicker = React__namespace.forwardRef(({ 
-/**
- * @preserve
- * @deprecated This is no longer used.
- */
-ariaLabel: _ariaLabel, clearLabel = 'clear', dateLabel = 'Choose date', timeLabel = 'Choose time', disabled = false, error, hint, id, label, labelAction, onChange, onClear, name, required = false, 
-/**
- * @preserve
- * @deprecated This is no longer used.
- */
-selectButtonTitle: _selectButtonTitle, size = 'M', step, value, initialDate, ...props }, forwardedRef) => {
-    const DatePickerElement = React__namespace.useRef(null);
-    const [dateValue, setDateValue] = useControllableState.useControllableState({
-        defaultProp: initialDate ? convertUTCDateToCalendarDateTime(initialDate, false) : undefined,
-        prop: value ? convertUTCDateToCalendarDateTime(value, false) : value ?? undefined,
-        onChange(date$1) {
-            if (onChange) {
-                onChange(date$1?.toDate(date.getLocalTimeZone()));
-            }
-        },
-    });
-    const context = DesignSystemProvider.useDesignSystem('DateTimePicker');
-    const timeFormatter = useDateFormatter.useDateFormatter(context.locale, {
-        hour: '2-digit',
-        minute: '2-digit',
-        hour12: false,
-    });
-    const timeValue = dateValue ? timeFormatter.format(dateValue.toDate(date.getLocalTimeZone())) : '';
-    // React.useEffect(() => {
-    //   setTimeTextValue((s) => (s === timeValue ? s : timeValue));
-    // }, [timeValue]);
-    const handleDateChange = (date) => {
-        let newDate = date ? convertUTCDateToCalendarDateTime(date) : undefined;
-        /**
-         * If the date hasn't changed, don't do anything.
-         */
-        if (newDate && dateValue && newDate.compare(dateValue) === 0) {
-            return;
-        }
-        if (timeValue && newDate) {
-            const [hours, minutes] = timeValue.split(':');
-            newDate = newDate.set({ hour: parseInt(hours, 10), minute: parseInt(minutes, 10) });
-        }
-        setDateValue(newDate);
-    };
-    const handleTimeChange = (time) => {
-        if (!time) {
-            return;
-        }
-        const [hours, minutes] = time.split(':');
-        const dateToSet = dateValue
-            ? dateValue.set({ hour: parseInt(hours, 10), minute: parseInt(minutes, 10) })
-            : convertUTCDateToCalendarDateTime(new Date()).set({
-                hour: parseInt(hours, 10),
-                minute: parseInt(minutes, 10),
-            });
-        setDateValue(dateToSet);
-    };
-    const handleDateClear = (e) => {
-        setDateValue(undefined);
-        // setTimeTextValue('');
-        if (onClear) {
-            onClear(e);
-        }
-    };
-    const handleTimeClear = () => {
-        const newDate = dateValue ? dateValue.set({ hour: 0, minute: 0 }) : convertUTCDateToCalendarDateTime(new Date());
-        setDateValue(newDate);
-        // setTimeTextValue('');
-    };
-    const generatedId = useId.useId(id);
-    const timeId = useId.useId();
-    const dateId = useId.useId();
-    const composedRefs = useComposeRefs.useComposedRefs(DatePickerElement, forwardedRef);
-    return (jsxRuntime.jsx(Field.Field, { name: name, as: "fieldset", id: generatedId, "aria-labelledby": generatedId, hint: hint, error: error, required: required, children: jsxRuntime.jsxs(Flex.Flex, { as: "span", direction: "column", alignItems: "stretch", gap: 1, children: [jsxRuntime.jsx(FieldLabel.FieldLabel, { onClick: () => {
-                        /**
-                         * We're using fieldsets and legends and because they're not directly associated with the input
-                         * we want to manually focus the input because the labels for these inputs are visually hidden.
-                         */
-                        DatePickerElement.current.focus();
-                    }, as: "legend", id: generatedId, action: labelAction, children: label }), jsxRuntime.jsxs(Flex.Flex, { flex: "1", gap: 1, children: [jsxRuntime.jsx(VisuallyHidden.VisuallyHidden, { as: "label", htmlFor: dateId, children: dateLabel }), jsxRuntime.jsx(DatePicker, { ...props, selectedDate: dateValue?.toDate('UTC'), onChange: handleDateChange, error: typeof error === 'string', required: required, size: size, onClear: onClear ? handleDateClear : undefined, clearLabel: `${clearLabel} date`, disabled: disabled, id: dateId, ref: composedRefs, "aria-describedby": `${generatedId}-hint ${generatedId}-error` }), jsxRuntime.jsx(VisuallyHidden.VisuallyHidden, { as: "label", htmlFor: timeId, children: timeLabel }), jsxRuntime.jsx(TimePicker, { size: size, error: typeof error === 'string', value: timeValue, onChange: handleTimeChange, onClear: onClear && timeValue !== undefined && timeValue !== '00:00' ? handleTimeClear : undefined, clearLabel: `${clearLabel} time`, required: required, disabled: disabled, step: step, id: timeId, "aria-describedby": `${generatedId}-hint ${generatedId}-error` })] }), jsxRuntime.jsx(FieldHint.FieldHint, {}), jsxRuntime.jsx(FieldError.FieldError, {})] }) }));
-});
-const warnOnce = deprecations.once(console.warn);
-const convertUTCDateToCalendarDateTime = (date$1, resetTime = true) => {
-    /**
-     * TODO: remove this in V2, it's a deprecated API
-     */
-    if (typeof date$1 === 'string') {
-        warnOnce("It looks like you're passing a string as representation of a Date to the DatePicker. This is deprecated, look to passing a Date instead.");
-        const timestamp = Date.parse(date$1);
-        if (!Number.isNaN(timestamp)) {
-            date$1 = new Date(timestamp);
-        }
-        else {
-            date$1 = new Date();
-        }
-    }
-    const utcDateString = date$1.toISOString();
-    let zonedDateTime = date.parseAbsoluteToLocal(utcDateString);
-    if (resetTime) {
-        zonedDateTime = zonedDateTime.set({ hour: 0, minute: 0 });
-    }
-    /**
-     * ZonedDateTime can't have weeks added,
-     * see – https://github.com/adobe/react-spectrum/issues/3667
-     */
-    return date.toCalendarDateTime(zonedDateTime);
-};
-const DatePicker = styled__default.default(DatePicker$1.DatePickerInput) `
-  flex: 1 1 70%;
-  min-width: 120px;
-`;
-const TimePicker = styled__default.default(TimePicker$1.TimePickerInput) `
-  flex: 1 1 30%;
-  min-width: 140px;
-`;
-
-exports.DateTimePicker = DateTimePicker;
-exports.convertUTCDateToCalendarDateTime = convertUTCDateToCalendarDateTime;

package/dist/DateTimePicker/DateTimePicker.mjs

@@ -1,137 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import * as React from 'react';
-import { getLocalTimeZone, parseAbsoluteToLocal, toCalendarDateTime } from '@internationalized/date';
-import styled from 'styled-components';
-import { DatePickerInput } from '../DatePicker/DatePicker.mjs';
-import { useDesignSystem } from '../DesignSystemProvider.mjs';
-import { once } from '../helpers/deprecations.mjs';
-import { useComposedRefs } from '../hooks/useComposeRefs.mjs';
-import { useControllableState } from '../hooks/useControllableState.mjs';
-import { useDateFormatter } from '../hooks/useDateFormatter.mjs';
-import { useId } from '../hooks/useId.mjs';
-import { TimePickerInput } from '../TimePicker/TimePicker.mjs';
-import { Field } from '../Field/Field.mjs';
-import { Flex } from '../Flex/Flex.mjs';
-import { FieldLabel } from '../Field/FieldLabel.mjs';
-import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.mjs';
-import { FieldHint } from '../Field/FieldHint.mjs';
-import { FieldError } from '../Field/FieldError.mjs';
-
-const DateTimePicker = React.forwardRef(({ 
-/**
- * @preserve
- * @deprecated This is no longer used.
- */
-ariaLabel: _ariaLabel, clearLabel = 'clear', dateLabel = 'Choose date', timeLabel = 'Choose time', disabled = false, error, hint, id, label, labelAction, onChange, onClear, name, required = false, 
-/**
- * @preserve
- * @deprecated This is no longer used.
- */
-selectButtonTitle: _selectButtonTitle, size = 'M', step, value, initialDate, ...props }, forwardedRef) => {
-    const DatePickerElement = React.useRef(null);
-    const [dateValue, setDateValue] = useControllableState({
-        defaultProp: initialDate ? convertUTCDateToCalendarDateTime(initialDate, false) : undefined,
-        prop: value ? convertUTCDateToCalendarDateTime(value, false) : value ?? undefined,
-        onChange(date) {
-            if (onChange) {
-                onChange(date?.toDate(getLocalTimeZone()));
-            }
-        },
-    });
-    const context = useDesignSystem('DateTimePicker');
-    const timeFormatter = useDateFormatter(context.locale, {
-        hour: '2-digit',
-        minute: '2-digit',
-        hour12: false,
-    });
-    const timeValue = dateValue ? timeFormatter.format(dateValue.toDate(getLocalTimeZone())) : '';
-    // React.useEffect(() => {
-    //   setTimeTextValue((s) => (s === timeValue ? s : timeValue));
-    // }, [timeValue]);
-    const handleDateChange = (date) => {
-        let newDate = date ? convertUTCDateToCalendarDateTime(date) : undefined;
-        /**
-         * If the date hasn't changed, don't do anything.
-         */
-        if (newDate && dateValue && newDate.compare(dateValue) === 0) {
-            return;
-        }
-        if (timeValue && newDate) {
-            const [hours, minutes] = timeValue.split(':');
-            newDate = newDate.set({ hour: parseInt(hours, 10), minute: parseInt(minutes, 10) });
-        }
-        setDateValue(newDate);
-    };
-    const handleTimeChange = (time) => {
-        if (!time) {
-            return;
-        }
-        const [hours, minutes] = time.split(':');
-        const dateToSet = dateValue
-            ? dateValue.set({ hour: parseInt(hours, 10), minute: parseInt(minutes, 10) })
-            : convertUTCDateToCalendarDateTime(new Date()).set({
-                hour: parseInt(hours, 10),
-                minute: parseInt(minutes, 10),
-            });
-        setDateValue(dateToSet);
-    };
-    const handleDateClear = (e) => {
-        setDateValue(undefined);
-        // setTimeTextValue('');
-        if (onClear) {
-            onClear(e);
-        }
-    };
-    const handleTimeClear = () => {
-        const newDate = dateValue ? dateValue.set({ hour: 0, minute: 0 }) : convertUTCDateToCalendarDateTime(new Date());
-        setDateValue(newDate);
-        // setTimeTextValue('');
-    };
-    const generatedId = useId(id);
-    const timeId = useId();
-    const dateId = useId();
-    const composedRefs = useComposedRefs(DatePickerElement, forwardedRef);
-    return (jsx(Field, { name: name, as: "fieldset", id: generatedId, "aria-labelledby": generatedId, hint: hint, error: error, required: required, children: jsxs(Flex, { as: "span", direction: "column", alignItems: "stretch", gap: 1, children: [jsx(FieldLabel, { onClick: () => {
-                        /**
-                         * We're using fieldsets and legends and because they're not directly associated with the input
-                         * we want to manually focus the input because the labels for these inputs are visually hidden.
-                         */
-                        DatePickerElement.current.focus();
-                    }, as: "legend", id: generatedId, action: labelAction, children: label }), jsxs(Flex, { flex: "1", gap: 1, children: [jsx(VisuallyHidden, { as: "label", htmlFor: dateId, children: dateLabel }), jsx(DatePicker, { ...props, selectedDate: dateValue?.toDate('UTC'), onChange: handleDateChange, error: typeof error === 'string', required: required, size: size, onClear: onClear ? handleDateClear : undefined, clearLabel: `${clearLabel} date`, disabled: disabled, id: dateId, ref: composedRefs, "aria-describedby": `${generatedId}-hint ${generatedId}-error` }), jsx(VisuallyHidden, { as: "label", htmlFor: timeId, children: timeLabel }), jsx(TimePicker, { size: size, error: typeof error === 'string', value: timeValue, onChange: handleTimeChange, onClear: onClear && timeValue !== undefined && timeValue !== '00:00' ? handleTimeClear : undefined, clearLabel: `${clearLabel} time`, required: required, disabled: disabled, step: step, id: timeId, "aria-describedby": `${generatedId}-hint ${generatedId}-error` })] }), jsx(FieldHint, {}), jsx(FieldError, {})] }) }));
-});
-const warnOnce = once(console.warn);
-const convertUTCDateToCalendarDateTime = (date, resetTime = true) => {
-    /**
-     * TODO: remove this in V2, it's a deprecated API
-     */
-    if (typeof date === 'string') {
-        warnOnce("It looks like you're passing a string as representation of a Date to the DatePicker. This is deprecated, look to passing a Date instead.");
-        const timestamp = Date.parse(date);
-        if (!Number.isNaN(timestamp)) {
-            date = new Date(timestamp);
-        }
-        else {
-            date = new Date();
-        }
-    }
-    const utcDateString = date.toISOString();
-    let zonedDateTime = parseAbsoluteToLocal(utcDateString);
-    if (resetTime) {
-        zonedDateTime = zonedDateTime.set({ hour: 0, minute: 0 });
-    }
-    /**
-     * ZonedDateTime can't have weeks added,
-     * see – https://github.com/adobe/react-spectrum/issues/3667
-     */
-    return toCalendarDateTime(zonedDateTime);
-};
-const DatePicker = styled(DatePickerInput) `
-  flex: 1 1 70%;
-  min-width: 120px;
-`;
-const TimePicker = styled(TimePickerInput) `
-  flex: 1 1 30%;
-  min-width: 140px;
-`;
-
-export { DateTimePicker, convertUTCDateToCalendarDateTime };

package/dist/DateTimePicker/index.js

@@ -1,10 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const DateTimePicker = require('./DateTimePicker.js');
-
-
-
-exports.DateTimePicker = DateTimePicker.DateTimePicker;
-exports.convertUTCDateToCalendarDateTime = DateTimePicker.convertUTCDateToCalendarDateTime;

package/dist/DateTimePicker/index.mjs

@@ -1 +0,0 @@
-export { DateTimePicker, convertUTCDateToCalendarDateTime } from './DateTimePicker.mjs';

package/dist/DesignSystemProvider.js

@@ -1,27 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const context = require('./helpers/context.js');
-const ThemeProvider = require('./ThemeProvider/ThemeProvider.js');
-
-const DEFAULT_LOCALE = 'en-EN';
-const getDefaultLocale = () => {
-    if (typeof navigator === 'undefined') {
-        return DEFAULT_LOCALE;
-    }
-    if (navigator.language) {
-        return navigator.language;
-    }
-    return DEFAULT_LOCALE;
-};
-const [Provider, useDesignSystem] = context.createContext('StrapiDesignSystem', {
-    locale: getDefaultLocale(),
-});
-const DesignSystemProvider = ({ locale = getDefaultLocale(), ...restProps }) => {
-    return (jsxRuntime.jsx(Provider, { locale: locale, children: jsxRuntime.jsx(ThemeProvider.ThemeProvider, { ...restProps }) }));
-};
-
-exports.DesignSystemProvider = DesignSystemProvider;
-exports.useDesignSystem = useDesignSystem;

package/dist/DesignSystemProvider.mjs

@@ -1,22 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { createContext } from './helpers/context.mjs';
-import { ThemeProvider } from './ThemeProvider/ThemeProvider.mjs';
-
-const DEFAULT_LOCALE = 'en-EN';
-const getDefaultLocale = () => {
-    if (typeof navigator === 'undefined') {
-        return DEFAULT_LOCALE;
-    }
-    if (navigator.language) {
-        return navigator.language;
-    }
-    return DEFAULT_LOCALE;
-};
-const [Provider, useDesignSystem] = createContext('StrapiDesignSystem', {
-    locale: getDefaultLocale(),
-});
-const DesignSystemProvider = ({ locale = getDefaultLocale(), ...restProps }) => {
-    return (jsx(Provider, { locale: locale, children: jsx(ThemeProvider, { ...restProps }) }));
-};
-
-export { DesignSystemProvider, useDesignSystem };

package/dist/Dialog/Dialog.js

@@ -1,44 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const styled = require('styled-components');
-const index = require('../DismissibleLayer/index.js');
-const setOpacity = require('../helpers/setOpacity.js');
-const useId = require('../hooks/useId.js');
-const useLockScroll = require('../hooks/useLockScroll.js');
-const FocusTrap = require('../FocusTrap/FocusTrap.js');
-const Box = require('../Box/Box.js');
-const Flex = require('../Flex/Flex.js');
-const Portal = require('../Portal/Portal.js');
-const Typography = require('../Typography/Typography.js');
-
-const _interopDefault = e => e && e.__esModule ? e : { default: e };
-
-const styled__default = /*#__PURE__*/_interopDefault(styled);
-
-const DialogWrapper = styled__default.default(Box.Box) `
-  inset: 0;
-  background: ${({ theme }) => setOpacity.setOpacity(theme.colors.neutral800, 0.2)};
-`;
-const DialogContainer = styled__default.default(Box.Box) `
-  max-width: ${412 / 16}rem;
-  margin: 0 auto;
-  overflow: hidden;
-  margin-top: 10%;
-`;
-const DialogHeader = styled__default.default(Flex.Flex) `
-  border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};
-`;
-const Dialog = ({ onClose, title, as = 'h2', isOpen, id, zIndex = 4, ...props }) => {
-    const generatedId = useId.useId(id);
-    useLockScroll(isOpen);
-    if (!isOpen) {
-        return null;
-    }
-    const labelledBy = `${generatedId}-label`;
-    return (jsxRuntime.jsx(Portal.Portal, { children: jsxRuntime.jsx(DialogWrapper, { padding: 8, position: "fixed", zIndex: zIndex, children: jsxRuntime.jsx(FocusTrap.FocusTrap, { children: jsxRuntime.jsx(index.DismissibleLayer, { onEscapeKeyDown: onClose, onPointerDownOutside: onClose, children: jsxRuntime.jsxs(DialogContainer, { "aria-labelledby": labelledBy, "aria-modal": true, background: "neutral0", hasRadius: true, shadow: "popupShadow", role: "dialog", children: [jsxRuntime.jsx(DialogHeader, { padding: 6, justifyContent: "center", children: jsxRuntime.jsx(Typography.Typography, { variant: "beta", as: as, id: labelledBy, children: title }) }), jsxRuntime.jsx(Box.Box, { ...props })] }) }) }) }) }));
-};
-
-exports.Dialog = Dialog;

package/dist/Dialog/Dialog.mjs

@@ -1,36 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import styled from 'styled-components';
-import { DismissibleLayer } from '../DismissibleLayer/index.mjs';
-import { setOpacity } from '../helpers/setOpacity.mjs';
-import { useId } from '../hooks/useId.mjs';
-import useLockScroll from '../hooks/useLockScroll.mjs';
-import { FocusTrap } from '../FocusTrap/FocusTrap.mjs';
-import { Box } from '../Box/Box.mjs';
-import { Flex } from '../Flex/Flex.mjs';
-import { Portal } from '../Portal/Portal.mjs';
-import { Typography } from '../Typography/Typography.mjs';
-
-const DialogWrapper = styled(Box) `
-  inset: 0;
-  background: ${({ theme }) => setOpacity(theme.colors.neutral800, 0.2)};
-`;
-const DialogContainer = styled(Box) `
-  max-width: ${412 / 16}rem;
-  margin: 0 auto;
-  overflow: hidden;
-  margin-top: 10%;
-`;
-const DialogHeader = styled(Flex) `
-  border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};
-`;
-const Dialog = ({ onClose, title, as = 'h2', isOpen, id, zIndex = 4, ...props }) => {
-    const generatedId = useId(id);
-    useLockScroll(isOpen);
-    if (!isOpen) {
-        return null;
-    }
-    const labelledBy = `${generatedId}-label`;
-    return (jsx(Portal, { children: jsx(DialogWrapper, { padding: 8, position: "fixed", zIndex: zIndex, children: jsx(FocusTrap, { children: jsx(DismissibleLayer, { onEscapeKeyDown: onClose, onPointerDownOutside: onClose, children: jsxs(DialogContainer, { "aria-labelledby": labelledBy, "aria-modal": true, background: "neutral0", hasRadius: true, shadow: "popupShadow", role: "dialog", children: [jsx(DialogHeader, { padding: 6, justifyContent: "center", children: jsx(Typography, { variant: "beta", as: as, id: labelledBy, children: title }) }), jsx(Box, { ...props })] }) }) }) }) }));
-};
-
-export { Dialog };

package/dist/Dialog/DialogBody.js

@@ -1,28 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const styled = require('styled-components');
-const Box = require('../Box/Box.js');
-const Flex = require('../Flex/Flex.js');
-
-const _interopDefault = e => e && e.__esModule ? e : { default: e };
-
-const styled__default = /*#__PURE__*/_interopDefault(styled);
-
-const IconContainer = styled__default.default(Box.Box) `
-  svg {
-    width: ${({ theme }) => theme.spaces[6]};
-    height: ${({ theme }) => theme.spaces[6]};
-
-    path {
-      fill: ${({ theme }) => theme.colors.danger600};
-    }
-  }
-`;
-const DialogBody = ({ children, icon }) => {
-    return (jsxRuntime.jsxs(Box.Box, { paddingTop: 8, paddingBottom: 8, paddingLeft: 6, paddingRight: 6, children: [icon && (jsxRuntime.jsx(IconContainer, { paddingBottom: 2, children: jsxRuntime.jsx(Flex.Flex, { justifyContent: "center", children: icon }) })), children] }));
-};
-
-exports.DialogBody = DialogBody;

package/dist/Dialog/DialogBody.mjs

@@ -1,20 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import styled from 'styled-components';
-import { Box } from '../Box/Box.mjs';
-import { Flex } from '../Flex/Flex.mjs';
-
-const IconContainer = styled(Box) `
-  svg {
-    width: ${({ theme }) => theme.spaces[6]};
-    height: ${({ theme }) => theme.spaces[6]};
-
-    path {
-      fill: ${({ theme }) => theme.colors.danger600};
-    }
-  }
-`;
-const DialogBody = ({ children, icon }) => {
-    return (jsxs(Box, { paddingTop: 8, paddingBottom: 8, paddingLeft: 6, paddingRight: 6, children: [icon && (jsx(IconContainer, { paddingBottom: 2, children: jsx(Flex, { justifyContent: "center", children: icon }) })), children] }));
-};
-
-export { DialogBody };

package/dist/Dialog/DialogFooter.js

@@ -1,27 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const styled = require('styled-components');
-const Box = require('../Box/Box.js');
-const Flex = require('../Flex/Flex.js');
-
-const _interopDefault = e => e && e.__esModule ? e : { default: e };
-
-const styled__default = /*#__PURE__*/_interopDefault(styled);
-
-const FooterWrapper = styled__default.default(Box.Box) `
-  border-top: 1px solid ${({ theme }) => theme.colors.neutral150};
-
-  button {
-    width: 100%;
-    display: inline-flex;
-    justify-content: center;
-  }
-`;
-const DialogFooter = ({ startAction, endAction }) => {
-    return (jsxRuntime.jsx(FooterWrapper, { padding: 4, children: jsxRuntime.jsxs(Flex.Flex, { gap: 2, children: [startAction, endAction] }) }));
-};
-
-exports.DialogFooter = DialogFooter;

package/dist/Dialog/DialogFooter.mjs

@@ -1,19 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import styled from 'styled-components';
-import { Box } from '../Box/Box.mjs';
-import { Flex } from '../Flex/Flex.mjs';
-
-const FooterWrapper = styled(Box) `
-  border-top: 1px solid ${({ theme }) => theme.colors.neutral150};
-
-  button {
-    width: 100%;
-    display: inline-flex;
-    justify-content: center;
-  }
-`;
-const DialogFooter = ({ startAction, endAction }) => {
-    return (jsx(FooterWrapper, { padding: 4, children: jsxs(Flex, { gap: 2, children: [startAction, endAction] }) }));
-};
-
-export { DialogFooter };

package/dist/Dialog/index.js

@@ -1,13 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const Dialog = require('./Dialog.js');
-const DialogBody = require('./DialogBody.js');
-const DialogFooter = require('./DialogFooter.js');
-
-
-
-exports.Dialog = Dialog.Dialog;
-exports.DialogBody = DialogBody.DialogBody;
-exports.DialogFooter = DialogFooter.DialogFooter;

package/dist/Dialog/index.mjs

@@ -1,3 +0,0 @@
-export { Dialog } from './Dialog.mjs';
-export { DialogBody } from './DialogBody.mjs';
-export { DialogFooter } from './DialogFooter.mjs';

package/dist/DismissibleLayer/index.js

@@ -1,29 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const DismissibleLayerPrimitive = require('@radix-ui/react-dismissable-layer');
-
-function _interopNamespace(e) {
-	if (e && e.__esModule) return e;
-	const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
-	if (e) {
-		for (const k in e) {
-			if (k !== 'default') {
-				const d = Object.getOwnPropertyDescriptor(e, k);
-				Object.defineProperty(n, k, d.get ? d : {
-					enumerable: true,
-					get: () => e[k]
-				});
-			}
-		}
-	}
-	n.default = e;
-	return Object.freeze(n);
-}
-
-const DismissibleLayerPrimitive__namespace = /*#__PURE__*/_interopNamespace(DismissibleLayerPrimitive);
-
-const DismissibleLayer = DismissibleLayerPrimitive__namespace.Root;
-
-exports.DismissibleLayer = DismissibleLayer;

package/dist/DismissibleLayer/index.mjs

@@ -1,5 +0,0 @@
-import * as DismissibleLayerPrimitive from '@radix-ui/react-dismissable-layer';
-
-const DismissibleLayer = DismissibleLayerPrimitive.Root;
-
-export { DismissibleLayer };

package/dist/Divider/Divider.js

@@ -1,24 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const styled = require('styled-components');
-const Box = require('../Box/Box.js');
-
-const _interopDefault = e => e && e.__esModule ? e : { default: e };
-
-const styled__default = /*#__PURE__*/_interopDefault(styled);
-
-const DividerWrapper = styled__default.default(Box.Box) `
-  height: 1px;
-  border: none;
-  /* If contained in a Flex parent we want to prevent the Divider to shink */
-  flex-shrink: 0;
-  ${({ unsetMargin }) => (unsetMargin ? 'margin: 0;' : '')}
-`;
-const Divider = ({ unsetMargin = true, ...props }) => {
-    return jsxRuntime.jsx(DividerWrapper, { ...props, background: "neutral150", as: "hr", unsetMargin: unsetMargin });
-};
-
-exports.Divider = Divider;

package/dist/Divider/Divider.mjs

@@ -1,16 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import styled from 'styled-components';
-import { Box } from '../Box/Box.mjs';
-
-const DividerWrapper = styled(Box) `
-  height: 1px;
-  border: none;
-  /* If contained in a Flex parent we want to prevent the Divider to shink */
-  flex-shrink: 0;
-  ${({ unsetMargin }) => (unsetMargin ? 'margin: 0;' : '')}
-`;
-const Divider = ({ unsetMargin = true, ...props }) => {
-    return jsx(DividerWrapper, { ...props, background: "neutral150", as: "hr", unsetMargin: unsetMargin });
-};
-
-export { Divider };