boreal-ui 0.0.34 → 0.0.36

package/dist/core/Taginput-C_JJRoDF.js

@@ -0,0 +1,311 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { I as IconButton } from "./IconButton-DY1ppFX-.js";
+import { T as TextInput } from "./TextInput-D38TZ4Pl.js";
+import { useId, useState, useRef, 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. Use arrow keys to navigate suggestions; Enter to select; Escape to close. Backspace removes the last tag when the field is empty.",
+  classMap,
+  IconButton: IconButton2,
+  TextInput: TextInput2
+}) => {
+  const uid = useId();
+  const inputId = `${testId}-input-${uid}`;
+  const descId = `${testId}-desc-${uid}`;
+  const labelId = `${testId}-label-${uid}`;
+  const listboxId = `${testId}-listbox-${uid}`;
+  const statusId = `${testId}-status-${uid}`;
+  const [inputValue, setInputValue] = useState("");
+  const [tagList, setTagList] = useState(tags);
+  const [lastAction, setLastAction] = useState("");
+  const [suggestions, setSuggestions] = useState([]);
+  const [open, setOpen] = useState(false);
+  const [activeIndex, setActiveIndex] = useState(-1);
+  const debounceRef = useRef(null);
+  const hasTag = (val) => tagList.some((t) => t.toLowerCase() === val.toLowerCase());
+  useEffect(() => {
+    if (!fetchSuggestions) {
+      setSuggestions([]);
+      setOpen(false);
+      return;
+    }
+    if (debounceRef.current) clearTimeout(debounceRef.current);
+    const query = inputValue.trim();
+    if (!query) {
+      setSuggestions([]);
+      setOpen(false);
+      setActiveIndex(-1);
+      return;
+    }
+    debounceRef.current = setTimeout(async () => {
+      try {
+        const result = await fetchSuggestions(query);
+        setSuggestions(result || []);
+        setOpen(((result == null ? void 0 : result.length) ?? 0) > 0);
+        setActiveIndex(((result == null ? void 0 : result.length) ?? 0) > 0 ? 0 : -1);
+      } catch {
+        setSuggestions([]);
+        setOpen(false);
+        setActiveIndex(-1);
+      }
+    }, debounceMs);
+    return () => {
+      if (debounceRef.current) clearTimeout(debounceRef.current);
+    };
+  }, [inputValue, fetchSuggestions, debounceMs]);
+  const addTag = (raw) => {
+    const newTag = raw.trim();
+    if (!newTag || hasTag(newTag)) return false;
+    const updated = [...tagList, newTag];
+    setTagList(updated);
+    onChange == null ? void 0 : onChange(updated);
+    setLastAction(`Added tag ${newTag}.`);
+    return true;
+  };
+  const removeTag = (tag) => {
+    const updated = tagList.filter((t) => t !== tag);
+    setTagList(updated);
+    onChange == null ? void 0 : onChange(updated);
+    setLastAction(`Removed tag ${tag}.`);
+  };
+  const handleKeyDown = (event) => {
+    const { key } = event;
+    if (open && suggestions.length > 0) {
+      if (key === "ArrowDown") {
+        event.preventDefault();
+        setActiveIndex((i) => (i + 1) % suggestions.length);
+        return;
+      }
+      if (key === "ArrowUp") {
+        event.preventDefault();
+        setActiveIndex(
+          (i) => (i - 1 + suggestions.length) % suggestions.length
+        );
+        return;
+      }
+      if (key === "Enter") {
+        event.preventDefault();
+        const choice = suggestions[activeIndex];
+        if (choice && addTag(choice)) {
+          setInputValue("");
+        }
+        setSuggestions([]);
+        setOpen(false);
+        setActiveIndex(-1);
+        return;
+      }
+      if (key === "Escape") {
+        event.preventDefault();
+        setSuggestions([]);
+        setOpen(false);
+        setActiveIndex(-1);
+        return;
+      }
+    }
+    if (key === "Enter" || key === ",") {
+      event.preventDefault();
+      if (addTag(inputValue)) setInputValue("");
+      setSuggestions([]);
+      setOpen(false);
+      setActiveIndex(-1);
+      return;
+    }
+    if (key === "Backspace" && inputValue === "" && tagList.length > 0) {
+      const last = tagList[tagList.length - 1];
+      removeTag(last);
+    }
+  };
+  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, shadow, rounding]
+  );
+  const handleSuggestionClick = (suggestion) => {
+    if (addTag(suggestion)) setInputValue("");
+    setSuggestions([]);
+    setOpen(false);
+    setActiveIndex(-1);
+  };
+  const activeOptionId = open && activeIndex >= 0 ? `${listboxId}-opt-${activeIndex}` : void 0;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: wrapperClass,
+      role: "group",
+      "aria-labelledby": labelId,
+      "aria-describedby": `${descId} ${statusId}`,
+      "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, "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(
+                IconButton2,
+                {
+                  type: "button",
+                  "aria-label": `Remove tag ${tag}`,
+                  className: classMap.removeButton,
+                  onClick: () => removeTag(tag),
+                  "data-testid": `${testId}-remove-${index}`,
+                  icon: CloseIcon,
+                  size: "small",
+                  theme: "clear",
+                  shadow: "none",
+                  iconClassName: classMap.removeButtonIcon
+                }
+              )
+            ]
+          },
+          `${tag}-${index}`
+        )) }),
+        /* @__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: handleKeyDown,
+            autoComplete: "off",
+            role: "combobox",
+            "aria-autocomplete": "list",
+            "aria-expanded": open,
+            "aria-controls": listboxId,
+            "aria-activedescendant": activeOptionId,
+            "aria-label": "Add new tag",
+            "aria-describedby": `${descId} ${statusId}`,
+            "data-testid": `${testId}-input`
+          }
+        ) }),
+        open && suggestions.length > 0 && /* @__PURE__ */ jsx(
+          "ul",
+          {
+            className: classMap.suggestionList,
+            role: "listbox",
+            id: listboxId,
+            "aria-label": "Tag suggestions",
+            "data-testid": `${testId}-suggestions`,
+            children: suggestions.map((suggestion, index) => /* @__PURE__ */ jsx(
+              "li",
+              {
+                id: `${listboxId}-opt-${index}`,
+                className: combineClassNames(
+                  classMap.suggestionItem,
+                  index === activeIndex && (classMap.active || "")
+                ),
+                role: "option",
+                "aria-selected": index === activeIndex,
+                onMouseDown: (e) => e.preventDefault(),
+                onClick: () => handleSuggestionClick(suggestion),
+                "data-testid": `${testId}-suggestion-${index}`,
+                children: suggestion
+              },
+              `${suggestion}-${index}`
+            ))
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { id: statusId, "aria-live": "polite", className: "sr_only", children: [
+          open && suggestions.length > 0 ? `${suggestions.length} suggestion${suggestions.length === 1 ? "" : "s"} available.` : "",
+          lastAction
+        ] })
+      ]
+    }
+  );
+};
+TagInputBase.displayName = "TagInputBase";
+const classes = {
+  tagInput: "tag_input",
+  tagContainer: "tag_input_tag_container",
+  tag: "tag_input_tag",
+  tagLabel: "tag_input_tag_label",
+  removeButton: "tag_input_remove_button",
+  removeButtonIcon: "tag_input_remove_button_icon",
+  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,
+      TextInput
+    }
+  );
+};
+export {
+  TagInput as T
+};
+//# sourceMappingURL=Taginput-C_JJRoDF.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Taginput-C_JJRoDF.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  useRef,\r\n} from \"react\";\r\nimport { TagInputBaseProps } 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<TagInputBaseProps> = ({\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. Use arrow keys to navigate suggestions; Enter to select; Escape to close. Backspace removes the last tag when the field is empty.\",\r\n  classMap,\r\n  IconButton,\r\n  TextInput,\r\n}) => {\r\n  const uid = useId();\r\n  const inputId = `${testId}-input-${uid}`;\r\n  const descId = `${testId}-desc-${uid}`;\r\n  const labelId = `${testId}-label-${uid}`;\r\n  const listboxId = `${testId}-listbox-${uid}`;\r\n  const statusId = `${testId}-status-${uid}`;\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  const [suggestions, setSuggestions] = useState<string[]>([]);\r\n  const [open, setOpen] = useState(false);\r\n  const [activeIndex, setActiveIndex] = useState<number>(-1);\r\n\r\n  const debounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);\r\n\r\n  const hasTag = (val: string) =>\r\n    tagList.some((t) => t.toLowerCase() === val.toLowerCase());\r\n\r\n  useEffect(() => {\r\n    if (!fetchSuggestions) {\r\n      setSuggestions([]);\r\n      setOpen(false);\r\n      return;\r\n    }\r\n    if (debounceRef.current) clearTimeout(debounceRef.current);\r\n\r\n    const query = inputValue.trim();\r\n    if (!query) {\r\n      setSuggestions([]);\r\n      setOpen(false);\r\n      setActiveIndex(-1);\r\n      return;\r\n    }\r\n\r\n    debounceRef.current = setTimeout(async () => {\r\n      try {\r\n        const result = await fetchSuggestions(query);\r\n        setSuggestions(result || []);\r\n        setOpen((result?.length ?? 0) > 0);\r\n        setActiveIndex((result?.length ?? 0) > 0 ? 0 : -1);\r\n      } catch {\r\n        setSuggestions([]);\r\n        setOpen(false);\r\n        setActiveIndex(-1);\r\n      }\r\n    }, debounceMs);\r\n\r\n    return () => {\r\n      if (debounceRef.current) clearTimeout(debounceRef.current);\r\n    };\r\n  }, [inputValue, fetchSuggestions, debounceMs]);\r\n\r\n  const addTag = (raw: string) => {\r\n    const newTag = raw.trim();\r\n    if (!newTag || hasTag(newTag)) return false;\r\n    const updated = [...tagList, newTag];\r\n    setTagList(updated);\r\n    onChange?.(updated);\r\n    setLastAction(`Added tag ${newTag}.`);\r\n    return true;\r\n  };\r\n\r\n  const removeTag = (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 handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\r\n    const { key } = event;\r\n\r\n    if (open && suggestions.length > 0) {\r\n      if (key === \"ArrowDown\") {\r\n        event.preventDefault();\r\n        setActiveIndex((i) => (i + 1) % suggestions.length);\r\n        return;\r\n      }\r\n      if (key === \"ArrowUp\") {\r\n        event.preventDefault();\r\n        setActiveIndex(\r\n          (i) => (i - 1 + suggestions.length) % suggestions.length\r\n        );\r\n        return;\r\n      }\r\n      if (key === \"Enter\") {\r\n        event.preventDefault();\r\n        const choice = suggestions[activeIndex];\r\n        if (choice && addTag(choice)) {\r\n          setInputValue(\"\");\r\n        }\r\n        setSuggestions([]);\r\n        setOpen(false);\r\n        setActiveIndex(-1);\r\n        return;\r\n      }\r\n      if (key === \"Escape\") {\r\n        event.preventDefault();\r\n        setSuggestions([]);\r\n        setOpen(false);\r\n        setActiveIndex(-1);\r\n        return;\r\n      }\r\n    }\r\n\r\n    if (key === \"Enter\" || key === \",\") {\r\n      event.preventDefault();\r\n      if (addTag(inputValue)) setInputValue(\"\");\r\n      setSuggestions([]);\r\n      setOpen(false);\r\n      setActiveIndex(-1);\r\n      return;\r\n    }\r\n\r\n    if (key === \"Backspace\" && inputValue === \"\" && tagList.length > 0) {\r\n      const last = tagList[tagList.length - 1];\r\n      removeTag(last);\r\n    }\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, shadow, rounding]\r\n  );\r\n\r\n  const handleSuggestionClick = (suggestion: string) => {\r\n    if (addTag(suggestion)) setInputValue(\"\");\r\n    setSuggestions([]);\r\n    setOpen(false);\r\n    setActiveIndex(-1);\r\n  };\r\n\r\n  const activeOptionId =\r\n    open && activeIndex >= 0 ? `${listboxId}-opt-${activeIndex}` : undefined;\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} ${statusId}`}\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 className={classMap.tagContainer} data-testid={`${testId}-list`}>\r\n        {tagList.map((tag, index) => (\r\n          <li\r\n            key={`${tag}-${index}`}\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={() => removeTag(tag)}\r\n              data-testid={`${testId}-remove-${index}`}\r\n              icon={CloseIcon}\r\n              size=\"small\"\r\n              theme=\"clear\"\r\n              shadow=\"none\"\r\n              iconClassName={classMap.removeButtonIcon}\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={handleKeyDown}\r\n          autoComplete=\"off\"\r\n          role=\"combobox\"\r\n          aria-autocomplete=\"list\"\r\n          aria-expanded={open}\r\n          aria-controls={listboxId}\r\n          aria-activedescendant={activeOptionId}\r\n          aria-label=\"Add new tag\"\r\n          aria-describedby={`${descId} ${statusId}`}\r\n          data-testid={`${testId}-input`}\r\n        />\r\n      </div>\r\n\r\n      {open && suggestions.length > 0 && (\r\n        <ul\r\n          className={classMap.suggestionList}\r\n          role=\"listbox\"\r\n          id={listboxId}\r\n          aria-label=\"Tag suggestions\"\r\n          data-testid={`${testId}-suggestions`}\r\n        >\r\n          {suggestions.map((suggestion, index) => (\r\n            <li\r\n              key={`${suggestion}-${index}`}\r\n              id={`${listboxId}-opt-${index}`}\r\n              className={combineClassNames(\r\n                classMap.suggestionItem,\r\n                index === activeIndex && (classMap.active || \"\")\r\n              )}\r\n              role=\"option\"\r\n              aria-selected={index === activeIndex}\r\n              onMouseDown={(e) => e.preventDefault()}\r\n              onClick={() => handleSuggestionClick(suggestion)}\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 id={statusId} aria-live=\"polite\" className=\"sr_only\">\r\n        {open && suggestions.length > 0\r\n          ? `${suggestions.length} suggestion${suggestions.length === 1 ? \"\" : \"s\"} available.`\r\n          : \"\"}\r\n        {lastAction}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nTagInputBase.displayName = \"TagInputBase\";\r\nexport default TagInputBase;\r\n","import React from \"react\";\r\nimport \"./Taginput.scss\";\r\nimport IconButton from \"../../IconButton/core/IconButton\";\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  removeButtonIcon: \"tag_input_remove_button_icon\",\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":["IconButton","TextInput"],"mappings":"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"}

package/dist/core/Taginput-kqeTeVJY.cjs

@@ -0,0 +1,310 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const IconButton = require("./IconButton-Cs4PHptF.cjs");
+const TextInput = require("./TextInput-WY4O9Zya.cjs");
+const React = require("react");
+const CloseIcon = require("./CloseIcon-DSnN6ggf.cjs");
+const classNames = require("./classNames-BcWMx052.cjs");
+const capitalize = require("./capitalize-DoV-nOmN.cjs");
+const borealStyleConfig = require("./boreal-style-config-Rr5d5Qts.cjs");
+const TagInputBase = ({
+  tags = [],
+  onChange,
+  fetchSuggestions,
+  debounceMs = 300,
+  placeholder = "Add a tag...",
+  theme = borealStyleConfig.getDefaultTheme(),
+  state = "",
+  size = borealStyleConfig.getDefaultSize(),
+  rounding = borealStyleConfig.getDefaultRounding(),
+  shadow = borealStyleConfig.getDefaultShadow(),
+  "data-testid": testId = "tag-input",
+  ariaDescription = "Type a tag and press Enter or comma to add. Use arrow keys to navigate suggestions; Enter to select; Escape to close. Backspace removes the last tag when the field is empty.",
+  classMap,
+  IconButton: IconButton2,
+  TextInput: TextInput2
+}) => {
+  const uid = React.useId();
+  const inputId = `${testId}-input-${uid}`;
+  const descId = `${testId}-desc-${uid}`;
+  const labelId = `${testId}-label-${uid}`;
+  const listboxId = `${testId}-listbox-${uid}`;
+  const statusId = `${testId}-status-${uid}`;
+  const [inputValue, setInputValue] = React.useState("");
+  const [tagList, setTagList] = React.useState(tags);
+  const [lastAction, setLastAction] = React.useState("");
+  const [suggestions, setSuggestions] = React.useState([]);
+  const [open, setOpen] = React.useState(false);
+  const [activeIndex, setActiveIndex] = React.useState(-1);
+  const debounceRef = React.useRef(null);
+  const hasTag = (val) => tagList.some((t) => t.toLowerCase() === val.toLowerCase());
+  React.useEffect(() => {
+    if (!fetchSuggestions) {
+      setSuggestions([]);
+      setOpen(false);
+      return;
+    }
+    if (debounceRef.current) clearTimeout(debounceRef.current);
+    const query = inputValue.trim();
+    if (!query) {
+      setSuggestions([]);
+      setOpen(false);
+      setActiveIndex(-1);
+      return;
+    }
+    debounceRef.current = setTimeout(async () => {
+      try {
+        const result = await fetchSuggestions(query);
+        setSuggestions(result || []);
+        setOpen(((result == null ? void 0 : result.length) ?? 0) > 0);
+        setActiveIndex(((result == null ? void 0 : result.length) ?? 0) > 0 ? 0 : -1);
+      } catch {
+        setSuggestions([]);
+        setOpen(false);
+        setActiveIndex(-1);
+      }
+    }, debounceMs);
+    return () => {
+      if (debounceRef.current) clearTimeout(debounceRef.current);
+    };
+  }, [inputValue, fetchSuggestions, debounceMs]);
+  const addTag = (raw) => {
+    const newTag = raw.trim();
+    if (!newTag || hasTag(newTag)) return false;
+    const updated = [...tagList, newTag];
+    setTagList(updated);
+    onChange == null ? void 0 : onChange(updated);
+    setLastAction(`Added tag ${newTag}.`);
+    return true;
+  };
+  const removeTag = (tag) => {
+    const updated = tagList.filter((t) => t !== tag);
+    setTagList(updated);
+    onChange == null ? void 0 : onChange(updated);
+    setLastAction(`Removed tag ${tag}.`);
+  };
+  const handleKeyDown = (event) => {
+    const { key } = event;
+    if (open && suggestions.length > 0) {
+      if (key === "ArrowDown") {
+        event.preventDefault();
+        setActiveIndex((i) => (i + 1) % suggestions.length);
+        return;
+      }
+      if (key === "ArrowUp") {
+        event.preventDefault();
+        setActiveIndex(
+          (i) => (i - 1 + suggestions.length) % suggestions.length
+        );
+        return;
+      }
+      if (key === "Enter") {
+        event.preventDefault();
+        const choice = suggestions[activeIndex];
+        if (choice && addTag(choice)) {
+          setInputValue("");
+        }
+        setSuggestions([]);
+        setOpen(false);
+        setActiveIndex(-1);
+        return;
+      }
+      if (key === "Escape") {
+        event.preventDefault();
+        setSuggestions([]);
+        setOpen(false);
+        setActiveIndex(-1);
+        return;
+      }
+    }
+    if (key === "Enter" || key === ",") {
+      event.preventDefault();
+      if (addTag(inputValue)) setInputValue("");
+      setSuggestions([]);
+      setOpen(false);
+      setActiveIndex(-1);
+      return;
+    }
+    if (key === "Backspace" && inputValue === "" && tagList.length > 0) {
+      const last = tagList[tagList.length - 1];
+      removeTag(last);
+    }
+  };
+  const wrapperClass = React.useMemo(
+    () => classNames.combineClassNames(
+      classMap.tagInput,
+      classMap[theme],
+      classMap[state],
+      classMap[size]
+    ),
+    [classMap, theme, state, size]
+  );
+  const tagClass = React.useMemo(
+    () => classNames.combineClassNames(
+      classMap.tag,
+      shadow && classMap[`shadow${capitalize.capitalize(shadow)}`],
+      rounding && classMap[`round${capitalize.capitalize(rounding)}`]
+    ),
+    [classMap, shadow, rounding]
+  );
+  const handleSuggestionClick = (suggestion) => {
+    if (addTag(suggestion)) setInputValue("");
+    setSuggestions([]);
+    setOpen(false);
+    setActiveIndex(-1);
+  };
+  const activeOptionId = open && activeIndex >= 0 ? `${listboxId}-opt-${activeIndex}` : void 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: wrapperClass,
+      role: "group",
+      "aria-labelledby": labelId,
+      "aria-describedby": `${descId} ${statusId}`,
+      "data-testid": testId,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("label", { id: labelId, className: "sr_only", children: "Tag Input" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            id: descId,
+            className: "sr_only",
+            "data-testid": `${testId}-description`,
+            children: ariaDescription
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: classMap.tagContainer, "data-testid": `${testId}-list`, children: tagList.map((tag, index) => /* @__PURE__ */ jsxRuntime.jsxs(
+          "li",
+          {
+            className: tagClass,
+            role: "listitem",
+            "data-testid": `${testId}-tag-${index}`,
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: classMap.tagLabel, children: tag }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                IconButton2,
+                {
+                  type: "button",
+                  "aria-label": `Remove tag ${tag}`,
+                  className: classMap.removeButton,
+                  onClick: () => removeTag(tag),
+                  "data-testid": `${testId}-remove-${index}`,
+                  icon: CloseIcon.CloseIcon,
+                  size: "small",
+                  theme: "clear",
+                  shadow: "none",
+                  iconClassName: classMap.removeButtonIcon
+                }
+              )
+            ]
+          },
+          `${tag}-${index}`
+        )) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: classMap.inputWrapper, children: /* @__PURE__ */ jsxRuntime.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: handleKeyDown,
+            autoComplete: "off",
+            role: "combobox",
+            "aria-autocomplete": "list",
+            "aria-expanded": open,
+            "aria-controls": listboxId,
+            "aria-activedescendant": activeOptionId,
+            "aria-label": "Add new tag",
+            "aria-describedby": `${descId} ${statusId}`,
+            "data-testid": `${testId}-input`
+          }
+        ) }),
+        open && suggestions.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+          "ul",
+          {
+            className: classMap.suggestionList,
+            role: "listbox",
+            id: listboxId,
+            "aria-label": "Tag suggestions",
+            "data-testid": `${testId}-suggestions`,
+            children: suggestions.map((suggestion, index) => /* @__PURE__ */ jsxRuntime.jsx(
+              "li",
+              {
+                id: `${listboxId}-opt-${index}`,
+                className: classNames.combineClassNames(
+                  classMap.suggestionItem,
+                  index === activeIndex && (classMap.active || "")
+                ),
+                role: "option",
+                "aria-selected": index === activeIndex,
+                onMouseDown: (e) => e.preventDefault(),
+                onClick: () => handleSuggestionClick(suggestion),
+                "data-testid": `${testId}-suggestion-${index}`,
+                children: suggestion
+              },
+              `${suggestion}-${index}`
+            ))
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { id: statusId, "aria-live": "polite", className: "sr_only", children: [
+          open && suggestions.length > 0 ? `${suggestions.length} suggestion${suggestions.length === 1 ? "" : "s"} available.` : "",
+          lastAction
+        ] })
+      ]
+    }
+  );
+};
+TagInputBase.displayName = "TagInputBase";
+const classes = {
+  tagInput: "tag_input",
+  tagContainer: "tag_input_tag_container",
+  tag: "tag_input_tag",
+  tagLabel: "tag_input_tag_label",
+  removeButton: "tag_input_remove_button",
+  removeButtonIcon: "tag_input_remove_button_icon",
+  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__ */ jsxRuntime.jsx(
+    TagInputBase,
+    {
+      ...props,
+      classMap: classes,
+      IconButton: IconButton.IconButton,
+      TextInput: TextInput.TextInput
+    }
+  );
+};
+exports.TagInput = TagInput;
+//# sourceMappingURL=Taginput-kqeTeVJY.cjs.map