boreal-ui 0.0.1

package/dist/core/Taginput-CrScreYL.js

@@ -0,0 +1,245 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { B as Button } from "./Button-DEYbr8xW.js";
+import { T as TextInput } from "./TextInput-CtI8fsXR.js";
+import { useId, useState, useEffect, useMemo } from "react";
+import { C as CloseIcon } from "./CloseIcon-C3eQm4EK.js";
+import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
+import { c as capitalize } from "./capitalize-C0TSQSPh.js";
+import { c as getDefaultSize, d as getDefaultTheme, a as getDefaultRounding, b as getDefaultShadow } from "./boreal-style-config-BILmxkZG.js";
+const TagInputBase = ({
+  tags = [],
+  onChange,
+  fetchSuggestions,
+  debounceMs = 300,
+  placeholder = "Add a tag...",
+  theme = getDefaultTheme(),
+  state = "",
+  size = getDefaultSize(),
+  rounding = getDefaultRounding(),
+  shadow = getDefaultShadow(),
+  "data-testid": testId = "tag-input",
+  ariaDescription = "Type a tag and press Enter or comma to add. Existing tags can be removed using the remove button next to each tag.",
+  classMap,
+  IconButton,
+  TextInput: TextInput2
+}) => {
+  const inputId = useId();
+  const descId = `${inputId}-desc`;
+  const labelId = `${inputId}-label`;
+  const [inputValue, setInputValue] = useState("");
+  const [tagList, setTagList] = useState(tags);
+  const [lastAction, setLastAction] = useState("");
+  const [suggestions, setSuggestions] = useState([]);
+  const [debounceTimeout, setDebounceTimeout] = useState(
+    null
+  );
+  useEffect(() => {
+    if (!fetchSuggestions || !inputValue.trim()) {
+      setSuggestions([]);
+      return;
+    }
+    if (debounceTimeout) {
+      clearTimeout(debounceTimeout);
+    }
+    const timeout = setTimeout(async () => {
+      try {
+        const result = await fetchSuggestions(inputValue);
+        setSuggestions(result);
+      } catch (error) {
+        console.error("Failed to fetch tag suggestions:", error);
+      }
+    }, debounceMs);
+    setDebounceTimeout(timeout);
+    return () => clearTimeout(timeout);
+  }, [inputValue, fetchSuggestions, debounceMs]);
+  const handleAddTag = (event) => {
+    if ((event.key === "Enter" || event.key === ",") && inputValue.trim() !== "") {
+      event.preventDefault();
+      const newTag = inputValue.trim();
+      if (!tagList.includes(newTag)) {
+        const updated = [...tagList, newTag];
+        setTagList(updated);
+        onChange == null ? void 0 : onChange(updated);
+        setLastAction(`Added tag ${newTag}`);
+      }
+      setInputValue("");
+    }
+  };
+  const handleRemoveTag = (tag) => {
+    const updated = tagList.filter((t) => t !== tag);
+    setTagList(updated);
+    onChange == null ? void 0 : onChange(updated);
+    setLastAction(`Removed tag ${tag}`);
+  };
+  const wrapperClass = useMemo(
+    () => combineClassNames(
+      classMap.tagInput,
+      classMap[theme],
+      classMap[state],
+      classMap[size]
+    ),
+    [classMap, theme, state, size]
+  );
+  const tagClass = useMemo(
+    () => combineClassNames(
+      classMap.tag,
+      shadow && classMap[`shadow${capitalize(shadow)}`],
+      rounding && classMap[`round${capitalize(rounding)}`]
+    ),
+    [classMap]
+  );
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: wrapperClass,
+      role: "group",
+      "aria-labelledby": labelId,
+      "aria-describedby": descId,
+      "data-testid": testId,
+      children: [
+        /* @__PURE__ */ jsx("label", { id: labelId, className: "sr_only", children: "Tag Input" }),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            id: descId,
+            className: "sr_only",
+            "data-testid": `${testId}-description`,
+            children: ariaDescription
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "ul",
+          {
+            className: classMap.tagContainer,
+            "aria-live": "polite",
+            "aria-relevant": "additions removals",
+            "data-testid": `${testId}-list`,
+            children: tagList.map((tag, index) => /* @__PURE__ */ jsxs(
+              "li",
+              {
+                className: tagClass,
+                role: "listitem",
+                "data-testid": `${testId}-tag-${index}`,
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: classMap.tagLabel, children: tag }),
+                  /* @__PURE__ */ jsx(
+                    IconButton,
+                    {
+                      type: "button",
+                      "aria-label": `Remove tag ${tag}`,
+                      className: classMap.removeButton,
+                      onClick: () => handleRemoveTag(tag),
+                      "data-testid": `${testId}-remove-${index}`,
+                      icon: CloseIcon,
+                      size: "small",
+                      theme: "clear"
+                    }
+                  )
+                ]
+              },
+              tag
+            ))
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: classMap.inputWrapper, children: /* @__PURE__ */ jsx(
+          TextInput2,
+          {
+            id: inputId,
+            type: "text",
+            theme,
+            state,
+            rounding,
+            shadow,
+            className: classMap.input,
+            value: inputValue,
+            placeholder: tagList.length === 0 ? placeholder : "",
+            onChange: (e) => setInputValue(e.target.value),
+            onKeyDown: handleAddTag,
+            "aria-label": "Add new tag",
+            "aria-describedby": descId,
+            "data-testid": `${testId}-input`
+          }
+        ) }),
+        suggestions.length > 0 && /* @__PURE__ */ jsx(
+          "ul",
+          {
+            className: classMap.suggestionList,
+            role: "listbox",
+            id: `${inputId}-listbox`,
+            title: "suggestions",
+            "data-testid": `${testId}-suggestions`,
+            children: suggestions.map((suggestion, index) => /* @__PURE__ */ jsx(
+              "li",
+              {
+                className: classMap.suggestionItem,
+                onClick: () => {
+                  if (!tagList.includes(suggestion)) {
+                    const updated = [...tagList, suggestion];
+                    setTagList(updated);
+                    onChange == null ? void 0 : onChange(updated);
+                    setLastAction(`Added tag ${suggestion}`);
+                  }
+                  setInputValue("");
+                  setSuggestions([]);
+                },
+                role: "option",
+                "data-testid": `${testId}-suggestion-${index}`,
+                children: suggestion
+              },
+              index
+            ))
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { "aria-live": "polite", className: "sr_only", children: lastAction })
+      ]
+    }
+  );
+};
+const classes = {
+  tagInput: "tag_input",
+  tagContainer: "tag_input_tag_container",
+  tag: "tag_input_tag",
+  tagLabel: "tag_input_tag_label",
+  removeButton: "tag_input_remove_button",
+  inputWrapper: "tag_input_input_wrapper",
+  input: "tag_input_input",
+  suggestionList: "tag_input_suggestion_list",
+  suggestionItem: "tag_input_suggestion_item",
+  primary: "tag_input_primary",
+  secondary: "tag_input_secondary",
+  tertiary: "tag_input_tertiary",
+  quaternary: "tag_input_quaternary",
+  success: "tag_input_success",
+  warning: "tag_input_warning",
+  error: "tag_input_error",
+  clear: "tag_input_clear",
+  xs: "tag_input_xs",
+  small: "tag_input_small",
+  medium: "tag_input_medium",
+  large: "tag_input_large",
+  xl: "tag_input_xl",
+  shadowNone: "tag_shadow-None",
+  shadowLight: "tag_shadow-Light",
+  shadowMedium: "tag_shadow-Medium",
+  shadowStrong: "tag_shadow-Strong",
+  shadowIntense: "tag_shadow-Intense",
+  roundNone: "tag_round-None",
+  roundSmall: "tag_round-Small",
+  roundMedium: "tag_round-Medium",
+  roundLarge: "tag_round-Large"
+};
+const TagInput = (props) => {
+  return /* @__PURE__ */ jsx(
+    TagInputBase,
+    {
+      ...props,
+      classMap: classes,
+      IconButton: Button,
+      TextInput
+    }
+  );
+};
+export {
+  TagInput as T
+};
+//# sourceMappingURL=Taginput-CrScreYL.js.map

package/dist/core/Taginput-CrScreYL.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Taginput-CrScreYL.js","sources":["../../src/components/TagInput/TagInputBase.tsx","../../src/components/TagInput/core/Taginput.tsx"],"sourcesContent":["import React, {\r\n  useId,\r\n  useState,\r\n  KeyboardEvent,\r\n  useMemo,\r\n  useEffect,\r\n} from \"react\";\r\nimport { TagInputProps } from \"./Taginput.types\";\r\nimport { CloseIcon } from \"../../Icons\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultSize,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst TagInputBase: React.FC<\r\n  TagInputProps & {\r\n    classMap: Record<string, string>;\r\n    IconButton: React.FC<any>;\r\n    TextInput: React.FC<any>;\r\n  }\r\n> = ({\r\n  tags = [],\r\n  onChange,\r\n  fetchSuggestions,\r\n  debounceMs = 300,\r\n  placeholder = \"Add a tag...\",\r\n  theme = getDefaultTheme(),\r\n  state = \"\",\r\n  size = getDefaultSize(),\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  \"data-testid\": testId = \"tag-input\",\r\n  ariaDescription = \"Type a tag and press Enter or comma to add. Existing tags can be removed using the remove button next to each tag.\",\r\n  classMap,\r\n  IconButton,\r\n  TextInput,\r\n}) => {\r\n  const inputId = useId();\r\n  const descId = `${inputId}-desc`;\r\n  const labelId = `${inputId}-label`;\r\n\r\n  const [inputValue, setInputValue] = useState(\"\");\r\n  const [tagList, setTagList] = useState<string[]>(tags);\r\n  const [lastAction, setLastAction] = useState<string>(\"\");\r\n\r\n  const [suggestions, setSuggestions] = useState<string[]>([]);\r\n  const [debounceTimeout, setDebounceTimeout] = useState<NodeJS.Timeout | null>(\r\n    null\r\n  );\r\n\r\n  useEffect(() => {\r\n    if (!fetchSuggestions || !inputValue.trim()) {\r\n      setSuggestions([]);\r\n      return;\r\n    }\r\n\r\n    if (debounceTimeout) {\r\n      clearTimeout(debounceTimeout);\r\n    }\r\n\r\n    const timeout = setTimeout(async () => {\r\n      try {\r\n        const result = await fetchSuggestions(inputValue);\r\n        setSuggestions(result);\r\n      } catch (error) {\r\n        console.error(\"Failed to fetch tag suggestions:\", error);\r\n      }\r\n    }, debounceMs);\r\n\r\n    setDebounceTimeout(timeout);\r\n\r\n    return () => clearTimeout(timeout);\r\n  }, [inputValue, fetchSuggestions, debounceMs]);\r\n\r\n  const handleAddTag = (event: KeyboardEvent<HTMLInputElement>) => {\r\n    if (\r\n      (event.key === \"Enter\" || event.key === \",\") &&\r\n      inputValue.trim() !== \"\"\r\n    ) {\r\n      event.preventDefault();\r\n      const newTag = inputValue.trim();\r\n      if (!tagList.includes(newTag)) {\r\n        const updated = [...tagList, newTag];\r\n        setTagList(updated);\r\n        onChange?.(updated);\r\n        setLastAction(`Added tag ${newTag}`);\r\n      }\r\n      setInputValue(\"\");\r\n    }\r\n  };\r\n\r\n  const handleRemoveTag = (tag: string) => {\r\n    const updated = tagList.filter((t) => t !== tag);\r\n    setTagList(updated);\r\n    onChange?.(updated);\r\n    setLastAction(`Removed tag ${tag}`);\r\n  };\r\n\r\n  const wrapperClass = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.tagInput,\r\n        classMap[theme],\r\n        classMap[state],\r\n        classMap[size]\r\n      ),\r\n    [classMap, theme, state, size]\r\n  );\r\n\r\n  const tagClass = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.tag,\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`]\r\n      ),\r\n    [classMap]\r\n  );\r\n\r\n  return (\r\n    <div\r\n      className={wrapperClass}\r\n      role=\"group\"\r\n      aria-labelledby={labelId}\r\n      aria-describedby={descId}\r\n      data-testid={testId}\r\n    >\r\n      <label id={labelId} className=\"sr_only\">\r\n        Tag Input\r\n      </label>\r\n      <div\r\n        id={descId}\r\n        className=\"sr_only\"\r\n        data-testid={`${testId}-description`}\r\n      >\r\n        {ariaDescription}\r\n      </div>\r\n\r\n      <ul\r\n        className={classMap.tagContainer}\r\n        aria-live=\"polite\"\r\n        aria-relevant=\"additions removals\"\r\n        data-testid={`${testId}-list`}\r\n      >\r\n        {tagList.map((tag, index) => (\r\n          <li\r\n            key={tag}\r\n            className={tagClass}\r\n            role=\"listitem\"\r\n            data-testid={`${testId}-tag-${index}`}\r\n          >\r\n            <span className={classMap.tagLabel}>{tag}</span>\r\n            <IconButton\r\n              type=\"button\"\r\n              aria-label={`Remove tag ${tag}`}\r\n              className={classMap.removeButton}\r\n              onClick={() => handleRemoveTag(tag)}\r\n              data-testid={`${testId}-remove-${index}`}\r\n              icon={CloseIcon}\r\n              size=\"small\"\r\n              theme=\"clear\"\r\n            />\r\n          </li>\r\n        ))}\r\n      </ul>\r\n\r\n      <div className={classMap.inputWrapper}>\r\n        <TextInput\r\n          id={inputId}\r\n          type=\"text\"\r\n          theme={theme}\r\n          state={state}\r\n          rounding={rounding}\r\n          shadow={shadow}\r\n          className={classMap.input}\r\n          value={inputValue}\r\n          placeholder={tagList.length === 0 ? placeholder : \"\"}\r\n          onChange={(e: { target: { value: string } }) =>\r\n            setInputValue(e.target.value)\r\n          }\r\n          onKeyDown={handleAddTag}\r\n          aria-label=\"Add new tag\"\r\n          aria-describedby={descId}\r\n          data-testid={`${testId}-input`}\r\n        />\r\n      </div>\r\n      {suggestions.length > 0 && (\r\n        <ul\r\n          className={classMap.suggestionList}\r\n          role=\"listbox\"\r\n          id={`${inputId}-listbox`}\r\n          title=\"suggestions\"\r\n          data-testid={`${testId}-suggestions`}\r\n        >\r\n          {suggestions.map((suggestion, index) => (\r\n            <li\r\n              key={index}\r\n              className={classMap.suggestionItem}\r\n              onClick={() => {\r\n                if (!tagList.includes(suggestion)) {\r\n                  const updated = [...tagList, suggestion];\r\n                  setTagList(updated);\r\n                  onChange?.(updated);\r\n                  setLastAction(`Added tag ${suggestion}`);\r\n                }\r\n                setInputValue(\"\");\r\n                setSuggestions([]);\r\n              }}\r\n              role=\"option\"\r\n              data-testid={`${testId}-suggestion-${index}`}\r\n            >\r\n              {suggestion}\r\n            </li>\r\n          ))}\r\n        </ul>\r\n      )}\r\n\r\n      <div aria-live=\"polite\" className=\"sr_only\">\r\n        {lastAction}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default TagInputBase;\r\n","import React from \"react\";\r\nimport \"./Taginput.scss\";\r\nimport IconButton from \"../../Button/core/Button\";\r\nimport TextInput from \"../../TextInput/core/TextInput\";\r\nimport TagInputBase from \"../TagInputBase\";\r\nimport { TagInputProps } from \"../Taginput.types\";\r\n\r\nconst classes = {\r\n  tagInput: \"tag_input\",\r\n  tagContainer: \"tag_input_tag_container\",\r\n  tag: \"tag_input_tag\",\r\n  tagLabel: \"tag_input_tag_label\",\r\n  removeButton: \"tag_input_remove_button\",\r\n  inputWrapper: \"tag_input_input_wrapper\",\r\n  input: \"tag_input_input\",\r\n  suggestionList: \"tag_input_suggestion_list\",\r\n  suggestionItem: \"tag_input_suggestion_item\",\r\n\r\n  primary: \"tag_input_primary\",\r\n  secondary: \"tag_input_secondary\",\r\n  tertiary: \"tag_input_tertiary\",\r\n  quaternary: \"tag_input_quaternary\",\r\n\r\n  success: \"tag_input_success\",\r\n  warning: \"tag_input_warning\",\r\n  error: \"tag_input_error\",\r\n\r\n  clear: \"tag_input_clear\",\r\n\r\n  xs: \"tag_input_xs\",\r\n  small: \"tag_input_small\",\r\n  medium: \"tag_input_medium\",\r\n  large: \"tag_input_large\",\r\n  xl: \"tag_input_xl\",\r\n\r\n  shadowNone: \"tag_shadow-None\",\r\n  shadowLight: \"tag_shadow-Light\",\r\n  shadowMedium: \"tag_shadow-Medium\",\r\n  shadowStrong: \"tag_shadow-Strong\",\r\n  shadowIntense: \"tag_shadow-Intense\",\r\n\r\n  roundNone: \"tag_round-None\",\r\n  roundSmall: \"tag_round-Small\",\r\n  roundMedium: \"tag_round-Medium\",\r\n  roundLarge: \"tag_round-Large\",\r\n};\r\n\r\nconst TagInput: React.FC<TagInputProps> = (props) => {\r\n  return (\r\n    <TagInputBase\r\n      {...props}\r\n      classMap={classes}\r\n      IconButton={IconButton}\r\n      TextInput={TextInput}\r\n    />\r\n  );\r\n};\r\n\r\nexport default TagInput;\r\n"],"names":["TextInput","IconButton"],"mappings":"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"}

package/dist/core/TextArea-B88b8dFf.js

@@ -0,0 +1,125 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { forwardRef, useId, useMemo } from "react";
+import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
+import { c as capitalize } from "./capitalize-C0TSQSPh.js";
+import { a as getDefaultRounding, b as getDefaultShadow, d as getDefaultTheme } from "./boreal-style-config-BILmxkZG.js";
+const TextAreaBase = forwardRef(
+  ({
+    icon: Icon,
+    placeholder = "Enter text",
+    readOnly = false,
+    outline = false,
+    autoComplete = "off",
+    theme = getDefaultTheme(),
+    rounding = getDefaultRounding(),
+    shadow = getDefaultShadow(),
+    state = "",
+    ariaLabel,
+    ariaDescription,
+    disabled = false,
+    height,
+    classMap,
+    className = "",
+    "data-testid": testId = "text-area",
+    ...props
+  }, ref) => {
+    const id = useId();
+    const descriptionId = ariaDescription ? `${id}-description` : void 0;
+    const wrapperClass = useMemo(
+      () => combineClassNames(
+        classMap.textArea,
+        classMap[theme],
+        classMap[state],
+        outline && classMap.outline,
+        disabled && classMap.disabled,
+        shadow && classMap[`shadow${capitalize(shadow)}`],
+        rounding && classMap[`round${capitalize(rounding)}`],
+        className
+      ),
+      [classMap, outline, disabled, rounding, shadow, className]
+    );
+    return /* @__PURE__ */ jsxs("div", { className: wrapperClass, "data-testid": testId, children: [
+      Icon && /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: classMap.iconContainer,
+          "aria-hidden": "true",
+          "data-testid": `${testId}-icon`,
+          children: /* @__PURE__ */ jsx(Icon, {})
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "textarea",
+        {
+          ref,
+          id,
+          placeholder,
+          "aria-label": ariaLabel || placeholder,
+          "aria-describedby": descriptionId,
+          autoComplete,
+          readOnly,
+          disabled,
+          style: { height },
+          className: classMap.textInput,
+          "data-testid": `${testId}-input`,
+          ...props
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: classMap.customResizeHandle,
+          "aria-hidden": "true",
+          "data-testid": `${testId}-resize-handle`
+        }
+      ),
+      ariaDescription && /* @__PURE__ */ jsx(
+        "span",
+        {
+          id: descriptionId,
+          className: "sr_only",
+          "data-testid": `${testId}-description`,
+          children: ariaDescription
+        }
+      )
+    ] });
+  }
+);
+TextAreaBase.displayName = "TextAreaBase";
+const classes = {
+  textArea: "textArea",
+  textInput: "textArea_textInput",
+  icon: "textArea_icon",
+  primary: "textArea_primary",
+  secondary: "textArea_secondary",
+  tertiary: "textArea_tertiary",
+  quaternary: "textArea_quaternary",
+  success: "textArea_success",
+  error: "textArea_error",
+  warning: "textArea_warning",
+  clear: "textArea_clear",
+  outline: "textArea_outline",
+  disabled: "textArea_disabled",
+  errorMessage: "textArea_errorMessage",
+  iconContainer: "textArea_iconContainer",
+  errorMessageContainer: "textArea_errorMessageContainer",
+  shadowNone: "textArea_shadow-None",
+  shadowLight: "textArea_shadow-Light",
+  shadowMedium: "textArea_shadow-Medium",
+  shadowStrong: "textArea_shadow-Strong",
+  shadowIntense: "textArea_shadow-Intense",
+  roundNone: "textArea_round-None",
+  roundSmall: "textArea_round-Small",
+  roundMedium: "textArea_round-Medium",
+  roundLarge: "textArea_round-Large"
+};
+const TextArea = forwardRef(
+  (props, ref) => {
+    return /* @__PURE__ */ jsx(TextAreaBase, { ...props, ref, classMap: classes });
+  }
+);
+TextArea.displayName = "TextArea";
+export {
+  TextArea as T
+};
+//# sourceMappingURL=TextArea-B88b8dFf.js.map

package/dist/core/TextArea-B88b8dFf.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea-B88b8dFf.js","sources":["../../src/components/TextArea/TextAreaBase.tsx","../../src/components/TextArea/core/TextArea.tsx"],"sourcesContent":["import { forwardRef, useId, useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { TextAreaProps } from \"./TextArea.types\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst TextAreaBase = forwardRef<\r\n  HTMLTextAreaElement,\r\n  TextAreaProps & { classMap: Record<string, string> }\r\n>(\r\n  (\r\n    {\r\n      icon: Icon,\r\n      placeholder = \"Enter text\",\r\n      readOnly = false,\r\n      outline = false,\r\n      autoComplete = \"off\",\r\n      theme = getDefaultTheme(),\r\n      rounding = getDefaultRounding(),\r\n      shadow = getDefaultShadow(),\r\n      state = \"\",\r\n      ariaLabel,\r\n      ariaDescription,\r\n      disabled = false,\r\n      height,\r\n      classMap,\r\n      className = \"\",\r\n      \"data-testid\": testId = \"text-area\",\r\n      ...props\r\n    },\r\n    ref\r\n  ) => {\r\n    const id = useId();\r\n    const descriptionId = ariaDescription ? `${id}-description` : undefined;\r\n\r\n    const wrapperClass = useMemo(\r\n      () =>\r\n        combineClassNames(\r\n          classMap.textArea,\r\n          classMap[theme],\r\n          classMap[state],\r\n          outline && classMap.outline,\r\n          disabled && classMap.disabled,\r\n          shadow && classMap[`shadow${capitalize(shadow)}`],\r\n          rounding && classMap[`round${capitalize(rounding)}`],\r\n          className\r\n        ),\r\n      [classMap, outline, disabled, rounding, shadow, className]\r\n    );\r\n\r\n    return (\r\n      <div className={wrapperClass} data-testid={testId}>\r\n        {Icon && (\r\n          <div\r\n            className={classMap.iconContainer}\r\n            aria-hidden=\"true\"\r\n            data-testid={`${testId}-icon`}\r\n          >\r\n            <Icon />\r\n          </div>\r\n        )}\r\n\r\n        <textarea\r\n          ref={ref}\r\n          id={id}\r\n          placeholder={placeholder}\r\n          aria-label={ariaLabel || placeholder}\r\n          aria-describedby={descriptionId}\r\n          autoComplete={autoComplete}\r\n          readOnly={readOnly}\r\n          disabled={disabled}\r\n          style={{ height }}\r\n          className={classMap.textInput}\r\n          data-testid={`${testId}-input`}\r\n          {...props}\r\n        />\r\n\r\n        <div\r\n          className={classMap.customResizeHandle}\r\n          aria-hidden=\"true\"\r\n          data-testid={`${testId}-resize-handle`}\r\n        />\r\n\r\n        {ariaDescription && (\r\n          <span\r\n            id={descriptionId}\r\n            className={\"sr_only\"}\r\n            data-testid={`${testId}-description`}\r\n          >\r\n            {ariaDescription}\r\n          </span>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n);\r\n\r\nTextAreaBase.displayName = \"TextAreaBase\";\r\n\r\nexport default TextAreaBase;\r\n","import { forwardRef } from \"react\";\r\nimport TextAreaBase from \"../TextAreaBase\";\r\nimport type { TextAreaProps } from \"../TextArea.types\";\r\nimport \"./TextArea.scss\";\r\n\r\nconst classes = {\r\n  textArea: \"textArea\",\r\n  textInput: \"textArea_textInput\",\r\n  icon: \"textArea_icon\",\r\n\r\n  primary: \"textArea_primary\",\r\n  secondary: \"textArea_secondary\",\r\n  tertiary: \"textArea_tertiary\",\r\n  quaternary: \"textArea_quaternary\",\r\n\r\n  success: \"textArea_success\",\r\n  error: \"textArea_error\",\r\n  warning: \"textArea_warning\",\r\n\r\n  clear: \"textArea_clear\",\r\n\r\n  outline: \"textArea_outline\",\r\n\r\n  disabled: \"textArea_disabled\",\r\n\r\n  errorMessage: \"textArea_errorMessage\",\r\n  iconContainer: \"textArea_iconContainer\",\r\n  errorMessageContainer: \"textArea_errorMessageContainer\",\r\n\r\n  shadowNone: \"textArea_shadow-None\",\r\n  shadowLight: \"textArea_shadow-Light\",\r\n  shadowMedium: \"textArea_shadow-Medium\",\r\n  shadowStrong: \"textArea_shadow-Strong\",\r\n  shadowIntense: \"textArea_shadow-Intense\",\r\n\r\n  roundNone: \"textArea_round-None\",\r\n  roundSmall: \"textArea_round-Small\",\r\n  roundMedium: \"textArea_round-Medium\",\r\n  roundLarge: \"textArea_round-Large\",\r\n};\r\n\r\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\r\n  (props, ref) => {\r\n    return <TextAreaBase {...props} ref={ref} classMap={classes} />;\r\n  }\r\n);\r\n\r\nTextArea.displayName = \"TextArea\";\r\n\r\nexport default TextArea;\r\n"],"names":[],"mappings":";;;;;AAUA,MAAM,eAAe;AAAA,EAInB,CACE;AAAA,IACE,MAAM;AAAA,IACN,cAAc;AAAA,IACd,WAAW;AAAA,IACX,UAAU;AAAA,IACV,eAAe;AAAA,IACf,QAAQ,gBAAgB;AAAA,IACxB,WAAW,mBAAmB;AAAA,IAC9B,SAAS,iBAAiB;AAAA,IAC1B,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,eAAe,SAAS;AAAA,IACxB,GAAG;AAAA,KAEL,QACG;AACH,UAAM,KAAK,MAAM;AACjB,UAAM,gBAAgB,kBAAkB,GAAG,EAAE,iBAAiB;AAE9D,UAAM,eAAe;AAAA,MACnB,MACE;AAAA,QACE,SAAS;AAAA,QACT,SAAS,KAAK;AAAA,QACd,SAAS,KAAK;AAAA,QACd,WAAW,SAAS;AAAA,QACpB,YAAY,SAAS;AAAA,QACrB,UAAU,SAAS,SAAS,WAAW,MAAM,CAAC,EAAE;AAAA,QAChD,YAAY,SAAS,QAAQ,WAAW,QAAQ,CAAC,EAAE;AAAA,QACnD;AAAA,MACF;AAAA,MACF,CAAC,UAAU,SAAS,UAAU,UAAU,QAAQ,SAAS;AAAA,IAC3D;AAEA,WACG,qBAAA,OAAA,EAAI,WAAW,cAAc,eAAa,QACxC,UAAA;AAAA,MACC,QAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,SAAS;AAAA,UACpB,eAAY;AAAA,UACZ,eAAa,GAAG,MAAM;AAAA,UAEtB,8BAAC,MAAK,CAAA,CAAA;AAAA,QAAA;AAAA,MACR;AAAA,MAGF;AAAA,QAAC;AAAA,QAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA,cAAY,aAAa;AAAA,UACzB,oBAAkB;AAAA,UAClB;AAAA,UACA;AAAA,UACA;AAAA,UACA,OAAO,EAAE,OAAO;AAAA,UAChB,WAAW,SAAS;AAAA,UACpB,eAAa,GAAG,MAAM;AAAA,UACrB,GAAG;AAAA,QAAA;AAAA,MACN;AAAA,MAEA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,SAAS;AAAA,UACpB,eAAY;AAAA,UACZ,eAAa,GAAG,MAAM;AAAA,QAAA;AAAA,MACxB;AAAA,MAEC,mBACC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAI;AAAA,UACJ,WAAW;AAAA,UACX,eAAa,GAAG,MAAM;AAAA,UAErB,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,GAEJ;AAAA,EAAA;AAGN;AAEA,aAAa,cAAc;AChG3B,MAAM,UAAU;AAAA,EACd,UAAU;AAAA,EACV,WAAW;AAAA,EACX,MAAM;AAAA,EAEN,SAAS;AAAA,EACT,WAAW;AAAA,EACX,UAAU;AAAA,EACV,YAAY;AAAA,EAEZ,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EAET,OAAO;AAAA,EAEP,SAAS;AAAA,EAET,UAAU;AAAA,EAEV,cAAc;AAAA,EACd,eAAe;AAAA,EACf,uBAAuB;AAAA,EAEvB,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,cAAc;AAAA,EACd,eAAe;AAAA,EAEf,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,YAAY;AACd;AAEA,MAAM,WAAW;AAAA,EACf,CAAC,OAAO,QAAQ;AACd,+BAAQ,cAAc,EAAA,GAAG,OAAO,KAAU,UAAU,SAAS;AAAA,EAAA;AAEjE;AAEA,SAAS,cAAc;"}

package/dist/core/TextArea-CxJexFDv.cjs

@@ -0,0 +1,124 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const classNames = require("./classNames-BcWMx052.cjs");
+const capitalize = require("./capitalize-DoV-nOmN.cjs");
+const borealStyleConfig = require("./boreal-style-config-Rr5d5Qts.cjs");
+const TextAreaBase = React.forwardRef(
+  ({
+    icon: Icon,
+    placeholder = "Enter text",
+    readOnly = false,
+    outline = false,
+    autoComplete = "off",
+    theme = borealStyleConfig.getDefaultTheme(),
+    rounding = borealStyleConfig.getDefaultRounding(),
+    shadow = borealStyleConfig.getDefaultShadow(),
+    state = "",
+    ariaLabel,
+    ariaDescription,
+    disabled = false,
+    height,
+    classMap,
+    className = "",
+    "data-testid": testId = "text-area",
+    ...props
+  }, ref) => {
+    const id = React.useId();
+    const descriptionId = ariaDescription ? `${id}-description` : void 0;
+    const wrapperClass = React.useMemo(
+      () => classNames.combineClassNames(
+        classMap.textArea,
+        classMap[theme],
+        classMap[state],
+        outline && classMap.outline,
+        disabled && classMap.disabled,
+        shadow && classMap[`shadow${capitalize.capitalize(shadow)}`],
+        rounding && classMap[`round${capitalize.capitalize(rounding)}`],
+        className
+      ),
+      [classMap, outline, disabled, rounding, shadow, className]
+    );
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: wrapperClass, "data-testid": testId, children: [
+      Icon && /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: classMap.iconContainer,
+          "aria-hidden": "true",
+          "data-testid": `${testId}-icon`,
+          children: /* @__PURE__ */ jsxRuntime.jsx(Icon, {})
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "textarea",
+        {
+          ref,
+          id,
+          placeholder,
+          "aria-label": ariaLabel || placeholder,
+          "aria-describedby": descriptionId,
+          autoComplete,
+          readOnly,
+          disabled,
+          style: { height },
+          className: classMap.textInput,
+          "data-testid": `${testId}-input`,
+          ...props
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: classMap.customResizeHandle,
+          "aria-hidden": "true",
+          "data-testid": `${testId}-resize-handle`
+        }
+      ),
+      ariaDescription && /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          id: descriptionId,
+          className: "sr_only",
+          "data-testid": `${testId}-description`,
+          children: ariaDescription
+        }
+      )
+    ] });
+  }
+);
+TextAreaBase.displayName = "TextAreaBase";
+const classes = {
+  textArea: "textArea",
+  textInput: "textArea_textInput",
+  icon: "textArea_icon",
+  primary: "textArea_primary",
+  secondary: "textArea_secondary",
+  tertiary: "textArea_tertiary",
+  quaternary: "textArea_quaternary",
+  success: "textArea_success",
+  error: "textArea_error",
+  warning: "textArea_warning",
+  clear: "textArea_clear",
+  outline: "textArea_outline",
+  disabled: "textArea_disabled",
+  errorMessage: "textArea_errorMessage",
+  iconContainer: "textArea_iconContainer",
+  errorMessageContainer: "textArea_errorMessageContainer",
+  shadowNone: "textArea_shadow-None",
+  shadowLight: "textArea_shadow-Light",
+  shadowMedium: "textArea_shadow-Medium",
+  shadowStrong: "textArea_shadow-Strong",
+  shadowIntense: "textArea_shadow-Intense",
+  roundNone: "textArea_round-None",
+  roundSmall: "textArea_round-Small",
+  roundMedium: "textArea_round-Medium",
+  roundLarge: "textArea_round-Large"
+};
+const TextArea = React.forwardRef(
+  (props, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(TextAreaBase, { ...props, ref, classMap: classes });
+  }
+);
+TextArea.displayName = "TextArea";
+exports.TextArea = TextArea;
+//# sourceMappingURL=TextArea-CxJexFDv.cjs.map

package/dist/core/TextArea-CxJexFDv.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea-CxJexFDv.cjs","sources":["../../src/components/TextArea/TextAreaBase.tsx","../../src/components/TextArea/core/TextArea.tsx"],"sourcesContent":["import { forwardRef, useId, useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { TextAreaProps } from \"./TextArea.types\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst TextAreaBase = forwardRef<\r\n  HTMLTextAreaElement,\r\n  TextAreaProps & { classMap: Record<string, string> }\r\n>(\r\n  (\r\n    {\r\n      icon: Icon,\r\n      placeholder = \"Enter text\",\r\n      readOnly = false,\r\n      outline = false,\r\n      autoComplete = \"off\",\r\n      theme = getDefaultTheme(),\r\n      rounding = getDefaultRounding(),\r\n      shadow = getDefaultShadow(),\r\n      state = \"\",\r\n      ariaLabel,\r\n      ariaDescription,\r\n      disabled = false,\r\n      height,\r\n      classMap,\r\n      className = \"\",\r\n      \"data-testid\": testId = \"text-area\",\r\n      ...props\r\n    },\r\n    ref\r\n  ) => {\r\n    const id = useId();\r\n    const descriptionId = ariaDescription ? `${id}-description` : undefined;\r\n\r\n    const wrapperClass = useMemo(\r\n      () =>\r\n        combineClassNames(\r\n          classMap.textArea,\r\n          classMap[theme],\r\n          classMap[state],\r\n          outline && classMap.outline,\r\n          disabled && classMap.disabled,\r\n          shadow && classMap[`shadow${capitalize(shadow)}`],\r\n          rounding && classMap[`round${capitalize(rounding)}`],\r\n          className\r\n        ),\r\n      [classMap, outline, disabled, rounding, shadow, className]\r\n    );\r\n\r\n    return (\r\n      <div className={wrapperClass} data-testid={testId}>\r\n        {Icon && (\r\n          <div\r\n            className={classMap.iconContainer}\r\n            aria-hidden=\"true\"\r\n            data-testid={`${testId}-icon`}\r\n          >\r\n            <Icon />\r\n          </div>\r\n        )}\r\n\r\n        <textarea\r\n          ref={ref}\r\n          id={id}\r\n          placeholder={placeholder}\r\n          aria-label={ariaLabel || placeholder}\r\n          aria-describedby={descriptionId}\r\n          autoComplete={autoComplete}\r\n          readOnly={readOnly}\r\n          disabled={disabled}\r\n          style={{ height }}\r\n          className={classMap.textInput}\r\n          data-testid={`${testId}-input`}\r\n          {...props}\r\n        />\r\n\r\n        <div\r\n          className={classMap.customResizeHandle}\r\n          aria-hidden=\"true\"\r\n          data-testid={`${testId}-resize-handle`}\r\n        />\r\n\r\n        {ariaDescription && (\r\n          <span\r\n            id={descriptionId}\r\n            className={\"sr_only\"}\r\n            data-testid={`${testId}-description`}\r\n          >\r\n            {ariaDescription}\r\n          </span>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n);\r\n\r\nTextAreaBase.displayName = \"TextAreaBase\";\r\n\r\nexport default TextAreaBase;\r\n","import { forwardRef } from \"react\";\r\nimport TextAreaBase from \"../TextAreaBase\";\r\nimport type { TextAreaProps } from \"../TextArea.types\";\r\nimport \"./TextArea.scss\";\r\n\r\nconst classes = {\r\n  textArea: \"textArea\",\r\n  textInput: \"textArea_textInput\",\r\n  icon: \"textArea_icon\",\r\n\r\n  primary: \"textArea_primary\",\r\n  secondary: \"textArea_secondary\",\r\n  tertiary: \"textArea_tertiary\",\r\n  quaternary: \"textArea_quaternary\",\r\n\r\n  success: \"textArea_success\",\r\n  error: \"textArea_error\",\r\n  warning: \"textArea_warning\",\r\n\r\n  clear: \"textArea_clear\",\r\n\r\n  outline: \"textArea_outline\",\r\n\r\n  disabled: \"textArea_disabled\",\r\n\r\n  errorMessage: \"textArea_errorMessage\",\r\n  iconContainer: \"textArea_iconContainer\",\r\n  errorMessageContainer: \"textArea_errorMessageContainer\",\r\n\r\n  shadowNone: \"textArea_shadow-None\",\r\n  shadowLight: \"textArea_shadow-Light\",\r\n  shadowMedium: \"textArea_shadow-Medium\",\r\n  shadowStrong: \"textArea_shadow-Strong\",\r\n  shadowIntense: \"textArea_shadow-Intense\",\r\n\r\n  roundNone: \"textArea_round-None\",\r\n  roundSmall: \"textArea_round-Small\",\r\n  roundMedium: \"textArea_round-Medium\",\r\n  roundLarge: \"textArea_round-Large\",\r\n};\r\n\r\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\r\n  (props, ref) => {\r\n    return <TextAreaBase {...props} ref={ref} classMap={classes} />;\r\n  }\r\n);\r\n\r\nTextArea.displayName = \"TextArea\";\r\n\r\nexport default TextArea;\r\n"],"names":["forwardRef","getDefaultTheme","getDefaultRounding","getDefaultShadow","useId","useMemo","combineClassNames","capitalize","jsxs","jsx"],"mappings":"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"}

package/dist/core/TextArea.cjs.js

@@ -0,0 +1,4 @@
+"use strict";
+const TextArea = require("./TextArea-CxJexFDv.cjs");
+module.exports = TextArea.TextArea;
+//# sourceMappingURL=TextArea.cjs.js.map

package/dist/core/TextArea.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/core/TextArea.js

@@ -0,0 +1,5 @@
+import { T } from "./TextArea-B88b8dFf.js";
+export {
+  T as default
+};
+//# sourceMappingURL=TextArea.js.map

package/dist/core/TextArea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}