@eightshift/ui-components 6.3.0 → 7.0.0

package/dist/components/index.js

@@ -1,136 +1,60 @@
+import "../proxy-BG7-_Ou3.js";
 import { AnimatedVisibility } from "./animated-visibility/animated-visibility.js";
+import { t as LinkInput } from "../link-input-D7iDRpOM.js";
+import { t as Modal } from "../modal-DbVLYMkH.js";
+import { i as Tabs, n as TabList, r as TabPanel, t as Tab } from "../tabs-BrdyBER5.js";
+import { n as Tooltip, t as DecorativeTooltip } from "../tooltip-BzJzYlcc.js";
+import { t as ToggleButton } from "../toggle-button-DJ8jNQ-9.js";
+import { n as ButtonGroup, t as Button } from "../button-COTeluL8.js";
+import { t as Checkbox } from "../checkbox-D0AWkLhp.js";
+import { t as ColorSwatch } from "../color-swatch-CBYsO_Zs.js";
+import { t as SolidColorPicker } from "../solid-color-picker-DbT-aoVx.js";
+import { t as Switch } from "../switch-L8dFSQWQ.js";
+import { t as NumberPicker } from "../number-picker-CkA1iJNZ.js";
+import { t as InputField } from "../input-field-UCZL5bqv.js";
+import { RichLabel } from "./rich-label/rich-label.js";
 import { BaseControl } from "./base-control/base-control.js";
 import { BreakpointPreview } from "./breakpoint-preview/breakpoint-preview.js";
-import { Button, ButtonGroup } from "./button/button.js";
-import { Checkbox } from "./checkbox/checkbox.js";
+import "../build-module-sxK3nxOK.js";
+import { Expandable } from "./expandable/expandable.js";
+import { Popover, TriggeredPopover } from "./popover/popover.js";
+import { Spacer } from "./spacer/spacer.js";
 import { ComponentToggle } from "./component-toggle/component-toggle.js";
+import { HStack } from "./layout/hstack.js";
 import { ContainerPanel } from "./container-panel/container-panel.js";
-import { C } from "../color-swatch-bUFkK7ox.js";
+import { Menu, MenuItem, MenuSection, MenuSectionHeader, MenuSeparator, SubMenuItem } from "./menu/menu.js";
 import { ColorPicker } from "./color-pickers/color-picker.js";
 import { ColumnConfigSlider, ColumnConfigSliderOutput } from "./slider/column-config-slider.js";
 import { Container, ContainerGroup } from "./base-control/container.js";
 import { DraggableList } from "./draggable-list/draggable-list.js";
 import { DraggableListItem, DraggableListItemHandle } from "./draggable-list/draggable-list-item.js";
 import { DraggableContext } from "./draggable/draggable-context.js";
-import { Draggable } from "./draggable/draggable.js";
+import { t as Draggable } from "../draggable-CYQyD9gG.js";
 import { DraggableHandle } from "./draggable/draggable-handle.js";
-import { Expandable } from "./expandable/expandable.js";
+import { t as SmartImage } from "../smart-image-CbSsEASF.js";
 import { FilePickerShell } from "./placeholders/file-picker-shell.js";
 import { FilePlaceholder } from "./placeholders/file-placeholder.js";
-import { GradientEditor } from "./color-pickers/gradient-editor.js";
-import { HStack } from "./layout/hstack.js";
-import { RichLabel } from "./rich-label/rich-label.js";
-import { InputField } from "./input-field/input-field.js";
+import { t as GradientEditor } from "../gradient-editor-DbH8NU2p.js";
+import { Slider } from "./slider/slider.js";
+import { MatrixAlign } from "./matrix-align/matrix-align.js";
+import { Toggle } from "./toggle/toggle.js";
+import { RadioButton, RadioButtonGroup } from "./radio/radio.js";
+import { OptionSelect } from "./option-select/option-select.js";
 import { ImagePlaceholder } from "./placeholders/image-placeholder.js";
 import { ItemCollection } from "./item-collection/item-collection.js";
-import { LinkInput } from "./link-input/link-input.js";
-import { MatrixAlign } from "./matrix-align/matrix-align.js";
 import { MediaPlaceholder } from "./placeholders/media-placeholder.js";
-import { Menu, MenuItem, MenuSection, MenuSectionHeader, MenuSeparator, SubMenuItem } from "./menu/menu.js";
+import { ResponsivePreview } from "./responsive-preview/responsive-preview.js";
 import { MiniResponsive } from "./responsive/mini-responsive.js";
 import { Notice } from "./notice/notice.js";
-import { NumberPicker } from "./number-picker/number-picker.js";
-import { Popover, TriggeredPopover } from "./popover/popover.js";
 import { PortalProvider } from "./portal-provider/portal-provider.js";
-import { RadioButton, RadioButtonGroup } from "./radio/radio.js";
 import { Repeater } from "./repeater/repeater.js";
 import { RepeaterItem } from "./repeater/repeater-item.js";
 import { Responsive } from "./responsive/responsive.js";
 import { ResponsiveLegacy } from "./responsive/responsive-legacy.js";
-import { ResponsivePreview } from "./responsive-preview/responsive-preview.js";
 import { AsyncMultiSelect } from "./select/async-multi-select.js";
 import { AsyncSelect } from "./select/async-select.js";
-import { Modal } from "./modal/modal.js";
 import { MultiSelect } from "./select/multi-select.js";
-import { OptionSelect } from "./option-select/option-select.js";
 import { OptionsPanel, OptionsPanelHeader, OptionsPanelIntro, OptionsPanelSection } from "./options-panel/options-panel.js";
 import { Select } from "./select/single-select.js";
-import { Slider } from "./slider/slider.js";
-import { SmartImage } from "./smart-image/smart-image.js";
-import { __SmartImageNext } from "./smart-image/smart-image-next.js";
-import { SolidColorPicker } from "./color-pickers/solid-color-picker.js";
-import { Spacer } from "./spacer/spacer.js";
-import { Tab, TabList, TabPanel, Tabs } from "./tabs/tabs.js";
-import { Toggle } from "./toggle/toggle.js";
-import { Switch } from "./toggle/switch.js";
-import { ToggleButton } from "./toggle-button/toggle-button.js";
-import { DecorativeTooltip, Tooltip } from "./tooltip/tooltip.js";
 import { VStack } from "./layout/vstack.js";
-export {
-  AnimatedVisibility,
-  AsyncMultiSelect,
-  AsyncSelect,
-  BaseControl,
-  BreakpointPreview,
-  Button,
-  ButtonGroup,
-  Checkbox,
-  ColorPicker,
-  C as ColorSwatch,
-  ColumnConfigSlider,
-  ColumnConfigSliderOutput,
-  ComponentToggle,
-  Container,
-  ContainerGroup,
-  ContainerPanel,
-  DecorativeTooltip,
-  Draggable,
-  DraggableContext,
-  DraggableHandle,
-  DraggableList,
-  DraggableListItem,
-  DraggableListItemHandle,
-  Expandable,
-  FilePickerShell,
-  FilePlaceholder,
-  GradientEditor,
-  HStack,
-  ImagePlaceholder,
-  InputField,
-  ItemCollection,
-  LinkInput,
-  MatrixAlign,
-  MediaPlaceholder,
-  Menu,
-  MenuItem,
-  MenuSection,
-  MenuSectionHeader,
-  MenuSeparator,
-  MiniResponsive,
-  Modal,
-  MultiSelect,
-  Notice,
-  NumberPicker,
-  OptionSelect,
-  OptionsPanel,
-  OptionsPanelHeader,
-  OptionsPanelIntro,
-  OptionsPanelSection,
-  Popover,
-  PortalProvider,
-  RadioButton,
-  RadioButtonGroup,
-  Repeater,
-  RepeaterItem,
-  Responsive,
-  ResponsiveLegacy,
-  ResponsivePreview,
-  RichLabel,
-  Select,
-  Slider,
-  SmartImage,
-  SolidColorPicker,
-  Spacer,
-  SubMenuItem,
-  Switch,
-  Tab,
-  TabList,
-  TabPanel,
-  Tabs,
-  Toggle,
-  ToggleButton,
-  Tooltip,
-  TriggeredPopover,
-  VStack,
-  __SmartImageNext
-};
+export { AnimatedVisibility, AsyncMultiSelect, AsyncSelect, BaseControl, BreakpointPreview, Button, ButtonGroup, Checkbox, ColorPicker, ColorSwatch, ColumnConfigSlider, ColumnConfigSliderOutput, ComponentToggle, Container, ContainerGroup, ContainerPanel, DecorativeTooltip, Draggable, DraggableContext, DraggableHandle, DraggableList, DraggableListItem, DraggableListItemHandle, Expandable, FilePickerShell, FilePlaceholder, GradientEditor, HStack, ImagePlaceholder, InputField, ItemCollection, LinkInput, MatrixAlign, MediaPlaceholder, Menu, MenuItem, MenuSection, MenuSectionHeader, MenuSeparator, MiniResponsive, Modal, MultiSelect, Notice, NumberPicker, OptionSelect, OptionsPanel, OptionsPanelHeader, OptionsPanelIntro, OptionsPanelSection, Popover, PortalProvider, RadioButton, RadioButtonGroup, Repeater, RepeaterItem, Responsive, ResponsiveLegacy, ResponsivePreview, RichLabel, Select, Slider, SmartImage, SolidColorPicker, Spacer, SubMenuItem, Switch, Tab, TabList, TabPanel, Tabs, Toggle, ToggleButton, Tooltip, TriggeredPopover, VStack };

package/dist/components/input-field/input-field.js

@@ -1,326 +1,2 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { d as $2d73ec29415bd339$export$712718f7aec83d5, b as $3985021b0ad6602f$export$37fb8590cf2c088c, a as $a049562f99e7db0e$export$f9c6924e160136d1, $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-BG9DaxYN.js";
-import { a as $01b77f81d0f07f68$export$75b6ee27786ba447, $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-_aSf9-8u.js";
-import { $ as $64fa3d84918910a7$export$29f1550f4b0d4415, h as $64fa3d84918910a7$export$4d86445c2cf5e3, a as $64fa3d84918910a7$export$df3a06d6289f983e, b as $3ef42575df84b30b$export$9d1611c77c2fe928, e as $64fa3d84918910a7$export$fabf2dc03a41866e, f as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, g as $64fa3d84918910a7$export$ef03459518577ad4, i as $64fa3d84918910a7$export$2881499e37b75b9a } from "../../utils-Cr3pLd9c.js";
-import $dbSRa$react__default, { forwardRef, createContext, useRef, useState, useCallback } from "react";
-import { y as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-DkmPQdGE.js";
-import { a as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-B2glEZ25.js";
-import { $ as $ee014567cb39d3f0$export$ff05c3ac10437e03 } from "../../FieldError-BPG0hKfB.js";
-import { a as $4e85f108e88277b8$export$698f465ec27e93df } from "../../RSPContexts-CJ-HBf0L.js";
-import { $ as $d3e0e05bdfcf66bd$export$c24727297075ec6a } from "../../Form-Cq3fu75_.js";
-import { a as $514c0188e459b4c0$export$9afb8bc826b033ea } from "../../Text-CjFEHSfr.js";
-import { $ as $f39a9eba43920ace$export$86427a43e3e48ebb } from "../../Hidden-DOH36apC.js";
-import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-eGTqWSTd.js";
-import { BaseControl } from "../base-control/base-control.js";
-import { c as cva } from "../../index-BHpUy2Ix.js";
-const $216918bed6669f72$export$2dc6166a7e65358c = /* @__PURE__ */ createContext({});
-let $216918bed6669f72$var$filterHoverProps = (props) => {
-  let { onHoverStart, onHoverChange, onHoverEnd, ...otherProps } = props;
-  return otherProps;
-};
-const $216918bed6669f72$export$f5c9f3c2c4054eec = /* @__PURE__ */ forwardRef(function TextArea(props, ref) {
-  [props, ref] = $64fa3d84918910a7$export$29f1550f4b0d4415(props, ref, $216918bed6669f72$export$2dc6166a7e65358c);
-  let { hoverProps, isHovered } = $6179b936705e76d3$export$ae780daf29e6d456(props);
-  let { isFocused, isFocusVisible, focusProps } = $f7dceffc5ad7768b$export$4e328f61c538687f({
-    isTextInput: true,
-    autoFocus: props.autoFocus
-  });
-  let isInvalid = !!props["aria-invalid"] && props["aria-invalid"] !== "false";
-  let renderProps = $64fa3d84918910a7$export$4d86445c2cf5e3({
-    ...props,
-    values: {
-      isHovered,
-      isFocused,
-      isFocusVisible,
-      isDisabled: props.disabled || false,
-      isInvalid
-    },
-    defaultClassName: "react-aria-TextArea"
-  });
-  return /* @__PURE__ */ $dbSRa$react__default.createElement($64fa3d84918910a7$export$df3a06d6289f983e.textarea, {
-    ...$3ef42575df84b30b$export$9d1611c77c2fe928($216918bed6669f72$var$filterHoverProps(props), focusProps, hoverProps),
-    ...renderProps,
-    ref,
-    "data-focused": isFocused || void 0,
-    "data-disabled": props.disabled || void 0,
-    "data-hovered": isHovered || void 0,
-    "data-focus-visible": isFocusVisible || void 0,
-    "data-invalid": isInvalid || void 0
-  });
-});
-const $bcdf0525bf22703d$export$2129e27b3ef0d483 = /* @__PURE__ */ createContext(null);
-const $bcdf0525bf22703d$export$2c73285ae9390cec = /* @__PURE__ */ $f39a9eba43920ace$export$86427a43e3e48ebb(function TextField(props, ref) {
-  [props, ref] = $64fa3d84918910a7$export$29f1550f4b0d4415(props, ref, $bcdf0525bf22703d$export$2129e27b3ef0d483);
-  let { validationBehavior: formValidationBehavior } = $64fa3d84918910a7$export$fabf2dc03a41866e($d3e0e05bdfcf66bd$export$c24727297075ec6a) || {};
-  var _props_validationBehavior, _ref;
-  let validationBehavior = (_ref = (_props_validationBehavior = props.validationBehavior) !== null && _props_validationBehavior !== void 0 ? _props_validationBehavior : formValidationBehavior) !== null && _ref !== void 0 ? _ref : "native";
-  let inputRef = useRef(null);
-  [props, inputRef] = $64fa3d84918910a7$export$29f1550f4b0d4415(props, inputRef, $4e85f108e88277b8$export$698f465ec27e93df);
-  let [labelRef, label] = $64fa3d84918910a7$export$9d4c57ee4c6ffdd8(!props["aria-label"] && !props["aria-labelledby"]);
-  let [inputElementType, setInputElementType] = useState("input");
-  let { labelProps, inputProps, descriptionProps, errorMessageProps, ...validation } = $2d73ec29415bd339$export$712718f7aec83d5({
-    ...$64fa3d84918910a7$export$ef03459518577ad4(props),
-    inputElementType,
-    label,
-    validationBehavior
-  }, inputRef);
-  let inputOrTextAreaRef = useCallback((el) => {
-    inputRef.current = el;
-    if (el) setInputElementType(el instanceof HTMLTextAreaElement ? "textarea" : "input");
-  }, [
-    inputRef
-  ]);
-  let renderProps = $64fa3d84918910a7$export$4d86445c2cf5e3({
-    ...props,
-    values: {
-      isDisabled: props.isDisabled || false,
-      isInvalid: validation.isInvalid,
-      isReadOnly: props.isReadOnly || false,
-      isRequired: props.isRequired || false
-    },
-    defaultClassName: "react-aria-TextField"
-  });
-  let DOMProps = $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
-    global: true
-  });
-  delete DOMProps.id;
-  return /* @__PURE__ */ $dbSRa$react__default.createElement($64fa3d84918910a7$export$df3a06d6289f983e.div, {
-    ...DOMProps,
-    ...renderProps,
-    ref,
-    slot: props.slot || void 0,
-    "data-disabled": props.isDisabled || void 0,
-    "data-invalid": validation.isInvalid || void 0,
-    "data-readonly": props.isReadOnly || void 0,
-    "data-required": props.isRequired || void 0
-  }, /* @__PURE__ */ $dbSRa$react__default.createElement($64fa3d84918910a7$export$2881499e37b75b9a, {
-    values: [
-      [
-        $01b77f81d0f07f68$export$75b6ee27786ba447,
-        {
-          ...labelProps,
-          ref: labelRef
-        }
-      ],
-      [
-        $3985021b0ad6602f$export$37fb8590cf2c088c,
-        {
-          ...inputProps,
-          ref: inputOrTextAreaRef
-        }
-      ],
-      [
-        $216918bed6669f72$export$2dc6166a7e65358c,
-        {
-          ...inputProps,
-          ref: inputOrTextAreaRef
-        }
-      ],
-      [
-        $a049562f99e7db0e$export$f9c6924e160136d1,
-        {
-          role: "presentation",
-          isInvalid: validation.isInvalid,
-          isDisabled: props.isDisabled || false
-        }
-      ],
-      [
-        $514c0188e459b4c0$export$9afb8bc826b033ea,
-        {
-          slots: {
-            description: descriptionProps,
-            errorMessage: errorMessageProps
-          }
-        }
-      ],
-      [
-        $ee014567cb39d3f0$export$ff05c3ac10437e03,
-        validation
-      ]
-    ]
-  }, renderProps.children));
-});
-/**
- * An input field.
- *
- * @component
- * @param {Object} props - Component props.
- * @param {JSX.Element} [props.icon] - Icon to display in the label.
- * @param {string} [props.label] - Label to display.
- * @param {string} [props.subtitle] - Subtitle to display.
- * @param {string} [props.help] - Help text to display below the input.
- * @param {JSX.Element|JSX.Element[]} [props.actions] - Actions to display to the right of the label.
- * @param {boolean} [props.inline] - Whether the element menu is displayed inline with the label, to the right of it.
- * @param {string} [props.value] - The current value of the input.
- * @param {Function} [props.onChange] - Function to run when the input value changes.
- * @param {InputType} [props.type='text'] - The input type. Renders a `<textarea>` instead of `<input>` if set to 'multiline'.
- * @param {boolean} [props.disabled] - If `true`, the input is disabled.
- * @param {boolean} [props.readOnly] - If `true`, the input is read-only.
- * @param {string} [props.className] - Classes to pass to the input field.
- * @param {string} [props.wrapperClassName] - Classes to pass to the input field wrapping element.
- * @param {boolean} [props.monospaceFont] - If `true`, the input uses a monospace font. Useful for things like IDs to make them easier to read.
- * @param {boolean} [props.flat] - If `true`, component will look more flat. Useful for nested layer of controls.
- * @param {InputSize} [props.size='default'] - Sets the size of the input field.
- * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
- *
- * @returns {JSX.Element} The InputField component.
- *
- * @typedef {'text' | 'search' | 'url' | 'tel' | 'email' | 'password' | 'multiline'} InputType
- * @typedef {'small' | 'medium' | 'default' | 'large'} InputSize
- *
- * @example
- * <InputField
- * 	label='My input'
- * 	value={inputValue}
- * 	onChange={setInputValue}
- * />
- *
- * @preserve
- */
-const InputField = (props) => {
-  const {
-    icon,
-    label,
-    subtitle,
-    help,
-    actions,
-    inline,
-    value,
-    onChange,
-    type = "text",
-    disabled,
-    readOnly,
-    className,
-    flat,
-    size,
-    wrapperClassName,
-    hidden,
-    monospaceFont,
-    ...other
-  } = props;
-  if (hidden) {
-    return null;
-  }
-  const inputClass = cva(
-    [
-      "es:leading-none",
-      "es:border-none!",
-      "es:w-fill",
-      "es:rounded-lg! es:focus:rounded-xl!",
-      "es:transition-plus",
-      "es:any-focus:outline-hidden",
-      "es:inset-ring",
-      "es:focus-visible:ring-2 es:focus-visible:ring-accent-500/30",
-      "es:focus-visible:text-accent-950 es:focus-visible:inset-ring-accent-500",
-      "es:focus:placeholder:text-surface-400",
-      className
-    ],
-    {
-      variants: {
-        size: {
-          small: ["es:min-h-8", "es:px-2.5"],
-          medium: ["es:min-h-9", "es:px-3"],
-          default: ["es:min-h-10", "es:px-3"],
-          large: ["es:min-h-12", "es:px-4"]
-        },
-        mono: {
-          true: "es:font-mono es:text-12!",
-          false: 'es:text-13! es:font-variation-["wdth"_80,"wght"_325,"slnt"_0,"ROND"_100] es:placeholder-shown:font-variation-["wdth"_64,"wght"_300,"slnt"_-10,"ROND"_0]'
-        },
-        multiline: {
-          false: "es:py-2",
-          true: "es:py-3 es:rounded-br-sm!"
-        },
-        disabled: {
-          false: "es:selection:bg-surface-100 es:selection:text-accent-800",
-          true: "es:selection:bg-secondary-200 es:selection:text-secondary-600"
-        }
-      },
-      compoundVariants: [
-        {
-          flat: false,
-          disabled: false,
-          readOnly: false,
-          class: [
-            "es:bg-white",
-            "es:bg-linear-to-b es:from-secondary-100/0 es:to-secondary-100/50 es:from-25%",
-            "es:hover:from-surface-100/0 es:hover:to-surface-100/50",
-            "es:inset-ring-secondary-400/50 es:hover:inset-ring-surface-300 es:focus:inset-ring-surface-400",
-            "es:inset-shadow-sm es:inset-shadow-secondary-100/50",
-            "es:hover:placeholder:text-surface-400",
-            "es:placeholder:text-secondary-400",
-            "es:shadow-xs es:shadow-black/5"
-          ]
-        },
-        {
-          flat: true,
-          disabled: false,
-          readOnly: false,
-          class: [
-            "es:inset-ring-secondary-100",
-            "es:focus:text-accent-950",
-            "es:placeholder:text-secondary-500/80",
-            "es:bg-secondary-100 es:focus:bg-surface-50",
-            "es:inset-ring-secondary-200/15 es:hover:inset-ring-secondary-200/65 es:focus:inset-ring-surface-200",
-            "es:shadow-none"
-          ]
-        },
-        { disabled: true, class: ["es:bg-secondary-50 es:inset-ring-secondary-200 es:text-secondary-400"] },
-        { readOnly: true, flat: false, class: ["es:bg-secondary-50 es:inset-ring-secondary-300 es:text-secondary-400"] },
-        { readOnly: true, flat: true, class: ["es:bg-secondary-50 es:inset-ring-secondary-300/60 es:text-secondary-400"] }
-      ],
-      defaultVariants: { disabled: false, flat: false, mono: false, size: "default", multiline: false, readOnly: false }
-    }
-  );
-  return /* @__PURE__ */ jsx(
-    $bcdf0525bf22703d$export$2c73285ae9390cec,
-    {
-      value: value ?? "",
-      onChange,
-      isDisabled: disabled,
-      isReadOnly: readOnly,
-      className: wrapperClassName,
-      ...other,
-      children: /* @__PURE__ */ jsxs(
-        BaseControl,
-        {
-          icon,
-          label,
-          subtitle,
-          actions,
-          inline,
-          labelAs: $01b77f81d0f07f68$export$b04be29aa201d4f5,
-          help,
-          children: [
-            type !== "multiline" && /* @__PURE__ */ jsx(
-              $3985021b0ad6602f$export$f5b8910cec6cf069,
-              {
-                ...other,
-                type,
-                className: inputClass({ disabled, flat, size, readOnly, mono: monospaceFont || type === "password" }),
-                onKeyUp: (e) => {
-                  if (type === "search" && e.key === "Escape") {
-                    onChange("");
-                  }
-                  if (props.onKeyUp) {
-                    props.onKeyUp(e);
-                  }
-                }
-              }
-            ),
-            type === "multiline" && /* @__PURE__ */ jsx(
-              $216918bed6669f72$export$f5c9f3c2c4054eec,
-              {
-                ...other,
-                className: inputClass({ disabled, flat, size, readOnly, mono: monospaceFont, multiline: true })
-              }
-            )
-          ]
-        }
-      )
-    }
-  );
-};
-export {
-  InputField
-};
+import { t as InputField } from "../../input-field-UCZL5bqv.js";
+export { InputField };

package/dist/components/item-collection/item-collection.js

@@ -1,59 +1,53 @@
-import { jsx } from "react/jsx-runtime";
+import { t as __ } from "../../build-module-sxK3nxOK.js";
 import { Fragment } from "react";
-import { _ as __ } from "../../default-i18n-CnQeC5Pl.js";
+import { jsx } from "react/jsx-runtime";
+//#region lib/components/item-collection/item-collection.jsx
 /**
- * A simple component to manage a collection of items.
- *
- * @component
- * @param {Object} props - Component props.
- * @param {Object<string, any>[]} props.items - Items to show.
- * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
- *
- * @returns {JSX.Element} The ItemCollection component.
- *
- * @example
- * <ItemCollection
- *    items={items}
- *    onChange={setItems}
- * >
- *    {({ title, updateData, deleteItem }) => (
- *       <div>
- *          <InputField
- *             label={__('Title', 'demo')}
- *             value={title}
- *             onChange={(title) => updateData({ title })}
- *          />
- *       </div>
- *    )}
- * </ItemCollection>
- *
- * @preserve
- */
-const ItemCollection = (props) => {
-  const { children, items: rawItems, onChange, hidden } = props;
-  if (hidden) {
-    return null;
-  }
-  if (typeof rawItems === "undefined" || rawItems === null || !Array.isArray(rawItems)) {
-    console.warn(__("ItemCollection: 'items' are not an array or are undefined!", "eightshift-ui-components"));
-  }
-  const items = rawItems ?? [];
-  return items.map((item, index) => /* @__PURE__ */ jsx(Fragment, { children: children({
-    ...item,
-    updateData: (newValue) => {
-      const updated = [...items];
-      updated[index] = {
-        ...updated[index],
-        ...newValue
-      };
-      onChange(updated);
-    },
-    itemIndex: index,
-    deleteItem: () => {
-      onChange([...items].filter((_, i) => i !== index));
-    }
-  }) }, index));
-};
-export {
-  ItemCollection
+* A simple component to manage a collection of items.
+*
+* @component
+* @param {Object} props - Component props.
+* @param {Object<string, any>[]} props.items - Items to show.
+* @param {boolean} [props.hidden] - If `true`, the component is not rendered.
+*
+* @returns {JSX.Element} The ItemCollection component.
+*
+* @example
+* <ItemCollection
+*    items={items}
+*    onChange={setItems}
+* >
+*    {({ title, updateData, deleteItem }) => (
+*       <div>
+*          <InputField
+*             label={__('Title', 'demo')}
+*             value={title}
+*             onChange={(title) => updateData({ title })}
+*          />
+*       </div>
+*    )}
+* </ItemCollection>
+*/
+var ItemCollection = (props) => {
+	const { children, items: rawItems, onChange, hidden } = props;
+	if (hidden) return null;
+	if (typeof rawItems === "undefined" || rawItems === null || !Array.isArray(rawItems)) console.warn(__("ItemCollection: 'items' are not an array or are undefined!", "eightshift-ui-components"));
+	const items = rawItems ?? [];
+	return items.map((item, index) => jsx(Fragment, { children: children({
+		...item,
+		updateData: (newValue) => {
+			const updated = [...items];
+			updated[index] = {
+				...updated[index],
+				...newValue
+			};
+			onChange(updated);
+		},
+		itemIndex: index,
+		deleteItem: () => {
+			onChange([...items].filter((_, i) => i !== index));
+		}
+	}) }, index));
 };
+//#endregion
+export { ItemCollection };

package/dist/components/layout/hstack.js

@@ -1,32 +1,30 @@
+import { t as clsx } from "../../clsx-BUU5J41u.js";
 import { jsx } from "react/jsx-runtime";
-import { c as clsx } from "../../clsx-DgYk2OaC.js";
+//#region lib/components/layout/hstack.jsx
 /**
- * Allows for stacking elements horizontally, with a gap between them.
- *
- * @component
- * @param {Object} props - Component props.
- * @param {JSX.Element} [props.as] - Element to render the component as. Defaults to `div`.
- * @param {boolean} [props.noWrap] - If `true`, the children will not wrap if their size exceeds the container size.
- * @param {string} [props.className] - Classes to pass to the component.
- * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
- *
- * @returns {JSX.Element} The HStack component.
- *
- * @example
- * <HStack>
- * 	...
- * </HStack>
- *
- * @preserve
- */
-const HStack = (props) => {
-  const { children, noWrap, className, hidden, as } = props;
-  if (hidden) {
-    return null;
-  }
-  const ComponentToRender = as ?? "div";
-  return /* @__PURE__ */ jsx(ComponentToRender, { className: clsx("es:flex es:items-center es:gap-x-1.5 es:gap-y-2", !noWrap && "es:flex-wrap", className), children });
-};
-export {
-  HStack
+* Allows for stacking elements horizontally, with a gap between them.
+*
+* @component
+* @param {Object} props - Component props.
+* @param {JSX.Element} [props.as] - Element to render the component as. Defaults to `div`.
+* @param {boolean} [props.noWrap] - If `true`, the children will not wrap if their size exceeds the container size.
+* @param {string} [props.className] - Classes to pass to the component.
+* @param {boolean} [props.hidden] - If `true`, the component is not rendered.
+*
+* @returns {JSX.Element} The HStack component.
+*
+* @example
+* <HStack>
+* 	...
+* </HStack>
+*/
+var HStack = (props) => {
+	const { children, noWrap, className, hidden, as } = props;
+	if (hidden) return null;
+	return jsx(as ?? "div", {
+		className: clsx("es:flex es:items-center es:gap-x-1.5 es:gap-y-2", !noWrap && "es:flex-wrap", className),
+		children
+	});
 };
+//#endregion
+export { HStack };