@tedi-design-system/react 17.0.0 → 17.1.0-rc.1

package/src/tedi/components/form/input-group/input-group.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),k=require("../../../../../external/classnames/index.cjs.js"),e=require("react"),m=require("../feedback-text/feedback-text.cjs.js"),R=require("../form-label/form-label.cjs.js"),w=require("./components/input/input.cjs.js"),A=require("./components/prefix/prefix.cjs.js"),F=require("./components/suffix/suffix.cjs.js"),u=require("./input-group.module.scss.cjs.js"),f=e.createContext(null),N=()=>{const n=e.useContext(f);if(!n)throw new Error("InputGroupContext missing");return n},T=()=>e.useContext(f),c=e.forwardRef(({className:n,addons:G=!0,helper:t,label:s,children:S,disabled:i,id:q,...j},P)=>{const x=e.useRef(null),y=e.useId(),o=q??y,[a,l]=e.useState(!1),[p,g]=e.useState(!1);e.useImperativeHandle(P,()=>({get root(){return x.current}}));const b=e.useMemo(()=>({hasPrefix:a,hasSuffix:p,disabled:i,hasExternalLabel:!!s,inputId:o,registerPrefix:()=>l(!0),unregisterPrefix:()=>l(!1),registerSuffix:()=>g(!0),unregisterSuffix:()=>g(!1)}),[o,a,p,i,s]),h=k.default(u.default["tedi-input-group"],{[u.default["tedi-input-group--addons"]]:G,[u.default["tedi-input-group--has-prefix"]]:a,[u.default["tedi-input-group--has-suffix"]]:p,[u.default["tedi-input-group--disabled"]]:i},n),v=()=>!t||Array.isArray(t)&&t.length===0?null:r.jsx("div",{className:u.default["tedi-input-group__feedback-wrapper"],children:Array.isArray(t)?t.map((C,I)=>r.jsx(m.FeedbackText,{...C,id:`group-helper-${I}`},I)):r.jsx(m.FeedbackText,{...t,id:"group-helper"})});return r.jsxs(f.Provider,{value:b,children:[s&&r.jsx(R.FormLabel,{...j,label:s,id:o}),r.jsx("div",{ref:x,className:h,"data-name":"tedi-input-group","aria-disabled":i,children:S}),v()]})});c.displayName="InputGroup";const d=c;d.Prefix=A.Prefix;d.Suffix=F.Suffix;d.Input=w.Input;exports.InputGroupBase=c;exports.useInputGroup=N;exports.useOptionalInputGroup=T;

package/src/tedi/components/form/input-group/input-group.d.ts

@@ -0,0 +1,87 @@
+import { default as React, ReactNode } from 'react';
+import { FeedbackTextProps } from '../feedback-text/feedback-text';
+import { FormLabelProps } from '../form-label/form-label';
+import { Input } from './components/input/input';
+import { Prefix } from './components/prefix/prefix';
+import { Suffix } from './components/suffix/suffix';
+export interface InputGroupProps extends FormLabelProps {
+    /**
+     * Additional class name(s) applied to the root element of the InputGroup.
+     * Useful for custom styling or layout overrides.
+     */
+    className?: string;
+    /**
+     * Enables merged styling between input and its prefix/suffix elements.
+     * When `true`, borders and radius are visually combined into a single control.
+     * Disable this when using non-standard addons (e.g. buttons) that should not visually merge.
+     *
+     * @default true
+     */
+    addons?: boolean;
+    /**
+     * Helper or feedback text displayed below the input group.
+     * Can be a single item or multiple messages (e.g. error + hint).
+     *
+     * Accepts the same props as `FeedbackText`.
+     */
+    helper?: FeedbackTextProps | FeedbackTextProps[];
+    /**
+     * InputGroup composition slots.
+     * Typically includes `InputGroup.Input` and optionally `InputGroup.Prefix` and/or `InputGroup.Suffix`.
+     */
+    children: ReactNode;
+    /**
+     * Disables the entire input group.
+     * Applies disabled styles to the group and propagates the disabled state
+     * to the input and any interactive prefix/suffix elements.
+     */
+    disabled?: boolean;
+}
+export interface InputGroupForwardRef {
+    root: HTMLDivElement | null;
+}
+export type InputGroupContextValue = {
+    /**
+     * Registers a prefix element within the InputGroup.
+     * Used internally to apply correct styling (e.g. border merging).
+     */
+    registerPrefix: () => void;
+    /**
+     * Unregisters the prefix element when it is removed.
+     */
+    unregisterPrefix: () => void;
+    /**
+     * Registers a suffix element within the InputGroup.
+     * Used internally to apply correct styling.
+     */
+    registerSuffix: () => void;
+    /**
+     * Unregisters the suffix element when it is removed.
+     */
+    unregisterSuffix: () => void;
+    /**
+     * Whether a prefix is currently present.
+     */
+    hasPrefix: boolean;
+    /**
+     * Whether a suffix is currently present.
+     */
+    hasSuffix: boolean;
+    /**
+     * Disabled state inherited from InputGroup.
+     * Consumers (Input, Prefix, Suffix) should use this to adjust
+     * behavior and styling.
+     */
+    disabled?: boolean;
+    hasExternalLabel?: boolean;
+    inputId?: string;
+};
+export declare const useInputGroup: () => InputGroupContextValue;
+export declare const useOptionalInputGroup: () => InputGroupContextValue | null;
+export declare const InputGroupBase: React.ForwardRefExoticComponent<InputGroupProps & React.RefAttributes<InputGroupForwardRef>>;
+declare const InputGroup: typeof InputGroupBase & {
+    Prefix: typeof Prefix;
+    Suffix: typeof Suffix;
+    Input: typeof Input;
+};
+export default InputGroup;

package/src/tedi/components/form/input-group/input-group.es.js

@@ -0,0 +1,61 @@
+import { jsxs as k, jsx as e } from "react/jsx-runtime";
+import F from "../../../../../external/classnames/index.es.js";
+import g, { forwardRef as H, useState as l, useImperativeHandle as j, useMemo as E, useContext as G, createContext as L } from "react";
+import { FeedbackText as I } from "../feedback-text/feedback-text.es.js";
+import { FormLabel as b } from "../form-label/form-label.es.js";
+import { Input as B } from "./components/input/input.es.js";
+import { Prefix as M } from "./components/prefix/prefix.es.js";
+import { Suffix as O } from "./components/suffix/suffix.es.js";
+import t from "./input-group.module.scss.es.js";
+const a = L(null), U = () => {
+  const u = G(a);
+  if (!u) throw new Error("InputGroupContext missing");
+  return u;
+}, W = () => G(a), P = H(
+  ({ className: u, addons: S = !0, helper: r, label: o, children: h, disabled: s, id: y, ...v }, C) => {
+    const m = g.useRef(null), N = g.useId(), i = y ?? N, [n, c] = l(!1), [p, d] = l(!1);
+    j(C, () => ({
+      get root() {
+        return m.current;
+      }
+    }));
+    const w = E(
+      () => ({
+        hasPrefix: n,
+        hasSuffix: p,
+        disabled: s,
+        hasExternalLabel: !!o,
+        inputId: i,
+        registerPrefix: () => c(!0),
+        unregisterPrefix: () => c(!1),
+        registerSuffix: () => d(!0),
+        unregisterSuffix: () => d(!1)
+      }),
+      [i, n, p, s, o]
+    ), A = F(
+      t["tedi-input-group"],
+      {
+        [t["tedi-input-group--addons"]]: S,
+        [t["tedi-input-group--has-prefix"]]: n,
+        [t["tedi-input-group--has-suffix"]]: p,
+        [t["tedi-input-group--disabled"]]: s
+      },
+      u
+    ), R = () => !r || Array.isArray(r) && r.length === 0 ? null : /* @__PURE__ */ e("div", { className: t["tedi-input-group__feedback-wrapper"], children: Array.isArray(r) ? r.map((_, x) => /* @__PURE__ */ e(I, { ..._, id: `group-helper-${x}` }, x)) : /* @__PURE__ */ e(I, { ...r, id: "group-helper" }) });
+    return /* @__PURE__ */ k(a.Provider, { value: w, children: [
+      o && /* @__PURE__ */ e(b, { ...v, label: o, id: i }),
+      /* @__PURE__ */ e("div", { ref: m, className: A, "data-name": "tedi-input-group", "aria-disabled": s, children: h }),
+      R()
+    ] });
+  }
+);
+P.displayName = "InputGroup";
+const f = P;
+f.Prefix = M;
+f.Suffix = O;
+f.Input = B;
+export {
+  P as InputGroupBase,
+  U as useInputGroup,
+  W as useOptionalInputGroup
+};

package/src/tedi/components/form/input-group/input-group.module.scss.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i={"tedi-input-group":"tedi-input-group-3de08ee1","tedi-input-group__prefix":"tedi-input-group__prefix-056c2ccf","tedi-input-group__suffix":"tedi-input-group__suffix-9c330042","tedi-input-group__input":"tedi-input-group__input-5454624d","tedi-input-group__prefix--no-inner-div":"tedi-input-group__prefix--no-inner-div-4bc9b815","tedi-input-group__suffix--no-inner-div":"tedi-input-group__suffix--no-inner-div-283ea370","tedi-input-group--addons":"tedi-input-group--addons-7bd99e72","tedi-input-group--disabled":"tedi-input-group--disabled-f5db06aa","tedi-input-group--has-prefix":"tedi-input-group--has-prefix-e845fcb0","tedi-input-group--has-suffix":"tedi-input-group--has-suffix-994ab888","tedi-input-group__feedback-wrapper":"tedi-input-group__feedback-wrapper-bfbe3cb2"};exports.default=i;

package/src/tedi/components/form/input-group/input-group.module.scss.es.js

@@ -0,0 +1,16 @@
+const i = {
+  "tedi-input-group": "tedi-input-group-3de08ee1",
+  "tedi-input-group__prefix": "tedi-input-group__prefix-056c2ccf",
+  "tedi-input-group__suffix": "tedi-input-group__suffix-9c330042",
+  "tedi-input-group__input": "tedi-input-group__input-5454624d",
+  "tedi-input-group__prefix--no-inner-div": "tedi-input-group__prefix--no-inner-div-4bc9b815",
+  "tedi-input-group__suffix--no-inner-div": "tedi-input-group__suffix--no-inner-div-283ea370",
+  "tedi-input-group--addons": "tedi-input-group--addons-7bd99e72",
+  "tedi-input-group--disabled": "tedi-input-group--disabled-f5db06aa",
+  "tedi-input-group--has-prefix": "tedi-input-group--has-prefix-e845fcb0",
+  "tedi-input-group--has-suffix": "tedi-input-group--has-suffix-994ab888",
+  "tedi-input-group__feedback-wrapper": "tedi-input-group__feedback-wrapper-bfbe3cb2"
+};
+export {
+  i as default
+};

package/src/tedi/components/form/search/search.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),r=require("../../../../../external/classnames/index.cjs.js"),y=require("react"),N=require("../../buttons/button/button.cjs.js"),j=require("../textfield/textfield.cjs.js"),t=require("./search.module.scss.cjs.js"),v=require("../../../providers/label-provider/use-labels.cjs.js"),u=y.forwardRef(({placeholder:c,isClearable:d=!0,searchIcon:n="search",onSearch:a,onChange:o,button:e,ariaLabel:f,...s},h)=>{const{getLabel:l}=v.useLabels(),m=q=>{q.key==="Enter"&&(a==null||a(s.value))},_=()=>{a==null||a(s.value)},x={...s,ref:h,inputClassName:r.default(t.default["tedi-search__input"],e&&t.default["tedi-search__input--has-button"]),placeholder:c,isClearable:d,onKeyDown:m,onChange:o,...e?{}:{icon:n}},b=c||l("search"),p=f??b;return i.jsxs("div",{className:r.default(t.default["tedi-search__wrapper"],s.className),role:"search","aria-label":p,children:[i.jsx(j.TextField,{...x}),e&&i.jsx(N.Button,{...e,onClick:_,className:r.default(t.default["tedi-search__button"],e.className),"aria-label":e.children?void 0:l("search"),children:e.children??l("search")})]})});u.displayName="Search";exports.Search=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),i=require("../../../../../external/classnames/index.cjs.js"),j=require("react"),v=require("../../buttons/button/button.cjs.js"),L=require("../textfield/textfield.cjs.js"),s=require("./search.module.scss.cjs.js"),N=require("../../../providers/label-provider/use-labels.cjs.js"),u=j.forwardRef(({placeholder:c,isClearable:d=!0,searchIcon:n="search",onSearch:a,onChange:o,button:e,ariaLabel:f,className:h,...t},_)=>{const{getLabel:l}=N.useLabels(),m=y=>{y.key==="Enter"&&(a==null||a(t.value))},x=()=>{a==null||a(t.value)},b={...t,ref:_,inputClassName:i.default(s.default["tedi-search__input"],e&&s.default["tedi-search__input--has-button"],h),placeholder:c,isClearable:d,onKeyDown:m,onChange:o,...e?{}:{icon:n}},p=c||l("search"),q=f??p;return r.jsxs("div",{className:i.default(s.default["tedi-search__wrapper"]),role:"search","aria-label":q,children:[r.jsx(L.TextField,{...b}),e&&r.jsx(v.Button,{...e,onClick:x,className:i.default(s.default["tedi-search__button"],e.className),"aria-label":e.children?void 0:l("search"),children:e.children??l("search")})]})});u.displayName="Search";exports.Search=u;

package/src/tedi/components/form/search/search.es.js

@@ -1,34 +1,44 @@
-import { jsxs as y, jsx as c } from "react/jsx-runtime";
+import { jsxs as v, jsx as c } from "react/jsx-runtime";
 import l from "../../../../../external/classnames/index.es.js";
-import { forwardRef as v } from "react";
-import { Button as w } from "../../buttons/button/button.es.js";
-import { TextField as L } from "../textfield/textfield.es.js";
-import r from "./search.module.scss.es.js";
-import { useLabels as k } from "../../../providers/label-provider/use-labels.es.js";
-const C = v(
-  ({ placeholder: t, isClearable: m = !0, searchIcon: o = "search", onSearch: s, onChange: d, button: e, ariaLabel: p, ...a }, n) => {
-    const { getLabel: i } = k(), f = (x) => {
-      x.key === "Enter" && (s == null || s(a.value));
-    }, h = () => {
-      s == null || s(a.value);
-    }, _ = {
-      ...a,
-      ref: n,
-      inputClassName: l(r["tedi-search__input"], e && r["tedi-search__input--has-button"]),
+import { forwardRef as w } from "react";
+import { Button as L } from "../../buttons/button/button.es.js";
+import { TextField as k } from "../textfield/textfield.es.js";
+import a from "./search.module.scss.es.js";
+import { useLabels as C } from "../../../providers/label-provider/use-labels.es.js";
+const b = w(
+  ({
+    placeholder: t,
+    isClearable: m = !0,
+    searchIcon: o = "search",
+    onSearch: s,
+    onChange: d,
+    button: e,
+    ariaLabel: p,
+    className: n,
+    ...r
+  }, f) => {
+    const { getLabel: i } = C(), h = (y) => {
+      y.key === "Enter" && (s == null || s(r.value));
+    }, _ = () => {
+      s == null || s(r.value);
+    }, u = {
+      ...r,
+      ref: f,
+      inputClassName: l(a["tedi-search__input"], e && a["tedi-search__input--has-button"], n),
       placeholder: t,
       isClearable: m,
-      onKeyDown: f,
+      onKeyDown: h,
       onChange: d,
       ...e ? {} : { icon: o }
-    }, u = t || i("search"), N = p ?? u;
-    return /* @__PURE__ */ y("div", { className: l(r["tedi-search__wrapper"], a.className), role: "search", "aria-label": N, children: [
-      /* @__PURE__ */ c(L, { ..._ }),
+    }, N = t || i("search"), x = p ?? N;
+    return /* @__PURE__ */ v("div", { className: l(a["tedi-search__wrapper"]), role: "search", "aria-label": x, children: [
+      /* @__PURE__ */ c(k, { ...u }),
       e && /* @__PURE__ */ c(
-        w,
+        L,
         {
           ...e,
-          onClick: h,
-          className: l(r["tedi-search__button"], e.className),
+          onClick: _,
+          className: l(a["tedi-search__button"], e.className),
           "aria-label": e.children ? void 0 : i("search"),
           children: e.children ?? i("search")
         }
@@ -36,7 +46,7 @@ const C = v(
     ] });
   }
 );
-C.displayName = "Search";
+b.displayName = "Search";
 export {
-  C as Search
+  b as Search
 };

package/src/tedi/components/form/select/components/select-control.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),l=require("../../../../../../external/classnames/index.cjs.js"),t=require("../select.module.scss.cjs.js"),s=require("../../../../../../external/react-select/dist/index-641ee5b8.esm.cjs.js"),n=e=>{const o=l.default(t.default["tedi-select__control"],e.className,{[t.default["tedi-select__control--focused"]]:e.isFocused});return c.jsx(s.c.Control,{...e,className:o})};exports.SelectControl=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),l=require("../../../../../../external/classnames/index.cjs.js"),t=require("../select.module.scss.cjs.js"),s=require("../../../../../../external/react-select/dist/index-641ee5b8.esm.cjs.js"),n=e=>{const o=l.default(t.default["tedi-select__control"],{[t.default["tedi-select__control--focused"]]:e.isFocused},e.className);return c.jsx(s.c.Control,{...e,className:o})};exports.SelectControl=n;

package/src/tedi/components/form/select/components/select-control.es.js

@@ -3,9 +3,13 @@ import c from "../../../../../../external/classnames/index.es.js";
 import t from "../select.module.scss.es.js";
 import { c as r } from "../../../../../../external/react-select/dist/index-641ee5b8.esm.es.js";
 const i = (o) => {
-  const s = c(t["tedi-select__control"], o.className, {
-    [t["tedi-select__control--focused"]]: o.isFocused
-  });
+  const s = c(
+    t["tedi-select__control"],
+    {
+      [t["tedi-select__control--focused"]]: o.isFocused
+    },
+    o.className
+  );
   return /* @__PURE__ */ e(r.Control, { ...o, className: s });
 };
 export {

package/src/tedi/components/form/select/select.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),ge=require("../../../../../external/classnames/index.cjs.js"),c=require("react"),Se=require("../../../../../external/react-select/dist/react-select.esm.cjs.js"),Me=require("../../../../../external/react-select/async/dist/react-select-async.esm.cjs.js"),be=require("../feedback-text/feedback-text.cjs.js"),Ie=require("../form-label/form-label.cjs.js"),qe=require("./components/select-clear-indicator.cjs.js"),Ce=require("./components/select-control.cjs.js"),Oe=require("./components/select-dropdown-indicator.cjs.js"),ve=require("./components/select-group.cjs.js"),Le=require("./components/select-group-heading.cjs.js"),Ve=require("./components/select-indicators-container.cjs.js"),ye=require("./components/select-input.cjs.js"),Re=require("./components/select-loading-indicator.cjs.js"),he=require("./components/select-menu.cjs.js"),xe=require("./components/select-menu-list.cjs.js"),je=require("./components/select-menu-portal.cjs.js"),we=require("./components/select-multi-value.cjs.js"),Ne=require("./components/select-multi-value-remove.cjs.js"),_e=require("./components/select-option.cjs.js"),Pe=require("./components/select-value-container.cjs.js"),n=require("./select.module.scss.cjs.js"),Te=require("../../../providers/label-provider/use-labels.cjs.js"),L=c.forwardRef((V,y)=>{const{options:R,defaultOptions:h,id:l,name:x,iconName:j="arrow_drop_down",label:w,required:f,value:N,defaultValue:_,tagsDirection:g="row",onChange:u,onInputChange:P,inputValue:T,loadOptions:G,isLoading:H,openMenuOnFocus:D=!1,openMenuOnClick:k=!0,tabSelectsValue:F=!1,disabled:S=!1,className:$,hideLabel:B=!1,helper:t,placeholder:E,invalid:z,valid:A,size:d,async:W=!1,renderOption:J,renderMessageListFooter:M,noOptionsMessage:K,loadingMessage:Q,multiple:p=!1,closeMenuOnSelect:U=!p,blurInputOnSelect:b=!1,autoFocus:X=!1,isClearable:Y=!0,isClearIndicatorVisible:Z=!1,isSearchable:I=!0,menuIsOpen:ee,onMenuClose:te,onMenuOpen:ne,onBlur:se,inputIsHidden:le,isTagRemovable:q=!1,optionGroupHeadingText:oe={modifiers:"small",color:"tertiary"},cacheOptions:ae=!0,showRadioButtons:re=!1,renderWithoutLabel:ie,tooltip:ce,classNames:C}=V,O=t?(t==null?void 0:t.id)??`${l}-helper`:void 0,a=c.useRef(null),{getLabel:v}=Te.useLabels();c.useImperativeHandle(y,()=>a.current);const ue=o=>{u==null||u(o),!b&&a.current&&setTimeout(()=>{var r,i;return(i=(r=a.current)==null?void 0:r.inputRef)==null?void 0:i.focus()},0)},de=c.useCallback(o=>s.jsx(xe.SelectMenuList,{...o,renderMessageListFooter:M}),[M]),pe=()=>{const o={ClearIndicator:e=>qe.SelectClearIndicator({isClearIndicatorVisible:Z,...e}),DropdownIndicator:()=>Oe.SelectDropDownIndicator({iconName:j}),IndicatorSeparator:()=>null,MenuPortal:je.SelectMenuPortal,Menu:he.SelectMenu,MenuList:de,Option:e=>_e.SelectOption({renderOption:J,multiple:p,showRadioButtons:re,...e}),Control:Ce.SelectControl,Input:ye.SelectInput,MultiValue:e=>we.SelectMultiValue({isTagRemovable:q,...e}),MultiValueRemove:Ne.SelectMultiValueRemove,Group:ve.SelectGroup,GroupHeading:e=>Le.SelectGroupHeading({optionGroupHeadingText:oe,...e}),IndicatorsContainer:Ve.SelectIndicatorsContainer,ValueContainer:Pe.SelectValueContainer,LoadingIndicator:Re.SelectLoadingIndicator},r=W?Me.default:Se.default,i=()=>v("select.no-options"),fe=()=>v("select.loading");return s.jsx(r,{id:l,"aria-describedby":O,autoFocus:X,ref:a,instanceId:l,className:"tedi-select__wrapper",name:x,options:R,defaultOptions:h,value:N,defaultValue:_,cacheOptions:ae,onChange:ue,onInputChange:P,onBlur:se,inputValue:T,inputId:`${l}-input`,loadOptions:G,isLoading:H,noOptionsMessage:K||i,loadingMessage:Q||fe,classNamePrefix:"select",components:o,isDisabled:S,isSearchable:I,menuIsOpen:ee,openMenuOnFocus:D,openMenuOnClick:k,tabSelectsValue:F,onMenuClose:te,onMenuOpen:ne,placeholder:E||"",isClearable:Y,backspaceRemovesValue:q,menuShouldScrollIntoView:!0,isMulti:p,hideSelectedOptions:!1,closeMenuOnSelect:U,blurInputOnSelect:b,menuPlacement:"auto",inputIsHidden:le,required:f,menuPortalTarget:document.body,menuPosition:"absolute",classNames:C?Object.fromEntries(Object.entries(C).map(([e,m])=>[e,typeof m=="string"?()=>m:m])):void 0,theme:e=>({...e,colors:{...e.colors,primary:"var(--tedi-blue-600)",danger:"var(--tedi-red-600)",dangerLight:"var(--tedi-red-200)"}}),styles:{input:e=>({...e,gridTemplateColumns:"0fr"})}})},me=ge.default(n.default["tedi-select"],$,{[n.default["tedi-select--invalid"]]:z||(t==null?void 0:t.type)==="error"},{[n.default["tedi-select--valid"]]:A||(t==null?void 0:t.type)==="valid"},{[n.default[`tedi-select--${d}`]]:d},{[n.default[`tedi-select--tags-${g}`]]:g},{[n.default["tedi-select--searchable"]]:I},{[n.default["tedi-select--disabled"]]:S});return s.jsxs("div",{"data-name":"select",className:me,children:[s.jsxs("div",{className:n.default["tedi-select__inner"],children:[s.jsx(Ie.FormLabel,{id:`${l}-input`,label:w,required:f,hideLabel:B,size:d,renderWithoutLabel:ie,tooltip:ce}),pe()]}),t&&s.jsx(be.FeedbackText,{...t,id:O})]})});L.displayName="Select";exports.Select=L;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),Ce=require("../../../../../external/classnames/index.cjs.js"),a=require("react"),Oe=require("../../../../../external/react-select/dist/react-select.esm.cjs.js"),Le=require("../../../../../external/react-select/async/dist/react-select-async.esm.cjs.js"),ve=require("../feedback-text/feedback-text.cjs.js"),Ve=require("../form-label/form-label.cjs.js"),g=require("../input-group/input-group.cjs.js"),he=require("./components/select-clear-indicator.cjs.js"),xe=require("./components/select-control.cjs.js"),ye=require("./components/select-dropdown-indicator.cjs.js"),Re=require("./components/select-group.cjs.js"),je=require("./components/select-group-heading.cjs.js"),we=require("./components/select-indicators-container.cjs.js"),Ne=require("./components/select-input.cjs.js"),_e=require("./components/select-loading-indicator.cjs.js"),He=require("./components/select-menu.cjs.js"),Pe=require("./components/select-menu-list.cjs.js"),Te=require("./components/select-menu-portal.cjs.js"),De=require("./components/select-multi-value.cjs.js"),ke=require("./components/select-multi-value-remove.cjs.js"),Fe=require("./components/select-option.cjs.js"),Ee=require("./components/select-value-container.cjs.js"),s=require("./select.module.scss.cjs.js"),Ge=require("../../../providers/label-provider/use-labels.cjs.js"),j=a.forwardRef((S,w)=>{var R;const{options:N,defaultOptions:_,id:b,name:H,iconName:P="arrow_drop_down",label:T,required:M,value:D,defaultValue:k,tagsDirection:I="row",onChange:u,onInputChange:F,inputValue:E,loadOptions:G,isLoading:B,openMenuOnFocus:$=!1,openMenuOnClick:z=!0,tabSelectsValue:A=!1,disabled:q=!1,className:C,hideLabel:W=!1,helper:t,placeholder:J,invalid:K,valid:Q,size:d,async:U=!1,renderOption:X,renderMessageListFooter:O,noOptionsMessage:Y,loadingMessage:Z,multiple:p=!1,closeMenuOnSelect:ee=!p,blurInputOnSelect:L=!1,autoFocus:te=!1,isClearable:se=!0,isClearIndicatorVisible:ne=!1,isSearchable:v=!0,menuIsOpen:le,onMenuClose:oe,onMenuOpen:ae,onBlur:re,inputIsHidden:ie,isTagRemovable:V=!1,optionGroupHeadingText:ce={modifiers:"small",color:"tertiary"},cacheOptions:ue=!0,showRadioButtons:de=!1,renderWithoutLabel:pe,tooltip:me,classNames:h}=S,n=(R=g.useOptionalInputGroup)==null?void 0:R.call(g),fe=a.useId(),ge=n==null?void 0:n.hasExternalLabel,m=S.id??(n==null?void 0:n.inputId)??fe,x=t?(t==null?void 0:t.id)??`${m}-helper`:void 0,r=a.useRef(null),{getLabel:y}=Ge.useLabels();a.useImperativeHandle(w,()=>r.current);const Se=o=>{u==null||u(o),!L&&r.current&&setTimeout(()=>{var i,c;return(c=(i=r.current)==null?void 0:i.inputRef)==null?void 0:c.focus()},0)},be=a.useCallback(o=>l.jsx(Pe.SelectMenuList,{...o,renderMessageListFooter:O}),[O]),Me=()=>{const o={ClearIndicator:e=>he.SelectClearIndicator({isClearIndicatorVisible:ne,...e}),DropdownIndicator:()=>ye.SelectDropDownIndicator({iconName:P}),IndicatorSeparator:()=>null,MenuPortal:Te.SelectMenuPortal,Menu:He.SelectMenu,MenuList:be,Option:e=>Fe.SelectOption({renderOption:X,multiple:p,showRadioButtons:de,...e}),Control:e=>xe.SelectControl({...e,className:C}),Input:Ne.SelectInput,MultiValue:e=>De.SelectMultiValue({isTagRemovable:V,...e}),MultiValueRemove:ke.SelectMultiValueRemove,Group:Re.SelectGroup,GroupHeading:e=>je.SelectGroupHeading({optionGroupHeadingText:ce,...e}),IndicatorsContainer:we.SelectIndicatorsContainer,ValueContainer:Ee.SelectValueContainer,LoadingIndicator:_e.SelectLoadingIndicator},i=U?Le.default:Oe.default,c=()=>y("select.no-options"),qe=()=>y("select.loading");return l.jsx(i,{id:m,"aria-describedby":x,autoFocus:te,ref:r,instanceId:b,className:"tedi-select__wrapper",name:H,options:N,defaultOptions:_,value:D,defaultValue:k,cacheOptions:ue,onChange:Se,onInputChange:F,onBlur:re,inputValue:E,inputId:`${b}-input`,loadOptions:G,isLoading:B,noOptionsMessage:Y||c,loadingMessage:Z||qe,classNamePrefix:"select",components:o,isDisabled:q,isSearchable:v,menuIsOpen:le,openMenuOnFocus:$,openMenuOnClick:z,tabSelectsValue:A,onMenuClose:oe,onMenuOpen:ae,placeholder:J||"",isClearable:se,backspaceRemovesValue:V,menuShouldScrollIntoView:!0,isMulti:p,hideSelectedOptions:!1,closeMenuOnSelect:ee,blurInputOnSelect:L,menuPlacement:"auto",inputIsHidden:ie,required:M,menuPortalTarget:document.body,menuPosition:"absolute",classNames:h?Object.fromEntries(Object.entries(h).map(([e,f])=>[e,typeof f=="string"?()=>f:f])):void 0,theme:e=>({...e,colors:{...e.colors,primary:"var(--tedi-blue-600)",danger:"var(--tedi-red-600)",dangerLight:"var(--tedi-red-200)"}}),styles:{input:e=>({...e,gridTemplateColumns:"0fr"})}})},Ie=Ce.default(s.default["tedi-select"],C,{[s.default["tedi-select--invalid"]]:K||(t==null?void 0:t.type)==="error"},{[s.default["tedi-select--valid"]]:Q||(t==null?void 0:t.type)==="valid"},{[s.default[`tedi-select--${d}`]]:d},{[s.default[`tedi-select--tags-${I}`]]:I},{[s.default["tedi-select--searchable"]]:v},{[s.default["tedi-select--disabled"]]:q});return l.jsxs("div",{"data-name":"select",className:Ie,children:[l.jsxs("div",{className:s.default["tedi-select__inner"],children:[!ge&&l.jsx(Ve.FormLabel,{id:`${m}-input`,label:T,required:M,hideLabel:W,size:d,renderWithoutLabel:pe,tooltip:me}),Me()]}),t&&l.jsx(ve.FeedbackText,{...t,id:x})]})});j.displayName="Select";exports.Select=j;

package/src/tedi/components/form/select/select.d.ts

@@ -8,8 +8,9 @@ declare module 'react-select/dist/declarations/src/Select' {
         inputIsHidden?: boolean;
     }
 }
-export interface SelectProps extends FormLabelProps {
-    id: string;
+export interface SelectProps extends Omit<FormLabelProps, 'id' | 'label'> {
+    id?: string;
+    label?: string;
     options?: OptionsOrGroups<ISelectOption, IGroupedOptions<ISelectOption>>;
     defaultOptions?: OptionsOrGroups<ISelectOption, IGroupedOptions<ISelectOption>> | boolean;
     placeholder?: string;