@ultraviolet/ui 1.28.0 → 1.29.0

package/dist/src/components/TextInput/index.js

@@ -39,14 +39,11 @@ const inputSizes = {
 };
 const StyledSeparator = /*#__PURE__*/_styled(Separator, {
   target: "el3h3g98"
-})("margin:1px 0px;height:calc(100% - 2px);background-color:", _ref3 => {
-  let {
-    theme: {
-      colors
-    }
-  } = _ref3;
-  return colors.neutral.backgroundStrong;
-}, ";");
+})("margin:1px 0px;height:calc(100% - 2px);background-color:", ({
+  theme: {
+    colors
+  }
+}) => colors.neutral.backgroundStrong, ";");
 var _ref2 = process.env.NODE_ENV === "production" ? {
   name: "176jwhy",
   styles: "pointer-events:auto;>button{box-shadow:none!important;}"
@@ -58,20 +55,14 @@ var _ref2 = process.env.NODE_ENV === "production" ? {
 const StyledRightElement = /*#__PURE__*/_styled('div', {
   shouldForwardProp: prop => !['edit', 'touchable'].includes(prop),
   target: "el3h3g97"
-})(_ref4 => {
-  let {
-    theme: {
-      colors,
-      space
-    }
-  } = _ref4;
-  return /*#__PURE__*/css("pointer-events:none;position:absolute;right:0;bottom:0;top:0;padding:0 ", space['1'], ";display:flex;gap:", space['1'], ";align-items:center;transition:transform 150ms,color 150ms;color:", colors.neutral.textWeak, ";&:hover,&:focus-within{color:", colors.neutral.textWeakHover, ";}");
-}, " ", _ref5 => {
-  let {
-    touchable
-  } = _ref5;
-  return touchable && _ref2;
-}, ";");
+})(({
+  theme: {
+    colors,
+    space
+  }
+}) => /*#__PURE__*/css("pointer-events:none;position:absolute;right:0;bottom:0;top:0;padding:0 ", space['1'], ";display:flex;gap:", space['1'], ";align-items:center;transition:transform 150ms,color 150ms;color:", colors.neutral.textWeak, ";&:hover,&:focus-within{color:", colors.neutral.textWeakHover, ";}"), " ", ({
+  touchable
+}) => touchable && _ref2, ";");
 var _ref = process.env.NODE_ENV === "production" ? {
   name: "z8qxmc",
   styles: "transform:translate(-9.6%, -3px) scale(0.8)"
@@ -83,43 +74,28 @@ var _ref = process.env.NODE_ENV === "production" ? {
 const StyledLabel = /*#__PURE__*/_styled('label', {
   shouldForwardProp: prop => !['edit', 'error', 'resizable', 'fillAvailable'].includes(prop),
   target: "el3h3g96"
-})("display:block;position:absolute;left:0;top:0;padding-left:8px;padding-right:8px;pointer-events:none;color:", _ref6 => {
-  let {
-    theme: {
-      colors
-    }
-  } = _ref6;
-  return colors.neutral.textWeak;
-}, ";white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;height:48px;font-size:16px;transition:transform 150ms;transform:translate(0, 12px) scale(1);", _ref7 => {
-  let {
-    edit
-  } = _ref7;
-  return edit && _ref;
-}, " ", _ref8 => {
-  let {
-    disabled,
-    theme: {
-      colors
-    }
-  } = _ref8;
-  return disabled && /*#__PURE__*/css("color:", colors.neutral.textDisabled, ";");
-}, " ", _ref9 => {
-  let {
-    readOnly,
-    theme: {
-      colors
-    }
-  } = _ref9;
-  return readOnly && /*#__PURE__*/css("color:", colors.neutral.textDisabled, ";");
-}, " ", _ref10 => {
-  let {
-    error,
-    theme: {
-      colors
-    }
-  } = _ref10;
-  return error && /*#__PURE__*/css("color:", colors.danger.text, ";");
-}, ";");
+})("display:block;position:absolute;left:0;top:0;padding-left:8px;padding-right:8px;pointer-events:none;color:", ({
+  theme: {
+    colors
+  }
+}) => colors.neutral.textWeak, ";white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;height:48px;font-size:16px;transition:transform 150ms;transform:translate(0, 12px) scale(1);", ({
+  edit
+}) => edit && _ref, " ", ({
+  disabled,
+  theme: {
+    colors
+  }
+}) => disabled && /*#__PURE__*/css("color:", colors.neutral.textDisabled, ";"), " ", ({
+  readOnly,
+  theme: {
+    colors
+  }
+}) => readOnly && /*#__PURE__*/css("color:", colors.neutral.textDisabled, ";"), " ", ({
+  error,
+  theme: {
+    colors
+  }
+}) => error && /*#__PURE__*/css("color:", colors.danger.text, ";"), ";");
 const StyledRelativeDiv = /*#__PURE__*/_styled("div", {
   target: "el3h3g95"
 })(process.env.NODE_ENV === "production" ? {
@@ -132,143 +108,87 @@ const StyledRelativeDiv = /*#__PURE__*/_styled("div", {
 });
 const StyledError = /*#__PURE__*/_styled("div", {
   target: "el3h3g94"
-})("font-size:12px;color:", _ref11 => {
-  let {
-    theme
-  } = _ref11;
-  return theme.colors.danger.text;
-}, ";padding-top:", _ref12 => {
-  let {
-    theme
-  } = _ref12;
-  return theme.space['0.25'];
-}, ";");
+})("font-size:12px;color:", ({
+  theme
+}) => theme.colors.danger.text, ";padding-top:", ({
+  theme
+}) => theme.space['0.25'], ";");
 const StyledNotice = /*#__PURE__*/_styled(Notice, {
   target: "el3h3g93"
-})("margin-top:", _ref13 => {
-  let {
-    theme
-  } = _ref13;
-  return theme.space['0.5'];
-}, ";");
+})("margin-top:", ({
+  theme
+}) => theme.space['0.5'], ";");
 const StyledInput = /*#__PURE__*/_styled('input', {
   shouldForwardProp: prop => !['as', 'error', 'fillAvailable', 'hasLabel', 'isPlaceholderVisible', 'multiline', 'resizable', 'inputSize', 'paddingRightFactor'].includes(prop),
   target: "el3h3g92"
-})("transition:border-color 0.2s ease,box-shadow 0.2s ease;appearance:none;background-color:", _ref14 => {
-  let {
-    theme: {
-      colors
-    }
-  } = _ref14;
-  return colors.neutral.background;
-}, ";background-image:none;border:1px solid ", _ref15 => {
-  let {
-    theme: {
-      colors
-    }
-  } = _ref15;
-  return colors.neutral.border;
-}, ";border-radius:", _ref16 => {
-  let {
-    theme: {
-      radii
-    }
-  } = _ref16;
-  return radii.default;
-}, ";color:", _ref17 => {
-  let {
-    theme: {
-      colors
-    }
-  } = _ref17;
-  return colors.neutral.text;
-}, ";display:block;max-width:100%;outline:none;position:relative;width:100%;padding-left:", _ref18 => {
-  let {
-    theme
-  } = _ref18;
-  return theme.space['1'];
-}, ";padding-right:", _ref19 => {
-  let {
-    theme
-  } = _ref19;
-  return theme.space['1'];
-}, ";padding-top:14px;font-size:16px;line-height:24px;&::placeholder{color:", _ref20 => {
-  let {
-    theme: {
-      colors
-    }
-  } = _ref20;
-  return colors.neutral.textWeak;
-}, ";opacity:0;}&:hover,&:focus{border-color:", _ref21 => {
-  let {
-    theme: {
-      colors
-    }
-  } = _ref21;
-  return colors.primary.borderHover;
-}, ";}&:focus{box-shadow:", _ref22 => {
-  let {
-    theme: {
-      shadows
-    }
-  } = _ref22;
-  return shadows.focusPrimary;
-}, ";border-color:", _ref23 => {
-  let {
-    theme: {
-      colors
-    }
-  } = _ref23;
-  return colors.primary.borderHover;
-}, ";}", _ref24 => {
-  let {
-    isPlaceholderVisible
-  } = _ref24;
-  return isPlaceholderVisible && `&::placeholder {
+})("transition:border-color 0.2s ease,box-shadow 0.2s ease;appearance:none;background-color:", ({
+  theme: {
+    colors
+  }
+}) => colors.neutral.background, ";background-image:none;border:1px solid ", ({
+  theme: {
+    colors
+  }
+}) => colors.neutral.border, ";border-radius:", ({
+  theme: {
+    radii
+  }
+}) => radii.default, ";color:", ({
+  theme: {
+    colors
+  }
+}) => colors.neutral.text, ";display:block;max-width:100%;outline:none;position:relative;width:100%;padding-left:", ({
+  theme
+}) => theme.space['1'], ";padding-right:", ({
+  theme
+}) => theme.space['1'], ";padding-top:14px;font-size:16px;line-height:24px;&::placeholder{color:", ({
+  theme: {
+    colors
+  }
+}) => colors.neutral.textWeak, ";opacity:0;}&:hover,&:focus{border-color:", ({
+  theme: {
+    colors
+  }
+}) => colors.primary.borderHover, ";}&:focus{box-shadow:", ({
+  theme: {
+    shadows
+  }
+}) => shadows.focusPrimary, ";border-color:", ({
+  theme: {
+    colors
+  }
+}) => colors.primary.borderHover, ";}", ({
+  isPlaceholderVisible
+}) => isPlaceholderVisible && `&::placeholder {
       opacity: 1;
-    }`;
-}, " ", _ref25 => {
-  let {
-    disabled,
-    theme: {
-      colors
-    }
-  } = _ref25;
-  return disabled && `cursor: default;
+    }`, " ", ({
+  disabled,
+  theme: {
+    colors
+  }
+}) => disabled && `cursor: default;
     pointer-events: none;
     background-color: ${colors.neutral.backgroundDisabled};
     border-color: ${colors.neutral.borderDisabled};
-    color: ${colors.neutral.textDisabled};`;
-}, " ", _ref26 => {
-  let {
-    readOnly,
-    theme: {
-      colors
-    }
-  } = _ref26;
-  return readOnly && `background-color: ${colors.neutral.backgroundDisabled};
+    color: ${colors.neutral.textDisabled};`, " ", ({
+  readOnly,
+  theme: {
+    colors
+  }
+}) => readOnly && `background-color: ${colors.neutral.backgroundDisabled};
     border-color: ${colors.neutral.borderDisabled};
-    color: ${colors.neutral.text};`;
-}, " ", _ref27 => {
-  let {
-    inputSize
-  } = _ref27;
-  return inputSizes[inputSize]?.default;
-}, " ", _ref28 => {
-  let {
-    inputSize,
-    hasLabel
-  } = _ref28;
-  return !!inputSize && !hasLabel && inputSizes[inputSize]?.full;
-}, " ", _ref29 => {
-  let {
-    error,
-    theme: {
-      colors,
-      shadows
-    }
-  } = _ref29;
-  return error && `border-color: ${colors.danger.border};
+    color: ${colors.neutral.text};`, " ", ({
+  inputSize
+}) => inputSizes[inputSize]?.default, " ", ({
+  inputSize,
+  hasLabel
+}) => !!inputSize && !hasLabel && inputSizes[inputSize]?.full, " ", ({
+  error,
+  theme: {
+    colors,
+    shadows
+  }
+}) => error && `border-color: ${colors.danger.border};
 
     &:hover,
     &:focus {
@@ -278,36 +198,26 @@ const StyledInput = /*#__PURE__*/_styled('input', {
     &:focus {
       box-shadow: ${shadows.focusDanger};
       border-color: ${colors.danger.borderHover};
-    }`;
-}, " ", _ref30 => {
-  let {
-    multiline,
-    resizable,
-    fillAvailable
-  } = _ref30;
-  return multiline && `
+    }`, " ", ({
+  multiline,
+  resizable,
+  fillAvailable
+}) => multiline && `
     padding-top: 20px;
     height: ${fillAvailable ? '100%' : 'initial'};
     resize: ${resizable === false ? 'none' : 'vertical'};
-  `;
-}, " ", _ref31 => {
-  let {
-    multiline,
-    hasLabel,
-    theme
-  } = _ref31;
-  return multiline && !hasLabel && `
+  `, " ", ({
+  multiline,
+  hasLabel,
+  theme
+}) => multiline && !hasLabel && `
     padding-top: ${theme.space['1']};
-  `;
-}, " ", _ref32 => {
-  let {
-    paddingRightFactor,
-    theme
-  } = _ref32;
-  return paddingRightFactor > 0 && `
+  `, " ", ({
+  paddingRightFactor,
+  theme
+}) => paddingRightFactor > 0 && `
     padding-right: calc(${paddingRightFactor} * ${theme.space['4']});
-  `;
-}, ";");
+  `, ";");
 const RightComponent = /*#__PURE__*/_styled(Stack, {
   target: "el3h3g91"
 })(process.env.NODE_ENV === "production" ? {
@@ -320,60 +230,56 @@ const RightComponent = /*#__PURE__*/_styled(Stack, {
 });
 const UnitLabel = /*#__PURE__*/_styled(Text, {
   target: "el3h3g90"
-})("padding:", _ref33 => {
-  let {
-    theme
-  } = _ref33;
-  return theme.space['1'];
-}, " 0;line-height:18px;");
+})("padding:", ({
+  theme
+}) => theme.space['1'], " 0;line-height:18px;");
 
 /**
  * TextInput component allows users to input text, with options for customization and validation.
  * It supports various input types and should be appropriately sized with clear labeling.
  */
-const TextInput = /*#__PURE__*/forwardRef((_ref34, ref) => {
-  let {
-    'data-testid': dataTestId,
-    ariaControls,
-    autoComplete = 'on',
-    autoFocus,
-    className,
-    cols,
-    defaultValue,
-    disabled,
-    edit: forceEdit,
-    error,
-    fillAvailable,
-    generated,
-    height,
-    id,
-    label,
-    multiline,
-    name,
-    notice,
-    noTopLabel = false,
-    onBlur,
-    onChange,
-    onFocus,
-    onKeyUp,
-    onKeyDown,
-    placeholder,
-    random,
-    readOnly,
-    required,
-    resizable,
-    rows,
-    size = 'medium',
-    tabIndex,
-    type = 'text',
-    unit,
-    valid,
-    value,
-    wrap,
-    inputProps,
-    min,
-    max
-  } = _ref34;
+const TextInput = /*#__PURE__*/forwardRef(({
+  'data-testid': dataTestId,
+  ariaControls,
+  autoComplete = 'on',
+  autoFocus,
+  className,
+  cols,
+  defaultValue,
+  disabled,
+  edit: forceEdit,
+  error,
+  fillAvailable,
+  generated,
+  height,
+  id,
+  label,
+  multiline,
+  name,
+  notice,
+  noTopLabel = false,
+  onBlur,
+  onChange,
+  onFocus,
+  onKeyUp,
+  onKeyDown,
+  placeholder,
+  random,
+  readOnly,
+  required,
+  resizable,
+  rows,
+  size = 'medium',
+  tabIndex,
+  type = 'text',
+  unit,
+  valid,
+  value,
+  wrap,
+  inputProps,
+  min,
+  max
+}, ref) => {
   const controlRef = useRef(null);
   const [visited, setVisited] = useState(false);
   const [passwordVisible, setPasswordVisible] = useState(false);

package/dist/src/components/TimeInput/index.js

@@ -22,19 +22,16 @@ const defaultValue = {
  * `SelectInput` component.
  * @experimental This component is experimental and may be subject to breaking changes in the future.
  */
-const TimeInput = function (_temp) {
-  let {
-    value = defaultValue,
-    schedule = 'hours',
-    ...props
-  } = _temp === void 0 ? {} : _temp;
-  return jsx(SelectInput, {
-    ...props,
-    time: true,
-    value: value,
-    options: options(schedule)
-  });
-};
+const TimeInput = ({
+  value = defaultValue,
+  schedule = 'hours',
+  ...props
+} = {}) => jsx(SelectInput, {
+  ...props,
+  time: true,
+  value: value,
+  options: options(schedule)
+});
 TimeInput.options = options;
 
 export { TimeInput, schedules };

package/dist/src/components/Toaster/index.js

@@ -21,52 +21,40 @@ const styles = {
 };
 const CloseButtonWrapper = /*#__PURE__*/_styled("button", {
   target: "e1eb63991"
-})("background:none;border:none;cursor:pointer;color:inherit;padding:0;margin:0;margin-bottom:", _ref => {
-  let {
-    theme
-  } = _ref;
-  return theme.space['2'];
-}, ";");
+})("background:none;border:none;cursor:pointer;color:inherit;padding:0;margin:0;margin-bottom:", ({
+  theme
+}) => theme.space['2'], ";");
 const IconWithLeftMargin = /*#__PURE__*/_styled(Icon, {
   target: "e1eb63990"
-})("margin-left:", _ref2 => {
-  let {
-    theme
-  } = _ref2;
-  return theme.space['1'];
-}, ";");
-const CloseButton = _ref3 => {
-  let {
-    closeToast
-  } = _ref3;
-  return jsx(CloseButtonWrapper, {
-    type: "button",
-    onClick: closeToast,
-    children: jsx(IconWithLeftMargin, {
-      name: "close",
-      size: 18
-    })
-  });
-};
-const Content = _ref4 => {
-  let {
-    sentiment,
-    children
-  } = _ref4;
-  return jsxs(Stack, {
-    gap: 2,
-    direction: "row",
-    children: [jsx(Icon, {
-      name: TOAST_ICONS[sentiment],
-      size: 24
-    }), jsx(Text, {
-      variant: "body",
-      as: "span",
-      sentiment: sentiment,
-      children: children
-    })]
-  });
-};
+})("margin-left:", ({
+  theme
+}) => theme.space['1'], ";");
+const CloseButton = ({
+  closeToast
+}) => jsx(CloseButtonWrapper, {
+  type: "button",
+  onClick: closeToast,
+  children: jsx(IconWithLeftMargin, {
+    name: "close",
+    size: 18
+  })
+});
+const Content = ({
+  sentiment,
+  children
+}) => jsxs(Stack, {
+  gap: 2,
+  direction: "row",
+  children: [jsx(Icon, {
+    name: TOAST_ICONS[sentiment],
+    size: 24
+  }), jsx(Text, {
+    variant: "body",
+    as: "span",
+    sentiment: sentiment,
+    children: children
+  })]
+});
 const toast = {
   error: (children, options) => toast$1.error(jsx(Content, {
     sentiment: "danger",
@@ -89,34 +77,30 @@ const toast = {
  * Toaster is separated in two parts, first the `ToastContainer` which is where the div of the toast will be rendered,
  * and second the `toast()` function which is used to display the toast.
  */
-const ToastContainer = _ref5 => {
-  let {
-    newestOnTop,
-    limit,
-    position,
-    'data-testid': dataTestId
-  } = _ref5;
+const ToastContainer = ({
+  newestOnTop,
+  limit,
+  position,
+  'data-testid': dataTestId
+}) => {
   const theme = useTheme();
   return jsxs(Fragment, {
     children: [jsx(Global, {
       styles: css_248z
     }), jsx(ClassNames, {
-      children: _ref6 => {
-        let {
-          css: localCss
-        } = _ref6;
-        return jsx(ToastContainer$1, {
-          "data-testid": dataTestId,
-          closeButton: jsx(CloseButton, {}),
-          toastClassName: localCss(styles.toast(theme)),
-          autoClose: AUTOCLOSE_DELAY,
-          icon: false,
-          newestOnTop: newestOnTop,
-          limit: limit,
-          position: position,
-          css: /*#__PURE__*/css("top:100px;right:calc(0% + ", theme.space['2'], ");")
-        });
-      }
+      children: ({
+        css: localCss
+      }) => jsx(ToastContainer$1, {
+        "data-testid": dataTestId,
+        closeButton: jsx(CloseButton, {}),
+        toastClassName: localCss(styles.toast(theme)),
+        autoClose: AUTOCLOSE_DELAY,
+        icon: false,
+        newestOnTop: newestOnTop,
+        limit: limit,
+        position: position,
+        css: /*#__PURE__*/css("top:100px;right:calc(0% + ", theme.space['2'], ");")
+      })
     })]
   });
 };