@tcn/ui 0.12.5 → 0.13.0

package/dist/inputs/phone_number_input/sip_input.js

@@ -1,101 +1,103 @@
-import { jsxs as f, Fragment as z, jsx as e } from "react/jsx-runtime";
-import g, { useLayoutEffect as E } from "react";
-import { NotebookIcon as F } from "@tcn/icons/notebook_icon.js";
-import { Input as L } from "../input/input.js";
+import { jsxs as f, Fragment as E, jsx as e } from "react/jsx-runtime";
+import g, { useLayoutEffect as F } from "react";
+import { NotebookIcon as L } from "@tcn/icons/notebook_icon.js";
+import { Input as R } from "../input/input.js";
 import "../../actions/button/base_button/base_button.js";
 import "../../actions/button/button_group/button_group.js";
 import "../../actions/button/slim_button/slim_button.js";
-import { Button as R } from "../../actions/button/button/button.js";
+import { Button as j } from "../../actions/button/button/button.js";
 import "../../actions/toggle/toggle.js";
-import { InputGroup as j } from "../input_group/input_group.js";
-import w from "clsx";
-import { usePhoneContext as y } from "./phone_number_context.js";
-import { PhoneNumberCountrySelectAdapter as V } from "./phone_number_country_select_adapter.js";
-import { SuggestionList as _ } from "../suggestions/suggestion_list.js";
-function Z({
+import { ControlSet as w } from "../control_set/control_set.js";
+import y from "clsx";
+import { usePhoneContext as V } from "./phone_number_context.js";
+import { PhoneNumberCountrySelectAdapter as _ } from "./phone_number_country_select_adapter.js";
+import { SuggestionList as q } from "../suggestions/suggestion_list.js";
+function oo({
   disabled: n,
   countries: d,
   name: k,
-  "aria-label": B,
-  autoFocus: S,
-  placeholder: P
+  "aria-label": S,
+  autoFocus: B,
+  placeholder: P,
+  sipAutoComplete: b = "on"
 }) {
-  const i = g.useRef(null), [u, t] = g.useState(null), l = u != null, {
+  const i = g.useRef(null), [l, t] = g.useState(null), u = l != null, {
     phoneBook: s,
     setValue: r,
-    setCountry: b,
+    setCountry: C,
     ariaPhoneBookButtonLabel: I,
     sipAddress: p,
-    setSipAddress: c,
-    focusNumberInput: m,
+    setSipAddress: m,
+    focusNumberInput: c,
     setFocusNumberInput: a
-  } = y(), C = s.length > 0;
-  function x(o) {
-    t(l ? null : o.currentTarget);
+  } = V(), x = s.length > 0;
+  function A(o) {
+    t(u ? null : o.currentTarget);
   }
   function h() {
     t(null);
   }
-  function A(o) {
+  function N(o) {
     h(), a(!0), r(o);
   }
-  const N = d?.map((o) => ({
+  const O = d?.map((o) => ({
     value: o,
     label: o
   })) || [];
-  function O(o) {
-    o !== "SIP" && (c(p), a(!0), r(""), b(o || "US"));
-  }
   function v(o) {
-    c(o), r(`sip:${o}`);
+    o !== "SIP" && (m(p), a(!0), r(""), C(o || "US"));
+  }
+  function z(o) {
+    m(o), r(`sip:${o}`);
   }
-  return E(() => {
+  return F(() => {
     const o = i.current;
-    o == null || !m || requestAnimationFrame(() => {
+    o == null || !c || requestAnimationFrame(() => {
       o.value.length > 0 ? o.select() : o.focus();
     });
-  }, [m]), /* @__PURE__ */ f(z, { children: [
-    /* @__PURE__ */ f(j, { children: [
+  }, [c]), /* @__PURE__ */ f(E, { children: [
+    /* @__PURE__ */ f(w, { children: [
       /* @__PURE__ */ e(
-        V,
+        _,
         {
           value: "SIP",
-          onChange: O,
-          options: N,
+          onChange: v,
+          options: O,
           disabled: n
         }
       ),
       /* @__PURE__ */ e(
-        L,
+        R,
         {
           ref: i,
           value: p,
           disabled: n,
-          onChange: v,
+          onChange: z,
           name: k,
-          "aria-label": B,
-          autoFocus: S,
-          placeholder: P
+          "aria-label": S,
+          autoFocus: B,
+          placeholder: P,
+          autoComplete: b
         }
       ),
-      C && /* @__PURE__ */ e(
-        R,
+      x && /* @__PURE__ */ e(
+        j,
         {
           disabled: n,
-          className: w("tcn-input-group-slot", "tcn-phone-number-phone-book"),
+          className: y("tcn-control-set-item", "tcn-phone-number-phone-book"),
           "aria-label": I,
-          onClick: x,
+          onClick: A,
           size: "md",
-          children: /* @__PURE__ */ e(F, { size: "md" })
+          children: /* @__PURE__ */ e(L, { size: "md" })
         }
       )
     ] }),
     /* @__PURE__ */ e(
-      _,
+      q,
       {
-        open: l,
-        anchorElement: u,
-        onOptionSelect: A,
+        open: u,
+        anchorElement: l,
+        onOptionSelect: N,
         onClose: h,
         width: "300px",
         noSuggestionMessage: "No phone numbers found",
@@ -109,6 +111,6 @@ function Z({
   ] });
 }
 export {
-  Z as SipInput
+  oo as SipInput
 };
 //# sourceMappingURL=sip_input.js.map

package/dist/inputs/phone_number_input/sip_input.js.map

@@ -1 +1 @@
-{"version":3,"file":"sip_input.js","sources":["../../../src/inputs/phone_number_input/sip_input.tsx"],"sourcesContent":["import React, { useLayoutEffect } from 'react';\nimport { NotebookIcon } from '@tcn/icons/notebook_icon.js';\nimport { Input } from '../input/input.js';\nimport { Button } from '../../actions/index.js';\nimport { InputGroup } from '../input_group/input_group.js';\nimport clsx from 'clsx';\nimport { usePhoneContext } from './phone_number_context.js';\nimport type { CountryCode } from 'libphonenumber-js';\nimport {\n  PhoneNumberCountrySelectAdapter,\n  type CountryOption,\n} from './phone_number_country_select_adapter.js';\nimport { SuggestionList } from '../suggestions/suggestion_list.js';\n\nexport interface SipInputProps {\n  onChange: (value: string) => void;\n  countries?: CountryCode[];\n  disabled?: boolean;\n  name?: string;\n  'aria-label'?: string;\n  autoFocus?: boolean;\n  placeholder?: string;\n}\n\nexport function SipInput({\n  disabled,\n  countries,\n  name,\n  'aria-label': ariaLabel,\n  autoFocus,\n  placeholder,\n}: SipInputProps) {\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const [phoneBookElement, setPhoneBookElement] =\n    React.useState<HTMLButtonElement | null>(null);\n  const isPhoneBookOpen = phoneBookElement != null;\n\n  const {\n    phoneBook: phoneBookOptions,\n    setValue,\n    setCountry,\n    ariaPhoneBookButtonLabel,\n    sipAddress,\n    setSipAddress,\n    focusNumberInput,\n    setFocusNumberInput,\n  } = usePhoneContext();\n\n  const showPhoneBook = phoneBookOptions.length > 0;\n\n  function togglePhoneBook(e: React.MouseEvent<HTMLButtonElement>) {\n    if (isPhoneBookOpen) {\n      setPhoneBookElement(null);\n    } else {\n      setPhoneBookElement(e.currentTarget);\n    }\n  }\n\n  function closePhoneBook() {\n    setPhoneBookElement(null);\n  }\n\n  function handlePhoneBookOptionSelect(value: string) {\n    closePhoneBook();\n    setFocusNumberInput(true);\n    setValue(value);\n  }\n\n  const options: CountryOption[] =\n    countries?.map(country => ({\n      value: country,\n      label: country,\n    })) || [];\n\n  function selectCountry(countryCode?: string) {\n    if (countryCode !== 'SIP') {\n      setSipAddress(sipAddress);\n      setFocusNumberInput(true);\n      setValue('');\n      setCountry((countryCode as CountryCode) || 'US');\n    }\n  }\n\n  function updateSipValue(value: string) {\n    setSipAddress(value);\n    setValue(`sip:${value}`);\n  }\n\n  useLayoutEffect(() => {\n    const input = inputRef.current;\n\n    if (input == null || !focusNumberInput) {\n      return;\n    }\n\n    requestAnimationFrame(() => {\n      if (input.value.length > 0) {\n        input.select();\n      } else {\n        input.focus();\n      }\n    });\n  }, [focusNumberInput]);\n\n  return (\n    <>\n      <InputGroup>\n        <PhoneNumberCountrySelectAdapter\n          value=\"SIP\"\n          onChange={selectCountry}\n          options={options}\n          disabled={disabled}\n        />\n        <Input\n          ref={inputRef}\n          value={sipAddress}\n          disabled={disabled}\n          onChange={updateSipValue}\n          name={name}\n          aria-label={ariaLabel}\n          autoFocus={autoFocus}\n          placeholder={placeholder}\n        />\n        {showPhoneBook && (\n          <Button\n            disabled={disabled}\n            className={clsx('tcn-input-group-slot', 'tcn-phone-number-phone-book')}\n            aria-label={ariaPhoneBookButtonLabel}\n            onClick={togglePhoneBook}\n            size=\"md\"\n          >\n            <NotebookIcon size=\"md\" />\n          </Button>\n        )}\n      </InputGroup>\n      <SuggestionList\n        open={isPhoneBookOpen}\n        anchorElement={phoneBookElement}\n        onOptionSelect={handlePhoneBookOptionSelect}\n        onClose={closePhoneBook}\n        width=\"300px\"\n        noSuggestionMessage=\"No phone numbers found\"\n        horizontalAnchor=\"end\"\n        horizontalOrigin=\"end\"\n        verticalAnchor=\"top\"\n        verticalOrigin=\"top\"\n      >\n        {phoneBookOptions}\n      </SuggestionList>\n    </>\n  );\n}\n"],"names":["SipInput","disabled","countries","name","ariaLabel","autoFocus","placeholder","inputRef","React","phoneBookElement","setPhoneBookElement","isPhoneBookOpen","phoneBookOptions","setValue","setCountry","ariaPhoneBookButtonLabel","sipAddress","setSipAddress","focusNumberInput","setFocusNumberInput","usePhoneContext","showPhoneBook","togglePhoneBook","e","closePhoneBook","handlePhoneBookOptionSelect","value","options","country","selectCountry","countryCode","updateSipValue","useLayoutEffect","input","jsxs","Fragment","InputGroup","jsx","PhoneNumberCountrySelectAdapter","Input","Button","clsx","NotebookIcon","SuggestionList"],"mappings":";;;;;;;;;;;;;;AAwBO,SAASA,EAAS;AAAA,EACvB,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAcC;AAAA,EACd,WAAAC;AAAA,EACA,aAAAC;AACF,GAAkB;AAChB,QAAMC,IAAWC,EAAM,OAAyB,IAAI,GAC9C,CAACC,GAAkBC,CAAmB,IAC1CF,EAAM,SAAmC,IAAI,GACzCG,IAAkBF,KAAoB,MAEtC;AAAA,IACJ,WAAWG;AAAA,IACX,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,0BAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,qBAAAC;AAAA,EAAA,IACEC,EAAA,GAEEC,IAAgBT,EAAiB,SAAS;AAEhD,WAASU,EAAgBC,GAAwC;AAC/D,IACEb,EADEC,IACkB,OAEAY,EAAE,aAFE;AAAA,EAI5B;AAEA,WAASC,IAAiB;AACxB,IAAAd,EAAoB,IAAI;AAAA,EAC1B;AAEA,WAASe,EAA4BC,GAAe;AAClD,IAAAF,EAAA,GACAL,EAAoB,EAAI,GACxBN,EAASa,CAAK;AAAA,EAChB;AAEA,QAAMC,IACJzB,GAAW,IAAI,CAAA0B,OAAY;AAAA,IACzB,OAAOA;AAAA,IACP,OAAOA;AAAA,EAAA,EACP,KAAK,CAAA;AAET,WAASC,EAAcC,GAAsB;AAC3C,IAAIA,MAAgB,UAClBb,EAAcD,CAAU,GACxBG,EAAoB,EAAI,GACxBN,EAAS,EAAE,GACXC,EAAYgB,KAA+B,IAAI;AAAA,EAEnD;AAEA,WAASC,EAAeL,GAAe;AACrC,IAAAT,EAAcS,CAAK,GACnBb,EAAS,OAAOa,CAAK,EAAE;AAAA,EACzB;AAEA,SAAAM,EAAgB,MAAM;AACpB,UAAMC,IAAQ1B,EAAS;AAEvB,IAAI0B,KAAS,QAAQ,CAACf,KAItB,sBAAsB,MAAM;AAC1B,MAAIe,EAAM,MAAM,SAAS,IACvBA,EAAM,OAAA,IAENA,EAAM,MAAA;AAAA,IAEV,CAAC;AAAA,EACH,GAAG,CAACf,CAAgB,CAAC,GAGnB,gBAAAgB,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAD,EAACE,GAAA,EACC,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,UAAUT;AAAA,UACV,SAAAF;AAAA,UACA,UAAA1B;AAAA,QAAA;AAAA,MAAA;AAAA,MAEF,gBAAAoC;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,KAAKhC;AAAA,UACL,OAAOS;AAAA,UACP,UAAAf;AAAA,UACA,UAAU8B;AAAA,UACV,MAAA5B;AAAA,UACA,cAAYC;AAAA,UACZ,WAAAC;AAAA,UACA,aAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,MAEDe,KACC,gBAAAgB;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,UAAAvC;AAAA,UACA,WAAWwC,EAAK,wBAAwB,6BAA6B;AAAA,UACrE,cAAY1B;AAAA,UACZ,SAASO;AAAA,UACT,MAAK;AAAA,UAEL,UAAA,gBAAAe,EAACK,GAAA,EAAa,MAAK,KAAA,CAAK;AAAA,QAAA;AAAA,MAAA;AAAA,IAC1B,GAEJ;AAAA,IACA,gBAAAL;AAAA,MAACM;AAAA,MAAA;AAAA,QACC,MAAMhC;AAAA,QACN,eAAeF;AAAA,QACf,gBAAgBgB;AAAA,QAChB,SAASD;AAAA,QACT,OAAM;AAAA,QACN,qBAAoB;AAAA,QACpB,kBAAiB;AAAA,QACjB,kBAAiB;AAAA,QACjB,gBAAe;AAAA,QACf,gBAAe;AAAA,QAEd,UAAAZ;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;"}
+{"version":3,"file":"sip_input.js","sources":["../../../src/inputs/phone_number_input/sip_input.tsx"],"sourcesContent":["import React, { useLayoutEffect } from 'react';\nimport { NotebookIcon } from '@tcn/icons/notebook_icon.js';\nimport { Input } from '../input/input.js';\nimport { Button } from '../../actions/index.js';\nimport { ControlSet } from '../control_set/control_set.js';\nimport clsx from 'clsx';\nimport { usePhoneContext } from './phone_number_context.js';\nimport type { CountryCode } from 'libphonenumber-js';\nimport {\n  PhoneNumberCountrySelectAdapter,\n  type CountryOption,\n} from './phone_number_country_select_adapter.js';\nimport { SuggestionList } from '../suggestions/suggestion_list.js';\n\nexport interface SipInputProps {\n  onChange: (value: string) => void;\n  sipAutoComplete?: string;\n  countries?: CountryCode[];\n  disabled?: boolean;\n  name?: string;\n  'aria-label'?: string;\n  autoFocus?: boolean;\n  placeholder?: string;\n}\n\nexport function SipInput({\n  disabled,\n  countries,\n  name,\n  'aria-label': ariaLabel,\n  autoFocus,\n  placeholder,\n  sipAutoComplete = 'on',\n}: SipInputProps) {\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const [phoneBookElement, setPhoneBookElement] =\n    React.useState<HTMLButtonElement | null>(null);\n  const isPhoneBookOpen = phoneBookElement != null;\n\n  const {\n    phoneBook: phoneBookOptions,\n    setValue,\n    setCountry,\n    ariaPhoneBookButtonLabel,\n    sipAddress,\n    setSipAddress,\n    focusNumberInput,\n    setFocusNumberInput,\n  } = usePhoneContext();\n\n  const showPhoneBook = phoneBookOptions.length > 0;\n\n  function togglePhoneBook(e: React.MouseEvent<HTMLButtonElement>) {\n    if (isPhoneBookOpen) {\n      setPhoneBookElement(null);\n    } else {\n      setPhoneBookElement(e.currentTarget);\n    }\n  }\n\n  function closePhoneBook() {\n    setPhoneBookElement(null);\n  }\n\n  function handlePhoneBookOptionSelect(value: string) {\n    closePhoneBook();\n    setFocusNumberInput(true);\n    setValue(value);\n  }\n\n  const options: CountryOption[] =\n    countries?.map(country => ({\n      value: country,\n      label: country,\n    })) || [];\n\n  function selectCountry(countryCode?: string) {\n    if (countryCode !== 'SIP') {\n      setSipAddress(sipAddress);\n      setFocusNumberInput(true);\n      setValue('');\n      setCountry((countryCode as CountryCode) || 'US');\n    }\n  }\n\n  function updateSipValue(value: string) {\n    setSipAddress(value);\n    setValue(`sip:${value}`);\n  }\n\n  useLayoutEffect(() => {\n    const input = inputRef.current;\n\n    if (input == null || !focusNumberInput) {\n      return;\n    }\n\n    requestAnimationFrame(() => {\n      if (input.value.length > 0) {\n        input.select();\n      } else {\n        input.focus();\n      }\n    });\n  }, [focusNumberInput]);\n\n  return (\n    <>\n      <ControlSet>\n        <PhoneNumberCountrySelectAdapter\n          value=\"SIP\"\n          onChange={selectCountry}\n          options={options}\n          disabled={disabled}\n        />\n        <Input\n          ref={inputRef}\n          value={sipAddress}\n          disabled={disabled}\n          onChange={updateSipValue}\n          name={name}\n          aria-label={ariaLabel}\n          autoFocus={autoFocus}\n          placeholder={placeholder}\n          autoComplete={sipAutoComplete}\n        />\n        {showPhoneBook && (\n          <Button\n            disabled={disabled}\n            className={clsx('tcn-control-set-item', 'tcn-phone-number-phone-book')}\n            aria-label={ariaPhoneBookButtonLabel}\n            onClick={togglePhoneBook}\n            size=\"md\"\n          >\n            <NotebookIcon size=\"md\" />\n          </Button>\n        )}\n      </ControlSet>\n      <SuggestionList\n        open={isPhoneBookOpen}\n        anchorElement={phoneBookElement}\n        onOptionSelect={handlePhoneBookOptionSelect}\n        onClose={closePhoneBook}\n        width=\"300px\"\n        noSuggestionMessage=\"No phone numbers found\"\n        horizontalAnchor=\"end\"\n        horizontalOrigin=\"end\"\n        verticalAnchor=\"top\"\n        verticalOrigin=\"top\"\n      >\n        {phoneBookOptions}\n      </SuggestionList>\n    </>\n  );\n}\n"],"names":["SipInput","disabled","countries","name","ariaLabel","autoFocus","placeholder","sipAutoComplete","inputRef","React","phoneBookElement","setPhoneBookElement","isPhoneBookOpen","phoneBookOptions","setValue","setCountry","ariaPhoneBookButtonLabel","sipAddress","setSipAddress","focusNumberInput","setFocusNumberInput","usePhoneContext","showPhoneBook","togglePhoneBook","e","closePhoneBook","handlePhoneBookOptionSelect","value","options","country","selectCountry","countryCode","updateSipValue","useLayoutEffect","input","jsxs","Fragment","ControlSet","jsx","PhoneNumberCountrySelectAdapter","Input","Button","clsx","NotebookIcon","SuggestionList"],"mappings":";;;;;;;;;;;;;;AAyBO,SAASA,GAAS;AAAA,EACvB,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAcC;AAAA,EACd,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,iBAAAC,IAAkB;AACpB,GAAkB;AAChB,QAAMC,IAAWC,EAAM,OAAyB,IAAI,GAC9C,CAACC,GAAkBC,CAAmB,IAC1CF,EAAM,SAAmC,IAAI,GACzCG,IAAkBF,KAAoB,MAEtC;AAAA,IACJ,WAAWG;AAAA,IACX,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,0BAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,qBAAAC;AAAA,EAAA,IACEC,EAAA,GAEEC,IAAgBT,EAAiB,SAAS;AAEhD,WAASU,EAAgBC,GAAwC;AAC/D,IACEb,EADEC,IACkB,OAEAY,EAAE,aAFE;AAAA,EAI5B;AAEA,WAASC,IAAiB;AACxB,IAAAd,EAAoB,IAAI;AAAA,EAC1B;AAEA,WAASe,EAA4BC,GAAe;AAClD,IAAAF,EAAA,GACAL,EAAoB,EAAI,GACxBN,EAASa,CAAK;AAAA,EAChB;AAEA,QAAMC,IACJ1B,GAAW,IAAI,CAAA2B,OAAY;AAAA,IACzB,OAAOA;AAAA,IACP,OAAOA;AAAA,EAAA,EACP,KAAK,CAAA;AAET,WAASC,EAAcC,GAAsB;AAC3C,IAAIA,MAAgB,UAClBb,EAAcD,CAAU,GACxBG,EAAoB,EAAI,GACxBN,EAAS,EAAE,GACXC,EAAYgB,KAA+B,IAAI;AAAA,EAEnD;AAEA,WAASC,EAAeL,GAAe;AACrC,IAAAT,EAAcS,CAAK,GACnBb,EAAS,OAAOa,CAAK,EAAE;AAAA,EACzB;AAEA,SAAAM,EAAgB,MAAM;AACpB,UAAMC,IAAQ1B,EAAS;AAEvB,IAAI0B,KAAS,QAAQ,CAACf,KAItB,sBAAsB,MAAM;AAC1B,MAAIe,EAAM,MAAM,SAAS,IACvBA,EAAM,OAAA,IAENA,EAAM,MAAA;AAAA,IAEV,CAAC;AAAA,EACH,GAAG,CAACf,CAAgB,CAAC,GAGnB,gBAAAgB,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAD,EAACE,GAAA,EACC,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,UAAUT;AAAA,UACV,SAAAF;AAAA,UACA,UAAA3B;AAAA,QAAA;AAAA,MAAA;AAAA,MAEF,gBAAAqC;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,KAAKhC;AAAA,UACL,OAAOS;AAAA,UACP,UAAAhB;AAAA,UACA,UAAU+B;AAAA,UACV,MAAA7B;AAAA,UACA,cAAYC;AAAA,UACZ,WAAAC;AAAA,UACA,aAAAC;AAAA,UACA,cAAcC;AAAA,QAAA;AAAA,MAAA;AAAA,MAEfe,KACC,gBAAAgB;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,UAAAxC;AAAA,UACA,WAAWyC,EAAK,wBAAwB,6BAA6B;AAAA,UACrE,cAAY1B;AAAA,UACZ,SAASO;AAAA,UACT,MAAK;AAAA,UAEL,UAAA,gBAAAe,EAACK,GAAA,EAAa,MAAK,KAAA,CAAK;AAAA,QAAA;AAAA,MAAA;AAAA,IAC1B,GAEJ;AAAA,IACA,gBAAAL;AAAA,MAACM;AAAA,MAAA;AAAA,QACC,MAAMhC;AAAA,QACN,eAAeF;AAAA,QACf,gBAAgBgB;AAAA,QAChB,SAASD;AAAA,QACT,OAAM;AAAA,QACN,qBAAoB;AAAA,QACpB,kBAAiB;AAAA,QACjB,kBAAiB;AAAA,QACjB,gBAAe;AAAA,QACf,gBAAe;AAAA,QAEd,UAAAZ;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;"}

package/dist/inputs/select/select.js

@@ -34,7 +34,7 @@ const de = F.forwardRef(function({
 }, K) {
   const M = F.Children.toArray(
     t
-  ), l = c(""), j = c(!1), h = c(!1), [q, S] = w(null), i = c(null), [y, b] = w(!1), B = J(K, i), R = Z(M, m || ""), k = R == null ? x || "" : R.props.label;
+  ), l = c(""), j = c(!1), h = c(!1), [q, y] = w(null), i = c(null), [S, b] = w(!1), B = J(K, i), R = Z(M, m || ""), k = R == null ? x || "" : R.props.label;
   function _() {
     b(!0);
   }
@@ -58,14 +58,14 @@ const de = F.forwardRef(function({
     l.current = s, n && n(e);
   }
   function I(e) {
-    S(e.currentTarget);
+    y(e.currentTarget);
     const s = l.current = e.key;
     l.current = "";
     const r = e.key;
-    s && (r === "Enter" || r === " ") && (y ? o() : _()), f && f(e);
+    s && (r === "Enter" || r === " ") && (S ? o() : _()), f && f(e);
   }
   function P(e) {
-    S(e.currentTarget), j.current = document.activeElement === e.currentTarget, p && p(e);
+    y(e.currentTarget), j.current = document.activeElement === e.currentTarget, p && p(e);
   }
   function z(e) {
     h.current && (h.current = !1, o()), _(), d && d(e);
@@ -75,7 +75,7 @@ const de = F.forwardRef(function({
       W,
       {
         ref: B,
-        className: L(T, "tcn-select", "tcn-control", O.select),
+        className: L(T, "tcn-select", "tcn-entry", O.select),
         width: "100%",
         ...D,
         hAlign: "start",
@@ -90,7 +90,7 @@ const de = F.forwardRef(function({
     /* @__PURE__ */ u(
       Q,
       {
-        open: y,
+        open: S,
         anchorElement: q,
         onClose: N,
         value: "",

package/dist/inputs/select/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","sources":["../../../src/inputs/select/select.tsx"],"sourcesContent":["import { useForkRef } from '../../utils/index.js';\nimport { clsx } from 'clsx';\nimport React, { useRef, useState } from 'react';\nimport { SuggestionList } from '../suggestions/suggestion_list.js';\nimport { OptionProps } from '../options/option.js';\nimport { Button, type ButtonProps } from '../../actions/index.js';\nimport styles from './select.module.css';\n\nfunction findOptionFromValue(options: React.ReactElement<OptionProps>[], value: string) {\n  return options.find(option => option.props.value === value);\n}\n\nexport interface SelectProps\n  extends Omit<ButtonProps, 'children' | 'onChange' | 'value'> {\n  children?: React.ReactElement<OptionProps>[] | React.ReactElement<OptionProps>;\n  onChange?: (value: string) => void;\n  value?: string | null;\n  placeholder?: string;\n  noOptionMatchedMessage?: React.ReactNode;\n  trimCustomInput?: boolean;\n}\n\nexport const Select = React.forwardRef(function Select(\n  {\n    children = [],\n    onKeyDown,\n    onKeyUp,\n    value,\n    placeholder = '-- Select --',\n    noOptionMatchedMessage,\n    trimCustomInput = false,\n    className,\n    onMouseDown,\n    onMouseUp,\n    onChange,\n    ...props\n  }: SelectProps,\n  ref: React.Ref<HTMLButtonElement>\n) {\n  const safeChildren = React.Children.toArray(\n    children\n  ) as React.ReactElement<OptionProps>[];\n  const keyPressedDownRef = useRef('');\n  const isAlreadyFocusedRef = useRef(false);\n  const isClosingRef = useRef(false);\n  const [anchorElement, setAnchorElement] = useState<HTMLButtonElement | null>(null);\n  const internalButtonRef = useRef<HTMLButtonElement | null>(null);\n  const [isSuggestionsOpen, setIsSuggestionsOpen] = useState(false);\n  const forkedRef = useForkRef(ref, internalButtonRef);\n  const selectedOption = findOptionFromValue(safeChildren, value || '');\n  const selectedLabel =\n    selectedOption == null ? placeholder || '' : selectedOption.props.label;\n\n  function openSuggestions() {\n    setIsSuggestionsOpen(true);\n  }\n\n  function closeSuggestions() {\n    setIsSuggestionsOpen(false);\n  }\n\n  function handleClose() {\n    const button = internalButtonRef.current;\n\n    if (button != null) {\n      requestAnimationFrame(() => {\n        button.focus();\n      });\n    }\n\n    closeSuggestions();\n  }\n\n  function handleSelection(value: string, _: string | undefined, isSuggestion: boolean) {\n    const button = internalButtonRef.current;\n\n    if (button != null) {\n      requestAnimationFrame(() => {\n        if (isSuggestion) {\n          onChange && onChange(value);\n        }\n        button.focus();\n      });\n    }\n\n    closeSuggestions();\n  }\n\n  function handleKeyDown(event: React.KeyboardEvent<HTMLButtonElement>) {\n    const key = event.key;\n    keyPressedDownRef.current = key;\n    onKeyDown && onKeyDown(event);\n  }\n\n  function handleKeyUp(event: React.KeyboardEvent<HTMLButtonElement>) {\n    setAnchorElement(event.currentTarget);\n    const isSameKey = (keyPressedDownRef.current = event.key);\n\n    keyPressedDownRef.current = '';\n    const key = event.key;\n\n    if (isSameKey && (key === 'Enter' || key === ' ')) {\n      if (isSuggestionsOpen) {\n        closeSuggestions();\n      } else {\n        openSuggestions();\n      }\n    }\n\n    onKeyUp && onKeyUp(event);\n  }\n\n  function handlMouseDown(event: React.MouseEvent<HTMLButtonElement>) {\n    setAnchorElement(event.currentTarget);\n    isAlreadyFocusedRef.current = document.activeElement === event.currentTarget;\n    onMouseDown && onMouseDown(event);\n  }\n\n  function handleMouseUp(event: React.MouseEvent<HTMLButtonElement>) {\n    if (isClosingRef.current) {\n      isClosingRef.current = false;\n      closeSuggestions();\n    }\n\n    openSuggestions();\n    onMouseUp && onMouseUp(event);\n  }\n\n  return (\n    <>\n      <Button\n        ref={forkedRef}\n        className={clsx(className, 'tcn-select', 'tcn-control', styles.select)}\n        width=\"100%\"\n        {...props}\n        hAlign=\"start\"\n        value={selectedLabel}\n        onKeyDown={handleKeyDown}\n        onKeyUp={handleKeyUp}\n        onMouseDown={handlMouseDown}\n        onMouseUp={handleMouseUp}\n      >\n        <span className={clsx(styles.selectedLabel, 'tcn-select-selected-label')}>\n          {selectedLabel}\n        </span>\n      </Button>\n      <SuggestionList\n        open={isSuggestionsOpen}\n        anchorElement={anchorElement}\n        onClose={handleClose}\n        value={''}\n        scrollToValue={value || ''}\n        trimCustomInput={trimCustomInput}\n        onOptionSelect={handleSelection}\n        noSuggestionMessage={noOptionMatchedMessage}\n      >\n        {children}\n      </SuggestionList>\n    </>\n  );\n});\n"],"names":["findOptionFromValue","options","value","option","Select","React","children","onKeyDown","onKeyUp","placeholder","noOptionMatchedMessage","trimCustomInput","className","onMouseDown","onMouseUp","onChange","props","ref","safeChildren","keyPressedDownRef","useRef","isAlreadyFocusedRef","isClosingRef","anchorElement","setAnchorElement","useState","internalButtonRef","isSuggestionsOpen","setIsSuggestionsOpen","forkedRef","useForkRef","selectedOption","selectedLabel","openSuggestions","closeSuggestions","handleClose","button","handleSelection","_","isSuggestion","handleKeyDown","event","key","handleKeyUp","isSameKey","handlMouseDown","handleMouseUp","jsxs","Fragment","jsx","Button","clsx","styles","SuggestionList"],"mappings":"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"}
+{"version":3,"file":"select.js","sources":["../../../src/inputs/select/select.tsx"],"sourcesContent":["import { useForkRef } from '../../utils/index.js';\nimport { clsx } from 'clsx';\nimport React, { useRef, useState } from 'react';\nimport { SuggestionList } from '../suggestions/suggestion_list.js';\nimport { OptionProps } from '../options/option.js';\nimport { Button, type ButtonProps } from '../../actions/index.js';\nimport styles from './select.module.css';\n\nfunction findOptionFromValue(options: React.ReactElement<OptionProps>[], value: string) {\n  return options.find(option => option.props.value === value);\n}\n\nexport interface SelectProps\n  extends Omit<ButtonProps, 'children' | 'onChange' | 'value'> {\n  children?: React.ReactElement<OptionProps>[] | React.ReactElement<OptionProps>;\n  onChange?: (value: string) => void;\n  value?: string | null;\n  placeholder?: string;\n  noOptionMatchedMessage?: React.ReactNode;\n  trimCustomInput?: boolean;\n}\n\nexport const Select = React.forwardRef(function Select(\n  {\n    children = [],\n    onKeyDown,\n    onKeyUp,\n    value,\n    placeholder = '-- Select --',\n    noOptionMatchedMessage,\n    trimCustomInput = false,\n    className,\n    onMouseDown,\n    onMouseUp,\n    onChange,\n    ...props\n  }: SelectProps,\n  ref: React.Ref<HTMLButtonElement>\n) {\n  const safeChildren = React.Children.toArray(\n    children\n  ) as React.ReactElement<OptionProps>[];\n  const keyPressedDownRef = useRef('');\n  const isAlreadyFocusedRef = useRef(false);\n  const isClosingRef = useRef(false);\n  const [anchorElement, setAnchorElement] = useState<HTMLButtonElement | null>(null);\n  const internalButtonRef = useRef<HTMLButtonElement | null>(null);\n  const [isSuggestionsOpen, setIsSuggestionsOpen] = useState(false);\n  const forkedRef = useForkRef(ref, internalButtonRef);\n  const selectedOption = findOptionFromValue(safeChildren, value || '');\n  const selectedLabel =\n    selectedOption == null ? placeholder || '' : selectedOption.props.label;\n\n  function openSuggestions() {\n    setIsSuggestionsOpen(true);\n  }\n\n  function closeSuggestions() {\n    setIsSuggestionsOpen(false);\n  }\n\n  function handleClose() {\n    const button = internalButtonRef.current;\n\n    if (button != null) {\n      requestAnimationFrame(() => {\n        button.focus();\n      });\n    }\n\n    closeSuggestions();\n  }\n\n  function handleSelection(value: string, _: string | undefined, isSuggestion: boolean) {\n    const button = internalButtonRef.current;\n\n    if (button != null) {\n      requestAnimationFrame(() => {\n        if (isSuggestion) {\n          onChange && onChange(value);\n        }\n        button.focus();\n      });\n    }\n\n    closeSuggestions();\n  }\n\n  function handleKeyDown(event: React.KeyboardEvent<HTMLButtonElement>) {\n    const key = event.key;\n    keyPressedDownRef.current = key;\n    onKeyDown && onKeyDown(event);\n  }\n\n  function handleKeyUp(event: React.KeyboardEvent<HTMLButtonElement>) {\n    setAnchorElement(event.currentTarget);\n    const isSameKey = (keyPressedDownRef.current = event.key);\n\n    keyPressedDownRef.current = '';\n    const key = event.key;\n\n    if (isSameKey && (key === 'Enter' || key === ' ')) {\n      if (isSuggestionsOpen) {\n        closeSuggestions();\n      } else {\n        openSuggestions();\n      }\n    }\n\n    onKeyUp && onKeyUp(event);\n  }\n\n  function handlMouseDown(event: React.MouseEvent<HTMLButtonElement>) {\n    setAnchorElement(event.currentTarget);\n    isAlreadyFocusedRef.current = document.activeElement === event.currentTarget;\n    onMouseDown && onMouseDown(event);\n  }\n\n  function handleMouseUp(event: React.MouseEvent<HTMLButtonElement>) {\n    if (isClosingRef.current) {\n      isClosingRef.current = false;\n      closeSuggestions();\n    }\n\n    openSuggestions();\n    onMouseUp && onMouseUp(event);\n  }\n\n  return (\n    <>\n      <Button\n        ref={forkedRef}\n        className={clsx(className, 'tcn-select', 'tcn-entry', styles.select)}\n        width=\"100%\"\n        {...props}\n        hAlign=\"start\"\n        value={selectedLabel}\n        onKeyDown={handleKeyDown}\n        onKeyUp={handleKeyUp}\n        onMouseDown={handlMouseDown}\n        onMouseUp={handleMouseUp}\n      >\n        <span className={clsx(styles.selectedLabel, 'tcn-select-selected-label')}>\n          {selectedLabel}\n        </span>\n      </Button>\n      <SuggestionList\n        open={isSuggestionsOpen}\n        anchorElement={anchorElement}\n        onClose={handleClose}\n        value={''}\n        scrollToValue={value || ''}\n        trimCustomInput={trimCustomInput}\n        onOptionSelect={handleSelection}\n        noSuggestionMessage={noOptionMatchedMessage}\n      >\n        {children}\n      </SuggestionList>\n    </>\n  );\n});\n"],"names":["findOptionFromValue","options","value","option","Select","React","children","onKeyDown","onKeyUp","placeholder","noOptionMatchedMessage","trimCustomInput","className","onMouseDown","onMouseUp","onChange","props","ref","safeChildren","keyPressedDownRef","useRef","isAlreadyFocusedRef","isClosingRef","anchorElement","setAnchorElement","useState","internalButtonRef","isSuggestionsOpen","setIsSuggestionsOpen","forkedRef","useForkRef","selectedOption","selectedLabel","openSuggestions","closeSuggestions","handleClose","button","handleSelection","_","isSuggestion","handleKeyDown","event","key","handleKeyUp","isSameKey","handlMouseDown","handleMouseUp","jsxs","Fragment","jsx","Button","clsx","styles","SuggestionList"],"mappings":";;;;;;;;;;;;;;;;;AAQA,SAASA,EAAoBC,GAA4CC,GAAe;AACtF,SAAOD,EAAQ,KAAK,CAAAE,MAAUA,EAAO,MAAM,UAAUD,CAAK;AAC5D;AAYO,MAAME,KAASC,EAAM,WAAW,SACrC;AAAA,EACE,UAAAC,IAAW,CAAA;AAAA,EACX,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAN;AAAA,EACA,aAAAO,IAAc;AAAA,EACd,wBAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAeb,EAAM,SAAS;AAAA,IAClCC;AAAA,EAAA,GAEIa,IAAoBC,EAAO,EAAE,GAC7BC,IAAsBD,EAAO,EAAK,GAClCE,IAAeF,EAAO,EAAK,GAC3B,CAACG,GAAeC,CAAgB,IAAIC,EAAmC,IAAI,GAC3EC,IAAoBN,EAAiC,IAAI,GACzD,CAACO,GAAmBC,CAAoB,IAAIH,EAAS,EAAK,GAC1DI,IAAYC,EAAWb,GAAKS,CAAiB,GAC7CK,IAAiB/B,EAAoBkB,GAAchB,KAAS,EAAE,GAC9D8B,IACJD,KAAkB,OAAOtB,KAAe,KAAKsB,EAAe,MAAM;AAEpE,WAASE,IAAkB;AACzB,IAAAL,EAAqB,EAAI;AAAA,EAC3B;AAEA,WAASM,IAAmB;AAC1B,IAAAN,EAAqB,EAAK;AAAA,EAC5B;AAEA,WAASO,IAAc;AACrB,UAAMC,IAASV,EAAkB;AAEjC,IAAIU,KAAU,QACZ,sBAAsB,MAAM;AAC1B,MAAAA,EAAO,MAAA;AAAA,IACT,CAAC,GAGHF,EAAA;AAAA,EACF;AAEA,WAASG,EAAgBnC,GAAeoC,GAAuBC,GAAuB;AACpF,UAAMH,IAASV,EAAkB;AAEjC,IAAIU,KAAU,QACZ,sBAAsB,MAAM;AAC1B,MAAIG,KACFxB,KAAYA,EAASb,CAAK,GAE5BkC,EAAO,MAAA;AAAA,IACT,CAAC,GAGHF,EAAA;AAAA,EACF;AAEA,WAASM,EAAcC,GAA+C;AACpE,UAAMC,IAAMD,EAAM;AAClB,IAAAtB,EAAkB,UAAUuB,GAC5BnC,KAAaA,EAAUkC,CAAK;AAAA,EAC9B;AAEA,WAASE,EAAYF,GAA+C;AAClE,IAAAjB,EAAiBiB,EAAM,aAAa;AACpC,UAAMG,IAAazB,EAAkB,UAAUsB,EAAM;AAErD,IAAAtB,EAAkB,UAAU;AAC5B,UAAMuB,IAAMD,EAAM;AAElB,IAAIG,MAAcF,MAAQ,WAAWA,MAAQ,SACvCf,IACFO,EAAA,IAEAD,EAAA,IAIJzB,KAAWA,EAAQiC,CAAK;AAAA,EAC1B;AAEA,WAASI,EAAeJ,GAA4C;AAClE,IAAAjB,EAAiBiB,EAAM,aAAa,GACpCpB,EAAoB,UAAU,SAAS,kBAAkBoB,EAAM,eAC/D5B,KAAeA,EAAY4B,CAAK;AAAA,EAClC;AAEA,WAASK,EAAcL,GAA4C;AACjE,IAAInB,EAAa,YACfA,EAAa,UAAU,IACvBY,EAAA,IAGFD,EAAA,GACAnB,KAAaA,EAAU2B,CAAK;AAAA,EAC9B;AAEA,SACE,gBAAAM,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,KAAKrB;AAAA,QACL,WAAWsB,EAAKvC,GAAW,cAAc,aAAawC,EAAO,MAAM;AAAA,QACnE,OAAM;AAAA,QACL,GAAGpC;AAAA,QACJ,QAAO;AAAA,QACP,OAAOgB;AAAA,QACP,WAAWQ;AAAA,QACX,SAASG;AAAA,QACT,aAAaE;AAAA,QACb,WAAWC;AAAA,QAEX,UAAA,gBAAAG,EAAC,UAAK,WAAWE,EAAKC,EAAO,eAAe,2BAA2B,GACpE,UAAApB,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,gBAAAiB;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,MAAM1B;AAAA,QACN,eAAAJ;AAAA,QACA,SAASY;AAAA,QACT,OAAO;AAAA,QACP,eAAejC,KAAS;AAAA,QACxB,iBAAAS;AAAA,QACA,gBAAgB0B;AAAA,QAChB,qBAAqB3B;AAAA,QAEpB,UAAAJ;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ,CAAC;"}

package/dist/inputs/textarea/textarea.js

@@ -1,14 +1,14 @@
-import { jsx as n } from "react/jsx-runtime";
-import { clsx as x } from "clsx";
+import { jsx as x } from "react/jsx-runtime";
+import { clsx as l } from "clsx";
 import f from "react";
-import '../../textarea.css';const d = "_textarea_8286394", i = { textarea: d }, b = f.forwardRef(function({ className: r, width: o, height: s, style: c, onChange: t, ...e }, l) {
-  return /* @__PURE__ */ n(
+import '../../textarea.css';const d = "_textarea_8286394", i = { textarea: d }, T = f.forwardRef(function({ className: r, width: s, height: o, style: c, onChange: t, ...e }, n) {
+  return /* @__PURE__ */ x(
     "textarea",
     {
-      style: { width: o, height: s, ...c },
-      className: x(r, i.textarea, "tcn-textarea", "tcn-control"),
+      style: { width: s, height: o, ...c },
+      className: l(r, i.textarea, "tcn-textarea", "tcn-entry"),
       "data-is-disabled": e.disabled || !1,
-      ref: l,
+      ref: n,
       onChange: (a) => {
         t && t(a.currentTarget.value, a);
       },
@@ -17,6 +17,6 @@ import '../../textarea.css';const d = "_textarea_8286394", i = { textarea: d },
   );
 });
 export {
-  b as Textarea
+  T as Textarea
 };
 //# sourceMappingURL=textarea.js.map

package/dist/inputs/textarea/textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.js","sources":["../../../src/inputs/textarea/textarea.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { TextareaHTMLAttributes } from 'react';\nimport styles from './textarea.module.css';\n\nexport interface TextareaProps\n  extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'onChange'> {\n  value?: string;\n  width?: string;\n  height?: string;\n  disabled?: boolean;\n  placeholder?: string;\n  onChange?: (value: string, event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n}\n\nexport const Textarea = React.forwardRef(function Textarea(\n  { className, width, height, style, onChange, ...props }: TextareaProps,\n  ref: React.Ref<HTMLTextAreaElement>\n) {\n  return (\n    <textarea\n      style={{ width, height, ...style }}\n      className={clsx(className, styles.textarea, 'tcn-textarea', 'tcn-control')}\n      data-is-disabled={props.disabled || false}\n      ref={ref}\n      onChange={e => {\n        onChange && onChange(e.currentTarget.value, e);\n      }}\n      {...props}\n    />\n  );\n});\n"],"names":["Textarea","React","className","width","height","style","onChange","props","ref","jsx","clsx","styles","e"],"mappings":";;;oDAeaA,IAAWC,EAAM,WAAW,SACvC,EAAE,WAAAC,GAAW,OAAAC,GAAO,QAAAC,GAAQ,OAAAC,GAAO,UAAAC,GAAU,GAAGC,EAAA,GAChDC,GACA;AACA,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO,EAAE,OAAAN,GAAO,QAAAC,GAAQ,GAAGC,EAAA;AAAA,MAC3B,WAAWK,EAAKR,GAAWS,EAAO,UAAU,gBAAgB,aAAa;AAAA,MACzE,oBAAkBJ,EAAM,YAAY;AAAA,MACpC,KAAAC;AAAA,MACA,UAAU,CAAAI,MAAK;AACb,QAAAN,KAAYA,EAASM,EAAE,cAAc,OAAOA,CAAC;AAAA,MAC/C;AAAA,MACC,GAAGL;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}
+{"version":3,"file":"textarea.js","sources":["../../../src/inputs/textarea/textarea.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { TextareaHTMLAttributes } from 'react';\nimport styles from './textarea.module.css';\n\nexport interface TextareaProps\n  extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'onChange'> {\n  value?: string;\n  width?: string;\n  height?: string;\n  disabled?: boolean;\n  placeholder?: string;\n  onChange?: (value: string, event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n}\n\nexport const Textarea = React.forwardRef(function Textarea(\n  { className, width, height, style, onChange, ...props }: TextareaProps,\n  ref: React.Ref<HTMLTextAreaElement>\n) {\n  return (\n    <textarea\n      style={{ width, height, ...style }}\n      className={clsx(className, styles.textarea, 'tcn-textarea', 'tcn-entry')}\n      data-is-disabled={props.disabled || false}\n      ref={ref}\n      onChange={e => {\n        onChange && onChange(e.currentTarget.value, e);\n      }}\n      {...props}\n    />\n  );\n});\n"],"names":["Textarea","React","className","width","height","style","onChange","props","ref","jsx","clsx","styles","e"],"mappings":";;;oDAeaA,IAAWC,EAAM,WAAW,SACvC,EAAE,WAAAC,GAAW,OAAAC,GAAO,QAAAC,GAAQ,OAAAC,GAAO,UAAAC,GAAU,GAAGC,EAAA,GAChDC,GACA;AACA,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO,EAAE,OAAAN,GAAO,QAAAC,GAAQ,GAAGC,EAAA;AAAA,MAC3B,WAAWK,EAAKR,GAAWS,EAAO,UAAU,gBAAgB,WAAW;AAAA,MACvE,oBAAkBJ,EAAM,YAAY;AAAA,MACpC,KAAAC;AAAA,MACA,UAAU,CAAAI,MAAK;AACb,QAAAN,KAAYA,EAASM,EAAE,cAAc,OAAOA,CAAC;AAAA,MAC/C;AAAA,MACC,GAAGL;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}

package/dist/inputs/unit_input/unit_input.js

@@ -10,10 +10,10 @@ import "../../utils/dnd/context.js";
 import "../../draggable.module-BgelQsuJ.js";
 import { Input as v } from "../input/input.js";
 import { Select as w } from "../select/select.js";
-import { InputGroup as h } from "../input_group/input_group.js";
+import { ControlSet as h } from "../control_set/control_set.js";
 import '../../unit_input.css';const j = "_unit-input_4bd8bc8", k = "_unit-input-flex-box_8db2f9b", F = "_unit-input-number_c95f85a", H = "_unit-input-select_1bbbad9", l = { "unit-input": j, "unit-input-flex-box": k, "unit-input-number": F, "unit-input-select": H };
-function U(p) {
-  return p.replace(/[^.\d-]/g, "").replace(/(?!^)-/g, "").replace(/(\..*?)\.+/g, "$1");
+function U(s) {
+  return s.replace(/[^.\d-]/g, "").replace(/(?!^)-/g, "").replace(/(\..*?)\.+/g, "$1");
 }
 const Q = y.forwardRef(function({
   value: A,
@@ -22,27 +22,27 @@ const Q = y.forwardRef(function({
   onChange: t,
   inputRef: b,
   unitRef: x,
-  disabled: s,
+  disabled: p,
   ...R
-}, I) {
-  const c = E(null), N = V(b, c);
-  function _(u, e) {
-    if (e == null)
+}, N) {
+  const c = E(null), _ = V(b, c);
+  function I(e, u) {
+    if (u == null)
       return;
-    const n = e.currentTarget, a = n.selectionStart || 0, i = U(u), f = Number(i);
-    n.value = i, i.length < u.length && n.setSelectionRange(a - 1, a - 1), i === "" ? t && t(null, r || "") : isNaN(f) || t && t(f, r || "");
+    const n = u.currentTarget, a = n.selectionStart || 0, i = U(e), f = Number(i);
+    n.value = i, i.length < e.length && n.setSelectionRange(a - 1, a - 1), i === "" ? t && t(null, r || "") : isNaN(f) || t && t(f, r || "");
   }
-  function S(u) {
-    const e = c.current;
-    if (e == null)
+  function S(e) {
+    const u = c.current;
+    if (u == null)
       return;
-    const n = Number(e.value);
-    isNaN(n) ? t && t(null, u) : t && t(n, u);
+    const n = Number(u.value);
+    isNaN(n) ? t && t(null, e) : t && t(n, e);
   }
   return /* @__PURE__ */ g(
     h,
     {
-      ref: I,
+      ref: N,
       className: o(l["unit-input"], "tcn-unit-input"),
       height: "auto",
       ...R,
@@ -52,9 +52,9 @@ const Q = y.forwardRef(function({
           {
             width: "flex",
             className: o(l["unit-input-number"], "tcn-unit-input-number"),
-            ref: N,
-            onChange: _,
-            disabled: s,
+            ref: _,
+            onChange: I,
+            disabled: p,
             style: {
               borderEndEndRadius: 0,
               borderStartEndRadius: 0,
@@ -70,7 +70,7 @@ const Q = y.forwardRef(function({
             width: "auto",
             value: r,
             onChange: S,
-            disabled: s,
+            disabled: p,
             style: { borderStartStartRadius: 0, borderEndStartRadius: 0 },
             children: d
           }

package/dist/inputs/unit_input/unit_input.js.map

@@ -1 +1 @@
-{"version":3,"file":"unit_input.js","sources":["../../../src/inputs/unit_input/unit_input.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { clsx } from 'clsx';\nimport { useForkRef } from '../../utils/index.js';\nimport { type HStackProps } from '../../stacks/h_stack.js';\nimport { Input } from '../input/input.js';\nimport { Select } from '../select/select.js';\nimport { OptionProps } from '../options/option.js';\nimport styles from './unit_input.module.css';\n\nimport { InputGroup } from '../input_group/input_group.js';\n\nfunction getDisplayValue(value: string) {\n  return value\n    .replace(/[^.\\d-]/g, '') // Remove invalid characters\n    .replace(/(?!^)-/g, '') // Ensure `-` only at the start\n    .replace(/(\\..*?)\\.+/g, '$1'); // Allow only one dot\n}\n\nexport interface UnitInputProps extends Omit<HStackProps, 'onChange' | 'children'> {\n  value?: number | null;\n  unit?: string;\n  children: React.ReactElement<OptionProps> | React.ReactElement<OptionProps>[];\n  onChange?: (value: number | null, unit: string) => void;\n  inputRef?: React.Ref<HTMLInputElement>;\n  unitRef?: React.Ref<HTMLButtonElement>;\n  disabled?: boolean;\n}\n\nexport const UnitInput = React.forwardRef(function UnitInput(\n  {\n    value,\n    unit,\n    children,\n    onChange,\n    inputRef,\n    unitRef,\n    disabled,\n    ...props\n  }: UnitInputProps,\n  ref: React.Ref<HTMLElement>\n) {\n  const internalInputRef = useRef<HTMLInputElement>(null);\n  const forkedInputRef = useForkRef(inputRef, internalInputRef);\n\n  function valueHandler(value: string, event?: React.ChangeEvent<HTMLInputElement>) {\n    if (event == null) {\n      return;\n    }\n\n    const input = event.currentTarget;\n    const cursorPosition = input.selectionStart || 0;\n    const displayValue = getDisplayValue(value);\n    const potentialValue = Number(displayValue);\n\n    input.value = displayValue;\n\n    if (displayValue.length < value.length) {\n      input.setSelectionRange(cursorPosition - 1, cursorPosition - 1);\n    }\n\n    if (displayValue === '') {\n      onChange && onChange(null, unit || '');\n    } else if (!isNaN(potentialValue)) {\n      onChange && onChange(potentialValue, unit || '');\n    }\n  }\n\n  function unitHandler(unit: string) {\n    const input = internalInputRef.current;\n    if (input == null) {\n      return;\n    }\n\n    const potentialValue = Number(input.value);\n    if (isNaN(potentialValue)) {\n      onChange && onChange(null, unit);\n    } else {\n      onChange && onChange(potentialValue, unit);\n    }\n  }\n\n  return (\n    <InputGroup\n      ref={ref}\n      className={clsx(styles['unit-input'], 'tcn-unit-input')}\n      height=\"auto\"\n      {...props}\n    >\n      <Input\n        width=\"flex\"\n        className={clsx(styles['unit-input-number'], 'tcn-unit-input-number')}\n        ref={forkedInputRef}\n        onChange={valueHandler}\n        disabled={disabled}\n        style={{\n          borderEndEndRadius: 0,\n          borderStartEndRadius: 0,\n          textAlign: 'start',\n        }}\n      />\n\n      <Select\n        className={clsx(styles['unit-input-select'], 'tcn-unit-input-select')}\n        ref={unitRef}\n        width=\"auto\"\n        value={unit}\n        onChange={unitHandler}\n        disabled={disabled}\n        style={{ borderStartStartRadius: 0, borderEndStartRadius: 0 }}\n      >\n        {children}\n      </Select>\n    </InputGroup>\n  );\n});\n"],"names":["getDisplayValue","value","UnitInput","React","unit","children","onChange","inputRef","unitRef","disabled","props","ref","internalInputRef","useRef","forkedInputRef","useForkRef","valueHandler","event","input","cursorPosition","displayValue","potentialValue","unitHandler","jsxs","InputGroup","clsx","styles","jsx","Input","Select"],"mappings":";;;;;;;;;;;;;;AAWA,SAASA,EAAgBC,GAAe;AACtC,SAAOA,EACJ,QAAQ,YAAY,EAAE,EACtB,QAAQ,WAAW,EAAE,EACrB,QAAQ,eAAe,IAAI;AAChC;AAYO,MAAMC,IAAYC,EAAM,WAAW,SACxC;AAAA,EACE,OAAAF;AAAA,EACA,MAAAG;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAmBC,EAAyB,IAAI,GAChDC,IAAiBC,EAAWR,GAAUK,CAAgB;AAE5D,WAASI,EAAaf,GAAegB,GAA6C;AAChF,QAAIA,KAAS;AACX;AAGF,UAAMC,IAAQD,EAAM,eACdE,IAAiBD,EAAM,kBAAkB,GACzCE,IAAepB,EAAgBC,CAAK,GACpCoB,IAAiB,OAAOD,CAAY;AAE1C,IAAAF,EAAM,QAAQE,GAEVA,EAAa,SAASnB,EAAM,UAC9BiB,EAAM,kBAAkBC,IAAiB,GAAGA,IAAiB,CAAC,GAG5DC,MAAiB,KACnBd,KAAYA,EAAS,MAAMF,KAAQ,EAAE,IAC3B,MAAMiB,CAAc,KAC9Bf,KAAYA,EAASe,GAAgBjB,KAAQ,EAAE;AAAA,EAEnD;AAEA,WAASkB,EAAYlB,GAAc;AACjC,UAAMc,IAAQN,EAAiB;AAC/B,QAAIM,KAAS;AACX;AAGF,UAAMG,IAAiB,OAAOH,EAAM,KAAK;AACzC,IAAI,MAAMG,CAAc,IACtBf,KAAYA,EAAS,MAAMF,CAAI,IAE/BE,KAAYA,EAASe,GAAgBjB,CAAI;AAAA,EAE7C;AAEA,SACE,gBAAAmB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAb;AAAA,MACA,WAAWc,EAAKC,EAAO,YAAY,GAAG,gBAAgB;AAAA,MACtD,QAAO;AAAA,MACN,GAAGhB;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAiB;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,WAAWH,EAAKC,EAAO,mBAAmB,GAAG,uBAAuB;AAAA,YACpE,KAAKZ;AAAA,YACL,UAAUE;AAAA,YACV,UAAAP;AAAA,YACA,OAAO;AAAA,cACL,oBAAoB;AAAA,cACpB,sBAAsB;AAAA,cACtB,WAAW;AAAA,YAAA;AAAA,UACb;AAAA,QAAA;AAAA,QAGF,gBAAAkB;AAAA,UAACE;AAAA,UAAA;AAAA,YACC,WAAWJ,EAAKC,EAAO,mBAAmB,GAAG,uBAAuB;AAAA,YACpE,KAAKlB;AAAA,YACL,OAAM;AAAA,YACN,OAAOJ;AAAA,YACP,UAAUkB;AAAA,YACV,UAAAb;AAAA,YACA,OAAO,EAAE,wBAAwB,GAAG,sBAAsB,EAAA;AAAA,YAEzD,UAAAJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"unit_input.js","sources":["../../../src/inputs/unit_input/unit_input.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { clsx } from 'clsx';\nimport { useForkRef } from '../../utils/index.js';\nimport { type HStackProps } from '../../stacks/h_stack.js';\nimport { Input } from '../input/input.js';\nimport { Select } from '../select/select.js';\nimport { OptionProps } from '../options/option.js';\nimport styles from './unit_input.module.css';\n\nimport { ControlSet } from '../control_set/control_set.js';\n\nfunction getDisplayValue(value: string) {\n  return value\n    .replace(/[^.\\d-]/g, '') // Remove invalid characters\n    .replace(/(?!^)-/g, '') // Ensure `-` only at the start\n    .replace(/(\\..*?)\\.+/g, '$1'); // Allow only one dot\n}\n\nexport interface UnitInputProps extends Omit<HStackProps, 'onChange' | 'children'> {\n  value?: number | null;\n  unit?: string;\n  children: React.ReactElement<OptionProps> | React.ReactElement<OptionProps>[];\n  onChange?: (value: number | null, unit: string) => void;\n  inputRef?: React.Ref<HTMLInputElement>;\n  unitRef?: React.Ref<HTMLButtonElement>;\n  disabled?: boolean;\n}\n\nexport const UnitInput = React.forwardRef(function UnitInput(\n  {\n    value,\n    unit,\n    children,\n    onChange,\n    inputRef,\n    unitRef,\n    disabled,\n    ...props\n  }: UnitInputProps,\n  ref: React.Ref<HTMLElement>\n) {\n  const internalInputRef = useRef<HTMLInputElement>(null);\n  const forkedInputRef = useForkRef(inputRef, internalInputRef);\n\n  function valueHandler(value: string, event?: React.ChangeEvent<HTMLInputElement>) {\n    if (event == null) {\n      return;\n    }\n\n    const input = event.currentTarget;\n    const cursorPosition = input.selectionStart || 0;\n    const displayValue = getDisplayValue(value);\n    const potentialValue = Number(displayValue);\n\n    input.value = displayValue;\n\n    if (displayValue.length < value.length) {\n      input.setSelectionRange(cursorPosition - 1, cursorPosition - 1);\n    }\n\n    if (displayValue === '') {\n      onChange && onChange(null, unit || '');\n    } else if (!isNaN(potentialValue)) {\n      onChange && onChange(potentialValue, unit || '');\n    }\n  }\n\n  function unitHandler(unit: string) {\n    const input = internalInputRef.current;\n    if (input == null) {\n      return;\n    }\n\n    const potentialValue = Number(input.value);\n    if (isNaN(potentialValue)) {\n      onChange && onChange(null, unit);\n    } else {\n      onChange && onChange(potentialValue, unit);\n    }\n  }\n\n  return (\n    <ControlSet\n      ref={ref}\n      className={clsx(styles['unit-input'], 'tcn-unit-input')}\n      height=\"auto\"\n      {...props}\n    >\n      <Input\n        width=\"flex\"\n        className={clsx(styles['unit-input-number'], 'tcn-unit-input-number')}\n        ref={forkedInputRef}\n        onChange={valueHandler}\n        disabled={disabled}\n        style={{\n          borderEndEndRadius: 0,\n          borderStartEndRadius: 0,\n          textAlign: 'start',\n        }}\n      />\n\n      <Select\n        className={clsx(styles['unit-input-select'], 'tcn-unit-input-select')}\n        ref={unitRef}\n        width=\"auto\"\n        value={unit}\n        onChange={unitHandler}\n        disabled={disabled}\n        style={{ borderStartStartRadius: 0, borderEndStartRadius: 0 }}\n      >\n        {children}\n      </Select>\n    </ControlSet>\n  );\n});\n"],"names":["getDisplayValue","value","UnitInput","React","unit","children","onChange","inputRef","unitRef","disabled","props","ref","internalInputRef","useRef","forkedInputRef","useForkRef","valueHandler","event","input","cursorPosition","displayValue","potentialValue","unitHandler","jsxs","ControlSet","clsx","styles","jsx","Input","Select"],"mappings":";;;;;;;;;;;;;;AAWA,SAASA,EAAgBC,GAAe;AACtC,SAAOA,EACJ,QAAQ,YAAY,EAAE,EACtB,QAAQ,WAAW,EAAE,EACrB,QAAQ,eAAe,IAAI;AAChC;AAYO,MAAMC,IAAYC,EAAM,WAAW,SACxC;AAAA,EACE,OAAAF;AAAA,EACA,MAAAG;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAmBC,EAAyB,IAAI,GAChDC,IAAiBC,EAAWR,GAAUK,CAAgB;AAE5D,WAASI,EAAaf,GAAegB,GAA6C;AAChF,QAAIA,KAAS;AACX;AAGF,UAAMC,IAAQD,EAAM,eACdE,IAAiBD,EAAM,kBAAkB,GACzCE,IAAepB,EAAgBC,CAAK,GACpCoB,IAAiB,OAAOD,CAAY;AAE1C,IAAAF,EAAM,QAAQE,GAEVA,EAAa,SAASnB,EAAM,UAC9BiB,EAAM,kBAAkBC,IAAiB,GAAGA,IAAiB,CAAC,GAG5DC,MAAiB,KACnBd,KAAYA,EAAS,MAAMF,KAAQ,EAAE,IAC3B,MAAMiB,CAAc,KAC9Bf,KAAYA,EAASe,GAAgBjB,KAAQ,EAAE;AAAA,EAEnD;AAEA,WAASkB,EAAYlB,GAAc;AACjC,UAAMc,IAAQN,EAAiB;AAC/B,QAAIM,KAAS;AACX;AAGF,UAAMG,IAAiB,OAAOH,EAAM,KAAK;AACzC,IAAI,MAAMG,CAAc,IACtBf,KAAYA,EAAS,MAAMF,CAAI,IAE/BE,KAAYA,EAASe,GAAgBjB,CAAI;AAAA,EAE7C;AAEA,SACE,gBAAAmB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAb;AAAA,MACA,WAAWc,EAAKC,EAAO,YAAY,GAAG,gBAAgB;AAAA,MACtD,QAAO;AAAA,MACN,GAAGhB;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAiB;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,WAAWH,EAAKC,EAAO,mBAAmB,GAAG,uBAAuB;AAAA,YACpE,KAAKZ;AAAA,YACL,UAAUE;AAAA,YACV,UAAAP;AAAA,YACA,OAAO;AAAA,cACL,oBAAoB;AAAA,cACpB,sBAAsB;AAAA,cACtB,WAAW;AAAA,YAAA;AAAA,UACb;AAAA,QAAA;AAAA,QAGF,gBAAAkB;AAAA,UAACE;AAAA,UAAA;AAAA,YACC,WAAWJ,EAAKC,EAAO,mBAAmB,GAAG,uBAAuB;AAAA,YACpE,KAAKlB;AAAA,YACL,OAAM;AAAA,YACN,OAAOJ;AAAA,YACP,UAAUkB;AAAA,YACV,UAAAb;AAAA,YACA,OAAO,EAAE,wBAAwB,GAAG,sBAAsB,EAAA;AAAA,YAEzD,UAAAJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}

package/dist/layouts/body/body.d.ts

@@ -2,5 +2,22 @@ import { default as React } from 'react';
 import { BoxProps } from '../../stacks/box/box.js';
 export interface BodyProps extends Omit<BoxProps, 'as'> {
 }
+/**
+ * The Body component will fill the available space in in a flex container.
+ * It is typically used within a Scaffold or Rail component.
+ * And typically will return a Scaffold or Rail component to determine the scroll behavior of the body
+ * Example:
+ * <Body>
+ *   <Scaffold>
+ *     <VerticalContent />
+ *   </Scaffold>
+ * </Body>
+ * or
+ * <Body>
+ *   <Rail>
+ *     <HorizontalContent />
+ *   </Rail>
+ * </Body>
+ */
 export declare const Body: React.ForwardRefExoticComponent<BodyProps & React.RefAttributes<HTMLElement>>;
 //# sourceMappingURL=body.d.ts.map

package/dist/layouts/body/body.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"body.d.ts","sourceRoot":"","sources":["../../../src/layouts/body/body.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAE7D,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC;CAAG;AAI1D,eAAO,MAAM,IAAI,+EAcf,CAAC"}
+{"version":3,"file":"body.d.ts","sourceRoot":"","sources":["../../../src/layouts/body/body.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAI7D,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC;CAAG;AAE1D;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,IAAI,+EAcf,CAAC"}

package/dist/layouts/body/body.js

@@ -1,21 +1,20 @@
-import { jsx as s } from "react/jsx-runtime";
-import f from "react";
-import { clsx as a } from "clsx";
-import { s as d } from "../../body.module-BbFZ7KNP.js";
-import { Box as e } from "../../stacks/box/box.js";
-const x = f.forwardRef(function({ children: o, className: r, ...t }, m) {
-  return /* @__PURE__ */ s(
-    e,
+import { jsx as c } from "react/jsx-runtime";
+import d from "react";
+import { clsx as m } from "clsx";
+import { Box as a } from "../../stacks/box/box.js";
+import '../../body.css';const e = "_body_42a1eac", f = { body: e }, l = d.forwardRef(function({ children: o, className: t, ...r }, s) {
+  return /* @__PURE__ */ c(
+    a,
     {
-      ref: m,
+      ref: s,
       as: "div",
-      className: a(d.body, r, "tcn-body"),
-      ...t,
+      className: m(f.body, t, "tcn-body"),
+      ...r,
       children: o
     }
   );
 });
 export {
-  x as Body
+  l as Body
 };
 //# sourceMappingURL=body.js.map

package/dist/layouts/body/body.js.map

@@ -1 +1 @@
-{"version":3,"file":"body.js","sources":["../../../src/layouts/body/body.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport styles from './body.module.css';\nimport { Box, type BoxProps } from '../../stacks/box/box.js';\n\nexport interface BodyProps extends Omit<BoxProps, 'as'> {}\n\n// Under construction: although this component behaves correctly, a content/child component that manages scrolling is needed.\n// For now HBody and VBody are recommended.\nexport const Body = React.forwardRef<HTMLElement, BodyProps>(function Body(\n  { children, className, ...props }: BodyProps,\n  ref\n) {\n  return (\n    <Box\n      ref={ref}\n      as=\"div\"\n      className={clsx(styles['body'], className, 'tcn-body')}\n      {...props}\n    >\n      {children}\n    </Box>\n  );\n});\n"],"names":["Body","React","children","className","props","ref","jsx","Box","clsx","styles"],"mappings":";;;;;AASO,MAAMA,IAAOC,EAAM,WAAmC,SAC3D,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,EAAA,GAC1BC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,IAAG;AAAA,MACH,WAAWG,EAAKC,EAAO,MAASN,GAAW,UAAU;AAAA,MACpD,GAAGC;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}
+{"version":3,"file":"body.js","sources":["../../../src/layouts/body/body.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { Box, type BoxProps } from '../../stacks/box/box.js';\n\nimport styles from './body.module.css';\n\nexport interface BodyProps extends Omit<BoxProps, 'as'> {}\n\n/**\n * The Body component will fill the available space in in a flex container.\n * It is typically used within a Scaffold or Rail component.\n * And typically will return a Scaffold or Rail component to determine the scroll behavior of the body\n * Example:\n * <Body>\n *   <Scaffold>\n *     <VerticalContent />\n *   </Scaffold>\n * </Body>\n * or\n * <Body>\n *   <Rail>\n *     <HorizontalContent />\n *   </Rail>\n * </Body>\n */\nexport const Body = React.forwardRef<HTMLElement, BodyProps>(function Body(\n  { children, className, ...props }: BodyProps,\n  ref\n) {\n  return (\n    <Box\n      ref={ref}\n      as=\"div\"\n      className={clsx(styles['body'], className, 'tcn-body')}\n      {...props}\n    >\n      {children}\n    </Box>\n  );\n});\n"],"names":["Body","React","children","className","props","ref","jsx","Box","clsx","styles"],"mappings":";;;;4CAyBaA,IAAOC,EAAM,WAAmC,SAC3D,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,EAAA,GAC1BC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,IAAG;AAAA,MACH,WAAWG,EAAKC,EAAO,MAASN,GAAW,UAAU;AAAA,MACpD,GAAGC;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}

package/dist/layouts/index.d.ts

@@ -6,8 +6,7 @@ export * from './list/list.js';
 export * from './sidebar_end/sidebar_end.js';
 export * from './sidebar_start/sidebar_start.js';
 export { Scaffold, type ScaffoldProps } from './scaffold/scaffold.js';
-export { HBody, type HBodyProps } from './body/h_body.js';
-export { VBody, type VBodyProps } from './body/v_body.js';
+export { Body, type BodyProps } from './body/body.js';
 export { Footer, type FooterProps } from './footer/footer.js';
 export { Header, type HeaderProps } from './header/header.js';
 export { UtilityBar, type UtilityBarProps } from './utility_bar/utility_bar.js';

package/dist/layouts/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/layouts/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AAEjD,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAChF,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,GAAG,EAAE,KAAK,QAAQ,EAAE,MAAM,cAAc,CAAC;AAClD,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AACnC,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAE9E,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAE3E,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,GACvB,MAAM,uCAAuC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/layouts/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AAEjD,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAChF,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,GAAG,EAAE,KAAK,QAAQ,EAAE,MAAM,cAAc,CAAC;AAClD,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AACnC,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAE9E,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAE3E,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,GACvB,MAAM,uCAAuC,CAAC"}