@ultraviolet/ui 3.0.0-beta.25 → 3.0.0-beta.27

package/dist/components/Tag/index.cjs

@@ -1,63 +0,0 @@
-"use client";
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
-const Icon = require("@ultraviolet/icons");
-const react = require("react");
-const useClipboard = require("react-use-clipboard");
-const index$2 = require("../Button/index.cjs");
-const index$3 = require("../Loader/index.cjs");
-const index$1 = require("../Text/index.cjs");
-const index = require("../Tooltip/index.cjs");
-const styles_css = require("./styles.css.cjs");
-const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
-const useClipboard__default = /* @__PURE__ */ _interopDefaultCompat(useClipboard);
-const COPY_DURATION = 2500;
-const TagInner = ({
-  children,
-  isLoading = false,
-  onClose,
-  disabled = false
-}) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-  /* @__PURE__ */ jsxRuntime.jsx(index$1.Text, { "aria-disabled": disabled, as: "span", className: styles_css.textTag, oneLine: true, variant: "caption", children }),
-  onClose && !isLoading ? /* @__PURE__ */ jsxRuntime.jsx(index$2.Button, { "aria-label": "Close tag", className: styles_css.closeButtonTag, "data-testid": "close-tag", disabled, onClick: onClose, sentiment: "neutral", size: "small", variant: "ghost", children: /* @__PURE__ */ jsxRuntime.jsx(Icon.CloseIcon, { size: "small" }) }) : null,
-  isLoading ? /* @__PURE__ */ jsxRuntime.jsx(index$3.Loader, { active: true, size: "small" }) : null
-] });
-const Tag = ({
-  children,
-  isLoading,
-  onClose,
-  copiable = false,
-  copyText = "Copy",
-  copiedText = "Copied!",
-  disabled,
-  sentiment = "neutral",
-  className,
-  style,
-  "data-testid": dataTestId
-}) => {
-  const stringChildren = react.useMemo(() => {
-    if (typeof children === "string") {
-      return children;
-    }
-    if (Array.isArray(children)) {
-      return children.filter((child) => typeof child === "string").join("");
-    }
-    return "";
-  }, [children]);
-  const [isCopied, setCopied] = useClipboard__default.default(stringChildren, {
-    successDuration: COPY_DURATION
-  });
-  if (copiable && !disabled) {
-    return /* @__PURE__ */ jsxRuntime.jsx(index.Tooltip, { text: isCopied ? copiedText : copyText, children: /* @__PURE__ */ jsxRuntime.jsx("button", { className: `${className ? `${className} ` : ""}${styles_css.containerTag({
-      copiable,
-      disabled,
-      sentiment
-    })}`, "data-testid": dataTestId, disabled, onClick: setCopied, children: /* @__PURE__ */ jsxRuntime.jsx(TagInner, { disabled, isLoading, onClose, children }) }) });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${className ? `${className} ` : ""}${styles_css.containerTag({
-    disabled,
-    sentiment
-  })}`, "data-testid": dataTestId, style, children: /* @__PURE__ */ jsxRuntime.jsx(TagInner, { disabled, isLoading, onClose, children }) });
-};
-exports.Tag = Tag;

package/dist/components/Tag/styles.css.cjs

@@ -1,10 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-;/* empty css                            */
-const createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var containerTag = createRuntimeFn.createRuntimeFn({ defaultClassName: "uv_d6zknp0", variantClassNames: { copiable: { true: "uv_d6zknp1" }, sentiment: { danger: "uv_d6zknp2", info: "uv_d6zknp3", neutral: "uv_d6zknp4", primary: "uv_d6zknp5", secondary: "uv_d6zknp6", success: "uv_d6zknp7", warning: "uv_d6zknp8" }, disabled: { true: "uv_d6zknp9" } }, defaultVariants: { copiable: false, disabled: false, sentiment: "neutral" }, compoundVariants: [] });
-var textTag = "uv_d6zknpa";
-var closeButtonTag = "uv_d6zknpb";
-exports.closeButtonTag = closeButtonTag;
-exports.containerTag = containerTag;
-exports.textTag = textTag;

package/dist/components/TagInput/index.cjs

@@ -1,163 +0,0 @@
-"use client";
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
-const Icon = require("@ultraviolet/icons");
-const react = require("react");
-const index$4 = require("../Button/index.cjs");
-const index$1 = require("../Label/index.cjs");
-const index = require("../Stack/index.cjs");
-const index$3 = require("../Tag/index.cjs");
-const index$5 = require("../Text/index.cjs");
-const index$2 = require("../Tooltip/index.cjs");
-const styles_css = require("./styles.css.cjs");
-const ids = require("../../utils/ids.cjs");
-const STATUS = {
-  IDLE: "idle",
-  LOADING: "loading"
-};
-const convertTagArrayToTagStateArray = (tags) => (tags ?? [])?.map((tag, index2) => typeof tag === "object" ? {
-  ...tag,
-  index: ids.getUUID(`tag-${index2}`)
-} : {
-  index: ids.getUUID(`tag-${index2}`),
-  label: tag
-});
-const TagInput = ({
-  disabled = false,
-  id,
-  name,
-  onChange,
-  placeholder,
-  value,
-  className,
-  "data-testid": dataTestId,
-  "aria-label": ariaLabel,
-  label,
-  labelDescription,
-  required = false,
-  size = "large",
-  error,
-  success,
-  helper,
-  readOnly = false,
-  tooltip,
-  clearable = false,
-  style
-}) => {
-  const [tagInputState, setTagInput] = react.useState(convertTagArrayToTagStateArray(value));
-  const [input, setInput] = react.useState("");
-  const [status, setStatus] = react.useState({});
-  const uniqueId = react.useId();
-  const localId = id ?? uniqueId;
-  react.useEffect(() => {
-    setTagInput(convertTagArrayToTagStateArray(value));
-  }, [value, setTagInput]);
-  const inputRef = react.useRef(null);
-  const dispatchOnChange = (newState) => {
-    const changes = newState.map((tag) => typeof tag === "object" ? tag?.label : tag);
-    onChange?.(changes);
-  };
-  const handleContainerClick = () => {
-    if (inputRef.current) {
-      inputRef?.current?.focus();
-    }
-  };
-  const onInputChange = (e) => {
-    setInput(e.target.value);
-  };
-  const addTag = () => {
-    const newTagInput = input ? [...tagInputState, {
-      index: ids.getUUID("tag"),
-      label: input
-    }] : tagInputState;
-    setInput("");
-    setTagInput(newTagInput);
-    if (newTagInput.length !== tagInputState.length && newTagInput) {
-      setStatus({
-        [newTagInput[newTagInput.length - 1].index]: STATUS.LOADING
-      });
-    }
-    try {
-      dispatchOnChange(newTagInput);
-      if (newTagInput) {
-        setStatus({
-          [newTagInput[newTagInput.length - 1].index]: STATUS.IDLE
-        });
-      }
-    } catch {
-      setTagInput(tagInputState);
-    }
-  };
-  const deleteTag = (tagIndex) => {
-    setStatus({
-      [tagIndex]: STATUS.LOADING
-    });
-    const findIndex = tagInputState.findIndex(({
-      index: index2
-    }) => index2 === tagIndex);
-    const newTagInput = [...tagInputState];
-    newTagInput.splice(findIndex, 1);
-    try {
-      dispatchOnChange(newTagInput);
-      setTagInput(newTagInput);
-      setStatus({
-        [tagIndex]: STATUS.IDLE
-      });
-    } catch {
-      setTagInput(tagInputState);
-    }
-  };
-  const handleInputKeydown = (event) => {
-    if (event.key === " " || event.key === "Enter") {
-      addTag();
-      event.preventDefault();
-    }
-    if (event.key === "Backspace" && inputRef?.current?.selectionStart === 0 && tagInputState.length > 0) {
-      event.preventDefault();
-      if (tagInputState) {
-        deleteTag(tagInputState[tagInputState.length - 1].index);
-      }
-    }
-  };
-  const clearAll = () => {
-    setInput("");
-    setTagInput([]);
-    dispatchOnChange([]);
-  };
-  const helperSentiment = react.useMemo(() => {
-    if (error) {
-      return "danger";
-    }
-    if (success) {
-      return "success";
-    }
-    return "neutral";
-  }, [error, success]);
-  const computedClearable = clearable && tagInputState.length > 0;
-  return /* @__PURE__ */ jsxRuntime.jsxs(index.Stack, { className, gap: "0.5", children: [
-    label || labelDescription ? /* @__PURE__ */ jsxRuntime.jsx(index$1.Label, { htmlFor: id ?? localId, labelDescription, required, size, children: label }) : null,
-    /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(index$2.Tooltip, { text: tooltip, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${className ? `${className} ` : ""}${styles_css.tagInputContainer({
-      size
-    })}`, "data-disabled": disabled, "data-error": !!error, "data-readonly": readOnly, "data-success": !!success, "data-testid": dataTestId, onClick: handleContainerClick, onKeyDown: (event) => {
-      if ([" ", "Enter"].includes(event.key)) {
-        handleContainerClick();
-      }
-    }, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles_css.tagInputDataContainer, children: [
-        tagInputState.map((tag) => /* @__PURE__ */ jsxRuntime.jsx(index$3.Tag, { disabled, isLoading: status[tag.index] === STATUS.LOADING, onClose: !readOnly ? (e) => {
-          e.stopPropagation();
-          deleteTag(tag.index);
-        } : void 0, sentiment: "neutral", children: tag.label }, tag.index)),
-        !disabled ? /* @__PURE__ */ jsxRuntime.jsx("input", { "aria-label": ariaLabel, className: styles_css.tagInput, "data-size": size, id: localId, name, onBlur: addTag, onChange: onInputChange, onKeyDown: handleInputKeydown, placeholder: tagInputState.length === 0 ? placeholder : "", readOnly, ref: inputRef, style, type: "text", value: input }) : null
-      ] }),
-      computedClearable || success || error ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles_css.tagInputStateContainer, children: [
-        computedClearable ? /* @__PURE__ */ jsxRuntime.jsx(index$4.Button, { "aria-label": "clear value", disabled, onClick: clearAll, sentiment: "neutral", size: "xsmall", variant: "ghost", children: /* @__PURE__ */ jsxRuntime.jsx(Icon.CloseIcon, {}) }) : null,
-        success ? /* @__PURE__ */ jsxRuntime.jsx(Icon.CheckCircleOutlineIcon, { disabled, sentiment: "success", size: "small" }) : null,
-        error ? /* @__PURE__ */ jsxRuntime.jsx(Icon.AlertCircleIcon, { disabled, sentiment: "danger", size: "small" }) : null
-      ] }) : null
-    ] }) }) }),
-    error || typeof success === "string" || helper ? /* @__PURE__ */ jsxRuntime.jsx(index$5.Text, { as: "span", disabled: disabled || readOnly, prominence: !error && !success ? "weak" : void 0, sentiment: helperSentiment, variant: "caption", children: error || success || helper }) : null
-  ] });
-};
-exports.TagInput = TagInput;

package/dist/components/TagInput/styles.css.cjs

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-;/* empty css                            */
-const createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var tagInputContainer = createRuntimeFn.createRuntimeFn({ defaultClassName: "uv_sjgcm20", variantClassNames: { size: { large: "uv_sjgcm21", small: "uv_sjgcm22", medium: "uv_sjgcm23" } }, defaultVariants: { size: "large" }, compoundVariants: [] });
-var tagInputDataContainer = "uv_sjgcm24";
-var tagInputStateContainer = "uv_sjgcm25";
-var tagInput = "uv_sjgcm26";
-exports.tagInput = tagInput;
-exports.tagInputContainer = tagInputContainer;
-exports.tagInputDataContainer = tagInputDataContainer;
-exports.tagInputStateContainer = tagInputStateContainer;

package/dist/components/TagList/constant.cjs

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const themes = require("@ultraviolet/themes");
-const TAGS_GAP = themes.consoleLightTheme.space["1"];
-exports.TAGS_GAP = TAGS_GAP;

package/dist/components/TagList/index.cjs

@@ -1,163 +0,0 @@
-"use client";
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
-const dynamic = require("@vanilla-extract/dynamic");
-const react = require("react");
-const index = require("../Popover/index.cjs");
-const index$1 = require("../Tag/index.cjs");
-const constant = require("./constant.cjs");
-const styles_css = require("./styles.css.cjs");
-const DEFAULT_POPOVER_MAX_HEIGHT = "16rem";
-const DEFAULT_TAGS = [];
-const getTagLabel = (tag) => typeof tag === "object" ? tag.label : tag;
-const TagList = ({
-  maxLength = 600,
-  tags = DEFAULT_TAGS,
-  threshold = 1,
-  multiline = false,
-  popoverTitle,
-  popoverPlacement,
-  popoverMaxHeight = DEFAULT_POPOVER_MAX_HEIGHT,
-  copiable,
-  copyText,
-  copiedText,
-  className,
-  "data-testid": dataTestId,
-  style
-}) => {
-  const containerRef = react.useRef(null);
-  const measureRef = react.useRef(null);
-  const popoverTriggerRef = react.useRef(null);
-  const [isReady, setIsReady] = react.useState(false);
-  const [isPopoverVisible, setIsPopoverVisible] = react.useState(false);
-  const [popoverTriggerWidth, setPopoverTriggerWidth] = react.useState(0);
-  const [visibleTags, setVisibleTags] = react.useState([]);
-  const [hiddenTags, setHiddenTags] = react.useState([]);
-  const memoizedResult = react.useMemo(() => {
-    let tmpThreshold2 = threshold;
-    while (tmpThreshold2 > 1 && tags.length > 0 && tags.slice(0, tmpThreshold2).reduce((acc, tag) => acc + getTagLabel(tag), "").length > maxLength) {
-      tmpThreshold2 -= 1;
-    }
-    const potentiallyVisibleTagsLength = Math.max(1, tags.length > tmpThreshold2 || false ? tmpThreshold2 : tags.length);
-    const potentiallyVisibleTags2 = tags.slice(0, potentiallyVisibleTagsLength);
-    const surelyHiddenTags2 = tags.slice(potentiallyVisibleTagsLength);
-    return {
-      potentiallyVisibleTags: potentiallyVisibleTags2,
-      surelyHiddenTags: surelyHiddenTags2,
-      tmpThreshold: tmpThreshold2
-    };
-  }, [maxLength, tags, threshold]);
-  const {
-    tmpThreshold,
-    potentiallyVisibleTags,
-    surelyHiddenTags
-  } = memoizedResult;
-  react.useEffect(() => {
-    if (tags.length === 0 || !containerRef.current || !measureRef.current) {
-      return;
-    }
-    if (multiline) {
-      setVisibleTags(potentiallyVisibleTags);
-      setHiddenTags(surelyHiddenTags);
-      setIsReady(true);
-      return;
-    }
-    const parentWidth = containerRef.current.parentElement?.offsetWidth || 0;
-    const toMeasureElements = measureRef.current.children[0].children;
-    const [firstTag, ...restOfToMeasureElements] = [...toMeasureElements];
-    const {
-      measuredVisibleTags,
-      measuredHiddenTags
-    } = restOfToMeasureElements.reduce((accumulator, currentValue, index2) => {
-      const newAccumulatedWidth = accumulator.accumulatedWidth + currentValue.offsetWidth + Number.parseInt(constant.TAGS_GAP, 10);
-      return {
-        accumulatedWidth: newAccumulatedWidth,
-        measuredHiddenTags: [...accumulator.measuredHiddenTags, newAccumulatedWidth > parentWidth && tags[index2 + 1]].filter(Boolean),
-        measuredVisibleTags: [...accumulator.measuredVisibleTags, newAccumulatedWidth <= parentWidth && tags[index2 + 1]].filter(Boolean)
-      };
-    }, {
-      accumulatedWidth: firstTag.offsetWidth + Number.parseInt(constant.TAGS_GAP, 10),
-      measuredHiddenTags: [],
-      measuredVisibleTags: [tags[0]]
-      // we need to always show one tag
-    });
-    const finalHiddenTags = [...measuredHiddenTags, ...surelyHiddenTags];
-    setVisibleTags(measuredVisibleTags);
-    setHiddenTags(finalHiddenTags);
-    if (finalHiddenTags.length === 0) {
-      setIsReady(true);
-    }
-  }, [multiline, potentiallyVisibleTags, surelyHiddenTags, tags, threshold, tmpThreshold]);
-  react.useEffect(() => {
-    if (!isReady && popoverTriggerRef.current?.offsetWidth) {
-      const newPopoverTriggerWidth = popoverTriggerRef.current.offsetWidth;
-      setPopoverTriggerWidth(newPopoverTriggerWidth);
-      const tagsContainer = containerRef.current;
-      const tagsContainerWidth = containerRef.current?.offsetWidth || 0;
-      const parentWidth = tagsContainer?.parentElement?.offsetWidth || 0;
-      if (visibleTags.length > 1 && hiddenTags.length > 0 && tagsContainerWidth + newPopoverTriggerWidth > parentWidth) {
-        const visibleTagsCopy = visibleTags.filter((_, index2) => index2 < visibleTags.length - 1);
-        const tagToMove = visibleTags[visibleTags.length - 1];
-        setVisibleTags(visibleTagsCopy);
-        setHiddenTags([tagToMove, ...hiddenTags]);
-      }
-      setIsReady(true);
-    }
-  }, [hiddenTags, isReady, threshold, visibleTags, visibleTags.length]);
-  react.useEffect(() => {
-    if (isReady && measureRef.current?.parentNode) {
-      measureRef.current.remove();
-    }
-  }, [isReady]);
-  if (tags.length === 0) {
-    return null;
-  }
-  const renderTag = (tag, index2, isEllipsis = false) => typeof tag !== "string" && tag.icon ? /* @__PURE__ */ jsxRuntime.jsxs(
-    index$1.Tag,
-    {
-      className: isEllipsis ? "ellipsed" : "",
-      copiable,
-      copiedText,
-      copyText,
-      children: [
-        tag.icon,
-        getTagLabel(tag)
-      ]
-    },
-    `${getTagLabel(tag)}-${index2}`
-  ) : /* @__PURE__ */ jsxRuntime.jsx(index$1.Tag, { className: isEllipsis ? "ellipsed" : "", copiable, copiedText, copyText, children: getTagLabel(tag) }, `${getTagLabel(tag)}-${index2}`);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${className ? `${className} ` : ""}${styles_css.tagListContainer}`, "data-testid": dataTestId, style: {
-    visibility: isReady ? "visible" : "hidden",
-    ...style
-  }, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${styles_css.tagContainer({
-      multiline
-    })} ${visibleTags.length === 1 && hiddenTags.length === 0 || popoverTriggerWidth ? styles_css.ellipsisContainer : ""}`, "data-testid": `${dataTestId ?? "taglist"}-container`, ref: containerRef, style: dynamic.assignInlineVars({
-      [styles_css.popoverTriggerWidthVar]: `${popoverTriggerWidth || 0}px`
-    }), children: visibleTags.map((tag, index2) => renderTag(
-      tag,
-      index2,
-      // add ellipsis to last tag
-      index2 === visibleTags.length - 1
-    )) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { ref: measureRef, style: {
-      position: "absolute",
-      visibility: "hidden",
-      whiteSpace: "nowrap"
-    }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles_css.tagContainer({
-      multiline
-    }), "data-testid": `${dataTestId ?? "taglist"}-measure-container`, children: potentiallyVisibleTags.map((tag, index2) => renderTag(tag, index2)) }) }),
-    hiddenTags.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(index.Popover, { content: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles_css.tagContainer({
-      multiline: true
-    }), children: hiddenTags.map((tag, index2) => renderTag(tag, index2)) }), maxHeight: popoverMaxHeight, onClose: () => setIsPopoverVisible(false), placement: popoverPlacement, size: "small", title: popoverTitle, visible: isPopoverVisible, children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: styles_css.tagsWrapper, "data-testid": `${dataTestId ?? "taglist"}-open`, onClick: () => setIsPopoverVisible(true), onKeyDown: (event) => {
-      if ([" ", "Enter"].includes(event.key)) {
-        setIsPopoverVisible(true);
-      }
-    }, ref: popoverTriggerRef, tabIndex: 0, children: [
-      "+",
-      hiddenTags.length
-    ] }) })
-  ] });
-};
-exports.TagList = TagList;

package/dist/components/TagList/styles.css.cjs

@@ -1,14 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-;/* empty css                            */
-const createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var popoverTriggerWidthVar = "var(--uv_1f9zr5y0)";
-var tagListContainer = "uv_1f9zr5y1";
-var tagContainer = createRuntimeFn.createRuntimeFn({ defaultClassName: "uv_1f9zr5y2", variantClassNames: { multiline: { true: "uv_1f9zr5y3" } }, defaultVariants: {}, compoundVariants: [] });
-var ellipsisContainer = "uv_1f9zr5y4";
-var tagsWrapper = "uv_1f9zr5y5";
-exports.ellipsisContainer = ellipsisContainer;
-exports.popoverTriggerWidthVar = popoverTriggerWidthVar;
-exports.tagContainer = tagContainer;
-exports.tagListContainer = tagListContainer;
-exports.tagsWrapper = tagsWrapper;

package/dist/components/Text/constant.d.ts

@@ -1,6 +0,0 @@
-export declare const PROMINENCES: {
-    default: string;
-    strong: string;
-    stronger: string;
-    weak: string;
-};

package/dist/components/Text/index.cjs

@@ -1,53 +0,0 @@
-"use client";
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
-const dynamic = require("@vanilla-extract/dynamic");
-const react = require("react");
-const recursivelyGetChildrenString = require("../../helpers/recursivelyGetChildrenString.cjs");
-const useIsOverflowing = require("../../hooks/useIsOverflowing.cjs");
-const index = require("../Tooltip/index.cjs");
-const style_css = require("./style.css.cjs");
-const variables_css = require("./variables.css.cjs");
-const Text = ({
-  variant,
-  children,
-  as: Component = "div",
-  sentiment,
-  oneLine = false,
-  placement,
-  prominence = "default",
-  className,
-  disabled = false,
-  italic = false,
-  underline = false,
-  strikeThrough = false,
-  id,
-  dir,
-  whiteSpace,
-  htmlFor,
-  "data-testid": dataTestId,
-  "aria-hidden": ariaHidden,
-  style
-}) => {
-  const elementRef = react.useRef(null);
-  const isOverflowing = useIsOverflowing.useIsOverflowing(elementRef);
-  const finalStringChildren = recursivelyGetChildrenString(children);
-  return /* @__PURE__ */ jsxRuntime.jsx(index.Tooltip, { text: oneLine && isOverflowing ? finalStringChildren : "", children: /* @__PURE__ */ jsxRuntime.jsx(Component, { "aria-hidden": ariaHidden, className: `${className ? `${className} ` : ""}${style_css.text({
-    disabled,
-    italic,
-    oneLine,
-    prominence,
-    sentiment,
-    strikeThrough,
-    underline,
-    variant
-  })}`, "data-testid": dataTestId, dir, htmlFor, id, ref: elementRef, style: {
-    ...dynamic.assignInlineVars({
-      [variables_css.placementText]: placement,
-      [variables_css.whiteSpaceText]: whiteSpace
-    }),
-    ...style
-  }, children }) });
-};
-exports.Text = Text;

package/dist/components/Text/style.css.cjs

@@ -1,6 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-;/* empty css                           */
-const createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var text = createRuntimeFn.createRuntimeFn({ defaultClassName: "uv_m4c9ow0", variantClassNames: { strikeThrough: { true: "uv_m4c9ow1", false: "uv_m4c9ow2" }, italic: { true: "uv_m4c9ow3", false: "uv_m4c9ow4" }, underline: { true: "uv_m4c9ow5", false: "uv_m4c9ow6" }, oneLine: { true: "uv_m4c9ow7", false: "uv_m4c9ow8" }, sentiment: { primary: "uv_m4c9ow9", secondary: "uv_m4c9owa", neutral: "uv_m4c9owb", success: "uv_m4c9owc", danger: "uv_m4c9owd", warning: "uv_m4c9owe", info: "uv_m4c9owf", black: "uv_m4c9owg", white: "uv_m4c9owh" }, prominence: { "default": "uv_m4c9owi", strong: "uv_m4c9owj", stronger: "uv_m4c9owk", weak: "uv_m4c9owl" }, variant: { body: "uv_m4c9owm", bodySmall: "uv_m4c9own", bodySmallStrong: "uv_m4c9owo", bodySmallStronger: "uv_m4c9owp", bodyStrong: "uv_m4c9owq", bodyStronger: "uv_m4c9owr", caption: "uv_m4c9ows", captionSmall: "uv_m4c9owt", captionSmallStrong: "uv_m4c9owu", captionSmallStronger: "uv_m4c9owv", captionStrong: "uv_m4c9oww", captionStronger: "uv_m4c9owx", code: "uv_m4c9owy", codeStrong: "uv_m4c9owz", codeStronger: "uv_m4c9ow10", heading: "uv_m4c9ow11", headingLarge: "uv_m4c9ow12", headingLargeStrong: "uv_m4c9ow13", headingLargeStronger: "uv_m4c9ow14", headingSmall: "uv_m4c9ow15", headingSmallStrong: "uv_m4c9ow16", headingSmallStronger: "uv_m4c9ow17", headingStrong: "uv_m4c9ow18", headingStronger: "uv_m4c9ow19" }, disabled: { true: "uv_m4c9ow1a", false: "uv_m4c9ow1b" } }, defaultVariants: { strikeThrough: false, italic: false, underline: false, oneLine: false, sentiment: void 0, prominence: "default", variant: "body", disabled: false }, compoundVariants: [[{ sentiment: "primary", prominence: "default", disabled: false }, "uv_m4c9ow1c"], [{ sentiment: "primary", prominence: "strong", disabled: false }, "uv_m4c9ow1d"], [{ sentiment: "primary", prominence: "stronger", disabled: false }, "uv_m4c9ow1e"], [{ sentiment: "primary", prominence: "weak", disabled: false }, "uv_m4c9ow1f"], [{ sentiment: "secondary", prominence: "default", disabled: false }, "uv_m4c9ow1g"], [{ sentiment: "secondary", prominence: "strong", disabled: false }, "uv_m4c9ow1h"], [{ sentiment: "secondary", prominence: "stronger", disabled: false }, "uv_m4c9ow1i"], [{ sentiment: "secondary", prominence: "weak", disabled: false }, "uv_m4c9ow1j"], [{ sentiment: "danger", prominence: "default", disabled: false }, "uv_m4c9ow1k"], [{ sentiment: "danger", prominence: "strong", disabled: false }, "uv_m4c9ow1l"], [{ sentiment: "danger", prominence: "stronger", disabled: false }, "uv_m4c9ow1m"], [{ sentiment: "danger", prominence: "weak", disabled: false }, "uv_m4c9ow1n"], [{ sentiment: "info", prominence: "default", disabled: false }, "uv_m4c9ow1o"], [{ sentiment: "info", prominence: "strong", disabled: false }, "uv_m4c9ow1p"], [{ sentiment: "info", prominence: "stronger", disabled: false }, "uv_m4c9ow1q"], [{ sentiment: "info", prominence: "weak", disabled: false }, "uv_m4c9ow1r"], [{ sentiment: "success", prominence: "default", disabled: false }, "uv_m4c9ow1s"], [{ sentiment: "success", prominence: "strong", disabled: false }, "uv_m4c9ow1t"], [{ sentiment: "success", prominence: "stronger", disabled: false }, "uv_m4c9ow1u"], [{ sentiment: "success", prominence: "weak", disabled: false }, "uv_m4c9ow1v"], [{ sentiment: "warning", prominence: "default", disabled: false }, "uv_m4c9ow1w"], [{ sentiment: "warning", prominence: "strong", disabled: false }, "uv_m4c9ow1x"], [{ sentiment: "warning", prominence: "stronger", disabled: false }, "uv_m4c9ow1y"], [{ sentiment: "warning", prominence: "weak", disabled: false }, "uv_m4c9ow1z"], [{ sentiment: "neutral", prominence: "default", disabled: false }, "uv_m4c9ow20"], [{ sentiment: "neutral", prominence: "strong", disabled: false }, "uv_m4c9ow21"], [{ sentiment: "neutral", prominence: "stronger", disabled: false }, "uv_m4c9ow22"], [{ sentiment: "neutral", prominence: "weak", disabled: false }, "uv_m4c9ow23"], [{ sentiment: "black", prominence: "default", disabled: false }, "uv_m4c9ow24"], [{ sentiment: "black", prominence: "strong", disabled: false }, "uv_m4c9ow25"], [{ sentiment: "black", prominence: "stronger", disabled: false }, "uv_m4c9ow26"], [{ sentiment: "black", prominence: "weak", disabled: false }, "uv_m4c9ow27"], [{ sentiment: "white", prominence: "default", disabled: false }, "uv_m4c9ow28"], [{ sentiment: "white", prominence: "strong", disabled: false }, "uv_m4c9ow29"], [{ sentiment: "white", prominence: "stronger", disabled: false }, "uv_m4c9ow2a"], [{ sentiment: "white", prominence: "weak", disabled: false }, "uv_m4c9ow2b"], [{ sentiment: "primary", prominence: "default", disabled: true }, "uv_m4c9ow2c"], [{ sentiment: "primary", prominence: "strong", disabled: true }, "uv_m4c9ow2d"], [{ sentiment: "primary", prominence: "stronger", disabled: true }, "uv_m4c9ow2e"], [{ sentiment: "primary", prominence: "weak", disabled: true }, "uv_m4c9ow2f"], [{ sentiment: "secondary", prominence: "default", disabled: true }, "uv_m4c9ow2g"], [{ sentiment: "secondary", prominence: "strong", disabled: true }, "uv_m4c9ow2h"], [{ sentiment: "secondary", prominence: "stronger", disabled: true }, "uv_m4c9ow2i"], [{ sentiment: "secondary", prominence: "weak", disabled: true }, "uv_m4c9ow2j"], [{ sentiment: "danger", prominence: "default", disabled: true }, "uv_m4c9ow2k"], [{ sentiment: "danger", prominence: "strong", disabled: true }, "uv_m4c9ow2l"], [{ sentiment: "danger", prominence: "stronger", disabled: true }, "uv_m4c9ow2m"], [{ sentiment: "danger", prominence: "weak", disabled: true }, "uv_m4c9ow2n"], [{ sentiment: "info", prominence: "default", disabled: true }, "uv_m4c9ow2o"], [{ sentiment: "info", prominence: "strong", disabled: true }, "uv_m4c9ow2p"], [{ sentiment: "info", prominence: "stronger", disabled: true }, "uv_m4c9ow2q"], [{ sentiment: "info", prominence: "weak", disabled: true }, "uv_m4c9ow2r"], [{ sentiment: "success", prominence: "default", disabled: true }, "uv_m4c9ow2s"], [{ sentiment: "success", prominence: "strong", disabled: true }, "uv_m4c9ow2t"], [{ sentiment: "success", prominence: "stronger", disabled: true }, "uv_m4c9ow2u"], [{ sentiment: "success", prominence: "weak", disabled: true }, "uv_m4c9ow2v"], [{ sentiment: "warning", prominence: "default", disabled: true }, "uv_m4c9ow2w"], [{ sentiment: "warning", prominence: "strong", disabled: true }, "uv_m4c9ow2x"], [{ sentiment: "warning", prominence: "stronger", disabled: true }, "uv_m4c9ow2y"], [{ sentiment: "warning", prominence: "weak", disabled: true }, "uv_m4c9ow2z"], [{ sentiment: "neutral", prominence: "default", disabled: true }, "uv_m4c9ow30"], [{ sentiment: "neutral", prominence: "strong", disabled: true }, "uv_m4c9ow31"], [{ sentiment: "neutral", prominence: "stronger", disabled: true }, "uv_m4c9ow32"], [{ sentiment: "neutral", prominence: "weak", disabled: true }, "uv_m4c9ow33"], [{ sentiment: "black", prominence: "default", disabled: true }, "uv_m4c9ow34"], [{ sentiment: "black", prominence: "strong", disabled: true }, "uv_m4c9ow35"], [{ sentiment: "black", prominence: "stronger", disabled: true }, "uv_m4c9ow36"], [{ sentiment: "black", prominence: "weak", disabled: true }, "uv_m4c9ow37"], [{ sentiment: "white", prominence: "default", disabled: true }, "uv_m4c9ow38"], [{ sentiment: "white", prominence: "strong", disabled: true }, "uv_m4c9ow39"], [{ sentiment: "white", prominence: "stronger", disabled: true }, "uv_m4c9ow3a"], [{ sentiment: "white", prominence: "weak", disabled: true }, "uv_m4c9ow3b"], [{ prominence: "default", disabled: false }, "uv_m4c9ow3c"], [{ prominence: "strong", disabled: false }, "uv_m4c9ow3d"], [{ prominence: "stronger", disabled: false }, "uv_m4c9ow3e"], [{ prominence: "weak", disabled: false }, "uv_m4c9ow3f"]] });
-exports.text = text;

package/dist/components/Text/variables.css.cjs

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-;/* empty css                               */
-var placementText = "var(--uv_qabug40)";
-var whiteSpaceText = "var(--uv_qabug41)";
-exports.placementText = placementText;
-exports.whiteSpaceText = whiteSpaceText;

package/dist/components/TextArea/index.cjs

@@ -1,123 +0,0 @@
-"use client";
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
-const Icon = require("@ultraviolet/icons");
-const themes = require("@ultraviolet/themes");
-const dynamic = require("@vanilla-extract/dynamic");
-const react = require("react");
-const index$3 = require("../Button/index.cjs");
-const constants = require("../Button/constants.cjs");
-const index$1 = require("../Label/index.cjs");
-const index$4 = require("../Row/index.cjs");
-const index = require("../Stack/index.cjs");
-const index$5 = require("../Text/index.cjs");
-const index$2 = require("../Tooltip/index.cjs");
-const styles_css = require("./styles.css.cjs");
-const STATE_ICON_SIZE = "small";
-const TextArea = react.forwardRef(({
-  id,
-  className,
-  tabIndex,
-  value,
-  onChange,
-  placeholder,
-  rows = 3,
-  maxRows,
-  disabled = false,
-  readOnly = false,
-  success,
-  error,
-  helper,
-  minLength,
-  maxLength,
-  tooltip,
-  label,
-  autoFocus,
-  required = false,
-  "data-testid": dataTestId,
-  name,
-  onFocus,
-  onBlur,
-  onKeyDown,
-  clearable = false,
-  labelDescription,
-  "aria-label": ariaLabel,
-  style
-}, ref) => {
-  const localId = react.useId();
-  const theme = themes.useTheme();
-  const textAreaRef = react.useRef(null);
-  react.useImperativeHandle(ref, () => textAreaRef.current);
-  react.useEffect(() => {
-    const textArea = textAreaRef.current;
-    const padding = theme.space["1.5"];
-    if (!textArea) {
-      return;
-    }
-    const updateHeight = () => {
-      if (textArea && rows === "auto" && !maxRows) {
-        textArea.style.height = "auto";
-        textArea.style.resize = "none";
-        textArea.style.height = `${textArea.scrollHeight + 2}px`;
-      } else if (textArea && maxRows) {
-        const lineHeight = Number.parseFloat(getComputedStyle(textArea).lineHeight);
-        textArea.style.height = "auto";
-        const maxHeight = maxRows * lineHeight;
-        textArea.style.height = `${textArea.scrollHeight + 2}px`;
-        textArea.style.maxHeight = `calc(${maxHeight}px + 2*${padding})`;
-        if (typeof rows === "number") {
-          const minHeight = rows * lineHeight;
-          textArea.style.minHeight = `calc(${minHeight}px + 2*${padding})`;
-        }
-      }
-    };
-    requestAnimationFrame(updateHeight);
-  }, [value, rows, theme, maxRows, textAreaRef.current?.value]);
-  const sentiment = react.useMemo(() => {
-    if (error) {
-      return "danger";
-    }
-    if (success) {
-      return "success";
-    }
-    return "neutral";
-  }, [error, success]);
-  const notice = success || error || helper;
-  const computedClearable = clearable && !!value;
-  return /* @__PURE__ */ jsxRuntime.jsxs(index.Stack, { className, gap: "0.5", children: [
-    label || labelDescription ? /* @__PURE__ */ jsxRuntime.jsx(index$1.Label, { htmlFor: id ?? localId, labelDescription, required, children: label }) : null,
-    /* @__PURE__ */ jsxRuntime.jsx(index$2.Tooltip, { text: tooltip, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles_css.textareaWrapper, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("textarea", { "aria-invalid": !!error, "aria-label": ariaLabel, autoFocus, className: styles_css.textArea({
-        error: !!error,
-        success: !!success
-      }), "data-testid": dataTestId, disabled, id: id ?? localId, maxLength, minLength, name, onBlur, onChange: (event) => {
-        onChange(event.currentTarget.value);
-      }, onFocus, onKeyDown, placeholder, readOnly: !!readOnly, ref: textAreaRef, rows: rows !== "auto" ? rows : 1, style: {
-        ...dynamic.assignInlineVars({
-          [styles_css.paddingRightVar]: `calc(${theme.space[computedClearable && (!!success || !!error) ? "4" : "3"]} + ${computedClearable ? `${constants.SIZE_HEIGHT.xsmall}px` : "0px"} + ${!!success || !!error ? `${STATE_ICON_SIZE}px` : "0px"})`
-        }),
-        ...style
-      }, tabIndex, value }),
-      /* @__PURE__ */ jsxRuntime.jsxs(index.Stack, { alignItems: "center", className: styles_css.textAreaClearableContainer, direction: "row", gap: "1", children: [
-        computedClearable ? /* @__PURE__ */ jsxRuntime.jsx(index$3.Button, { "aria-label": "clear value", onClick: () => {
-          onChange("");
-        }, sentiment: "neutral", size: "xsmall", variant: "ghost", children: /* @__PURE__ */ jsxRuntime.jsx(Icon.CloseIcon, {}) }) : null,
-        success && !error ? /* @__PURE__ */ jsxRuntime.jsx(Icon.CheckCircleIcon, { sentiment: "success", size: STATE_ICON_SIZE }) : null,
-        error ? /* @__PURE__ */ jsxRuntime.jsx(Icon.AlertCircleIcon, { sentiment: "danger" }) : null
-      ] })
-    ] }) }),
-    notice || maxLength ? /* @__PURE__ */ jsxRuntime.jsxs(index$4.Row, { gap: "1", templateColumns: "minmax(0, 1fr) min-content", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-        error || success || typeof helper === "string" ? /* @__PURE__ */ jsxRuntime.jsx(index$5.Text, { as: "p", disabled, prominence: !error && !success ? "weak" : "default", sentiment, variant: "caption", children: error || success || helper }) : null,
-        !error && !success && typeof helper !== "string" && helper ? helper : null
-      ] }),
-      maxLength ? /* @__PURE__ */ jsxRuntime.jsxs(index$5.Text, { as: "div", prominence: "weak", sentiment: "neutral", variant: "caption", children: [
-        value?.length ?? 0,
-        "/",
-        maxLength
-      ] }) : null
-    ] }) : null
-  ] });
-});
-exports.TextArea = TextArea;