@mich8060/unified-design-system 0.2.39 → 0.2.41

package/dist/ai/manifest.json

@@ -2760,6 +2760,14 @@
       "slots": null,
       "states": [],
       "props": {
+        "outlined": {
+          "type": "enum",
+          "values": [
+            true,
+            false
+          ],
+          "default": false
+        },
         "appearance": {
           "type": "enum",
           "values": [
@@ -2803,6 +2811,7 @@
         }
       },
       "defaults": {
+        "outlined": false,
         "appearance": "label-only",
         "size": "compact",
         "color": "transparent",

package/dist/components/Dropdown/Dropdown.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),l=require("react"),q=require("../Icon/Icon.cjs"),y=require("../ActionMenu/ActionMenu.cjs");;/* empty css                 */const t="uds-dropdown",b={compact:"compact",default:null},g={default:null,focused:"focused",error:"error",disabled:"disabled"};function L({options:m=[],value:n,onChange:r,placeholder:o,size:f="default",state:p="default",placement:v="bottom-start",id:S,className:h="",disabled:a=!1,...j}){const[c,w]=l.useState(!1),x=l.useId(),C=S||`dropdown-${x}`,u=l.useMemo(()=>m.map(e=>typeof e=="string"?{value:e,label:e}:e),[m]),$=a?"disabled":p==="default"&&c?"focused":p,i=u.find(e=>e.value===n),d=typeof o=="string"&&o.trim().length>0?o.trim():"Select an option",M=i?i.label:d,N=l.useMemo(()=>u.map(e=>({id:e.value,label:e.label,active:e.value===n,onClick:()=>{r&&!a&&r(e.value)}})),[u,n,r,a]),I=[t,b[f]&&`${t}--${b[f]}`,g[$]&&`${t}--${g[$]}`,c&&`${t}--open`,h].filter(Boolean).join(" "),_={...j};delete _.label;const O=s.jsxs("button",{type:"button",id:C,className:`${t}__trigger`,disabled:a,"aria-label":d,..._,children:[s.jsx("span",{className:`${t}__value ${i?"":`${t}__value--placeholder`}`,children:M}),s.jsx(q.default,{name:"CaretDown",size:16,appearance:"regular",className:`${t}__icon ${c?`${t}__icon--open`:""}`})]});return s.jsx("div",{className:`${t}-outer`,children:s.jsx(y.default,{trigger:O,items:N,variant:"search",searchPlaceholder:`Search ${d.toLowerCase()}`,placement:v,fullWidth:!0,disabled:a,onOpenChange:w,className:I,menuClassName:`${t}__menu`})})}const k=l.memo(L);exports.default=k;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),l=require("react"),L=require("../Icon/Icon.cjs"),k=require("../ActionMenu/ActionMenu.cjs");;/* empty css                 */const t="uds-dropdown",b={compact:"compact",default:null},g={default:null,focused:"focused",error:"error",disabled:"disabled"};function A({options:m=[],value:n,onChange:r,placeholder:o,size:f="default",state:p="default",placement:v="bottom-start",searchable:S=!0,menuFullWidth:h=!0,id:j,className:w="",disabled:a=!1,...x}){const[c,C]=l.useState(!1),M=l.useId(),N=j||`dropdown-${M}`,u=l.useMemo(()=>m.map(e=>typeof e=="string"?{value:e,label:e}:e),[m]),$=a?"disabled":p==="default"&&c?"focused":p,i=u.find(e=>e.value===n),d=typeof o=="string"&&o.trim().length>0?o.trim():"Select an option",I=i?i.label:d,O=l.useMemo(()=>u.map(e=>({id:e.value,label:e.label,active:e.value===n,onClick:()=>{r&&!a&&r(e.value)}})),[u,n,r,a]),q=[t,b[f]&&`${t}--${b[f]}`,g[$]&&`${t}--${g[$]}`,c&&`${t}--open`,w].filter(Boolean).join(" "),_={...x};delete _.label;const y=s.jsxs("button",{type:"button",id:N,className:`${t}__trigger`,disabled:a,"aria-label":d,..._,children:[s.jsx("span",{className:`${t}__value ${i?"":`${t}__value--placeholder`}`,children:I}),s.jsx(L.default,{name:"CaretDown",size:16,appearance:"regular",className:`${t}__icon ${c?`${t}__icon--open`:""}`})]});return s.jsx("div",{className:`${t}-outer`,children:s.jsx(k.default,{trigger:y,items:O,variant:S?"search":"default",searchPlaceholder:`Search ${d.toLowerCase()}`,placement:v,fullWidth:h,disabled:a,onOpenChange:C,className:q,menuClassName:`${t}__menu`})})}const B=l.memo(A);exports.default=B;

package/dist/components/Dropdown/Dropdown.js

@@ -1 +1 @@
-import{jsx as s,jsxs as M}from"react/jsx-runtime";import j,{useState as k,useId as A,useMemo as _}from"react";import B from"../Icon/Icon.js";import D from"../ActionMenu/ActionMenu.js";/* empty css              */const a="uds-dropdown",b={compact:"compact",default:null},g={default:null,focused:"focused",error:"error",disabled:"disabled"};function z({options:d=[],value:o,onChange:l,placeholder:r,size:m="default",state:p="default",placement:h="bottom-start",id:v,className:w="",disabled:t=!1,...C}){const[n,N]=k(!1),S=A(),I=v||`dropdown-${S}`,c=_(()=>d.map(e=>typeof e=="string"?{value:e,label:e}:e),[d]),f=t?"disabled":p==="default"&&n?"focused":p,i=c.find(e=>e.value===o),u=typeof r=="string"&&r.trim().length>0?r.trim():"Select an option",O=i?i.label:u,x=_(()=>c.map(e=>({id:e.value,label:e.label,active:e.value===o,onClick:()=>{l&&!t&&l(e.value)}})),[c,o,l,t]),y=[a,b[m]&&`${a}--${b[m]}`,g[f]&&`${a}--${g[f]}`,n&&`${a}--open`,w].filter(Boolean).join(" "),$={...C};delete $.label;const L=M("button",{type:"button",id:I,className:`${a}__trigger`,disabled:t,"aria-label":u,...$,children:[s("span",{className:`${a}__value ${i?"":`${a}__value--placeholder`}`,children:O}),s(B,{name:"CaretDown",size:16,appearance:"regular",className:`${a}__icon ${n?`${a}__icon--open`:""}`})]});return s("div",{className:`${a}-outer`,children:s(D,{trigger:L,items:x,variant:"search",searchPlaceholder:`Search ${u.toLowerCase()}`,placement:h,fullWidth:!0,disabled:t,onOpenChange:N,className:y,menuClassName:`${a}__menu`})})}const q=j.memo(z);export{q as default};
+import{jsx as s,jsxs as k}from"react/jsx-runtime";import A,{useState as B,useId as D,useMemo as _}from"react";import z from"../Icon/Icon.js";import P from"../ActionMenu/ActionMenu.js";/* empty css              */const t="uds-dropdown",b={compact:"compact",default:null},g={default:null,focused:"focused",error:"error",disabled:"disabled"};function E({options:d=[],value:o,onChange:l,placeholder:r,size:m="default",state:p="default",placement:h="bottom-start",searchable:v=!0,menuFullWidth:w=!0,id:C,className:N="",disabled:a=!1,...S}){const[n,I]=B(!1),O=D(),x=C||`dropdown-${O}`,c=_(()=>d.map(e=>typeof e=="string"?{value:e,label:e}:e),[d]),f=a?"disabled":p==="default"&&n?"focused":p,u=c.find(e=>e.value===o),i=typeof r=="string"&&r.trim().length>0?r.trim():"Select an option",y=u?u.label:i,L=_(()=>c.map(e=>({id:e.value,label:e.label,active:e.value===o,onClick:()=>{l&&!a&&l(e.value)}})),[c,o,l,a]),M=[t,b[m]&&`${t}--${b[m]}`,g[f]&&`${t}--${g[f]}`,n&&`${t}--open`,N].filter(Boolean).join(" "),$={...S};delete $.label;const j=k("button",{type:"button",id:x,className:`${t}__trigger`,disabled:a,"aria-label":i,...$,children:[s("span",{className:`${t}__value ${u?"":`${t}__value--placeholder`}`,children:y}),s(z,{name:"CaretDown",size:16,appearance:"regular",className:`${t}__icon ${n?`${t}__icon--open`:""}`})]});return s("div",{className:`${t}-outer`,children:s(P,{trigger:j,items:L,variant:v?"search":"default",searchPlaceholder:`Search ${i.toLowerCase()}`,placement:h,fullWidth:w,disabled:a,onOpenChange:I,className:M,menuClassName:`${t}__menu`})})}const G=A.memo(E);export{G as default};

package/dist/components/SearchInput/SearchInput.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),n=require("../TextInput/TextInput.cjs");function r(e){return t.jsx(n.default,{type:"search",icon:"MagnifyingGlass",iconPosition:"left",placeholder:e.placeholder??"Search",...e})}exports.SearchInput=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),h=require("../Dropdown/Dropdown.cjs");;/* empty css                     */const S=require("../TextInput/TextInput.cjs"),m="uds-search-input";function p({dropdownOptions:e,dropdownValue:c,onDropdownChange:t,dropdownPlaceholder:o="All",dropdownDisabled:u=!1,dropdownPlacement:i="bottom-end",className:f="",disabled:l=!1,size:n="default",...r}){const d=!!(e&&e.length>0)?s.jsx(h.default,{options:e,value:c,onChange:a=>{typeof a=="string"&&(t==null||t(a))},placeholder:o,size:n,placement:i,disabled:l||u,searchable:!1,menuFullWidth:!1,className:`${m}__dropdown-control`}):null;return s.jsx(S.default,{type:"search",icon:"MagnifyingGlass",iconPosition:"left",placeholder:r.placeholder??"Search",className:f,disabled:l,size:n,endAdornment:d,...r})}exports.SearchInput=p;

package/dist/components/SearchInput/SearchInput.js

@@ -1 +1 @@
-import{jsx as o}from"react/jsx-runtime";import r from"../TextInput/TextInput.js";function i(e){return o(r,{type:"search",icon:"MagnifyingGlass",iconPosition:"left",placeholder:e.placeholder??"Search",...e})}export{i as SearchInput};
+import{jsx as n}from"react/jsx-runtime";import u from"../Dropdown/Dropdown.js";/* empty css                  */import h from"../TextInput/TextInput.js";const d="uds-search-input";function x({dropdownOptions:e,dropdownValue:c,onDropdownChange:l,dropdownPlaceholder:s="All",dropdownDisabled:f=!1,dropdownPlacement:i="bottom-end",className:m="",disabled:t=!1,size:o="default",...r}){const p=!!(e&&e.length>0)?n(u,{options:e,value:c,onChange:a=>{typeof a=="string"&&(l==null||l(a))},placeholder:s,size:o,placement:i,disabled:t||f,searchable:!1,menuFullWidth:!1,className:`${d}__dropdown-control`}):null;return n(h,{type:"search",icon:"MagnifyingGlass",iconPosition:"left",placeholder:r.placeholder??"Search",className:m,disabled:t,size:o,endAdornment:p,...r})}export{x as SearchInput};

package/dist/components/Tabs/TabItem.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),d=require("react"),v=require("../Icon/Icon.cjs"),x=require("../Tag/Tag.cjs"),t="uds-tabs-item";function T({label:s,appearance:m="underline",active:u=!1,icon:r,tag:e,tagVariant:b="neutral",className:p="",onClick:n,...i}){const y=[t,`${t}--${m}`,u&&"active",p].filter(Boolean).join(" "),j=n?"button":"div",_=!!r&&typeof r=="string",S=e===!0||e!==!1&&(typeof e=="number"||typeof e=="string");let a="";s!=null&&(typeof s=="string"?a=s:a=String(s));const c={};return Object.keys(i).forEach(f=>{const l=i[f];(l==null||typeof l!="object"||d.isValidElement(l))&&(c[f]=l)}),o.jsxs(j,{className:y,onClick:n,role:n?"tab":void 0,"aria-selected":n?u:void 0,...c,children:[_&&o.jsx(v.default,{name:r,size:16,appearance:"bold",className:`${t}__icon`}),a&&o.jsx("span",{className:`${t}__label`,children:a}),S&&o.jsx(x.default,{label:typeof e=="number"||typeof e=="string"?String(e):"Label",size:"default",appearance:"label-only",rounded:!0,solid:!0,color:b==="sky"?"sky":"neutral",className:`${t}__tag`})]})}const $=d.memo(T);exports.default=$;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),d=require("react"),v=require("../Icon/Icon.cjs"),x=require("../Tag/Tag.cjs"),t="uds-tabs-item";function T({label:s,appearance:m="underline",active:c=!1,icon:l,tag:e,tagVariant:b="neutral",className:p="",onClick:n,...i}){const y=[t,`${t}--${m}`,c&&"active",p].filter(Boolean).join(" "),j=n?"button":"div",_=!!l&&typeof l=="string",S=e===!0||e!==!1&&(typeof e=="number"||typeof e=="string");let a="";s!=null&&(typeof s=="string"?a=s:a=String(s));const u={};return Object.keys(i).forEach(f=>{const o=i[f];(o==null||typeof o!="object"||d.isValidElement(o))&&(u[f]=o)}),r.jsxs(j,{className:y,onClick:n,role:n?"tab":void 0,"aria-selected":n?c:void 0,...u,children:[_&&r.jsx(v.default,{name:l,size:16,appearance:"bold",className:`${t}__icon`}),a&&r.jsx("span",{className:`${t}__label`,children:a}),S&&r.jsx(x.default,{label:typeof e=="number"||typeof e=="string"?String(e):"Label",size:"compact",appearance:"label-only",rounded:!0,solid:!0,color:b==="sky"?"sky":"neutral",className:`${t}__tag`})]})}const $=d.memo(T);exports.default=$;

package/dist/components/Tabs/TabItem.js

@@ -1 +1 @@
-import{jsxs as j,jsx as l}from"react/jsx-runtime";import u from"react";import N from"../Icon/Icon.js";import S from"../Tag/Tag.js";const t="uds-tabs-item";function T({label:s,appearance:p="underline",active:i=!1,icon:r,tag:e,tagVariant:d="neutral",className:b="",onClick:o,...m}){const y=[t,`${t}--${p}`,i&&"active",b].filter(Boolean).join(" "),_=o?"button":"div",$=!!r&&typeof r=="string",h=e===!0||e!==!1&&(typeof e=="number"||typeof e=="string");let a="";s!=null&&(typeof s=="string"?a=s:a=String(s));const c={};return Object.keys(m).forEach(f=>{const n=m[f];(n==null||typeof n!="object"||u.isValidElement(n))&&(c[f]=n)}),j(_,{className:y,onClick:o,role:o?"tab":void 0,"aria-selected":o?i:void 0,...c,children:[$&&l(N,{name:r,size:16,appearance:"bold",className:`${t}__icon`}),a&&l("span",{className:`${t}__label`,children:a}),h&&l(S,{label:typeof e=="number"||typeof e=="string"?String(e):"Label",size:"default",appearance:"label-only",rounded:!0,solid:!0,color:d==="sky"?"sky":"neutral",className:`${t}__tag`})]})}const g=u.memo(T);export{g as default};
+import{jsxs as j,jsx as l}from"react/jsx-runtime";import p from"react";import N from"../Icon/Icon.js";import S from"../Tag/Tag.js";const t="uds-tabs-item";function T({label:s,appearance:u="underline",active:i=!1,icon:r,tag:e,tagVariant:d="neutral",className:b="",onClick:o,...c}){const y=[t,`${t}--${u}`,i&&"active",b].filter(Boolean).join(" "),_=o?"button":"div",$=!!r&&typeof r=="string",h=e===!0||e!==!1&&(typeof e=="number"||typeof e=="string");let a="";s!=null&&(typeof s=="string"?a=s:a=String(s));const m={};return Object.keys(c).forEach(f=>{const n=c[f];(n==null||typeof n!="object"||p.isValidElement(n))&&(m[f]=n)}),j(_,{className:y,onClick:o,role:o?"tab":void 0,"aria-selected":o?i:void 0,...m,children:[$&&l(N,{name:r,size:16,appearance:"bold",className:`${t}__icon`}),a&&l("span",{className:`${t}__label`,children:a}),h&&l(S,{label:typeof e=="number"||typeof e=="string"?String(e):"Label",size:"compact",appearance:"label-only",rounded:!0,solid:!0,color:d==="sky"?"sky":"neutral",className:`${t}__tag`})]})}const g=p.memo(T);export{g as default};

package/dist/components/Tag/Tag.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),b=require("../Icon/Icon.cjs");;/* empty css            */const e="uds-tag",u={"label-only":"label-only","icon-left":"icon-left"},i={compact:"compact",default:"default"},d={transparent:"transparent",neutral:"neutral",red:"red",orange:"orange",yellow:"yellow",emerald:"emerald",green:"green",sky:"sky",cyan:"cyan",blue:"blue",indigo:"indigo",purple:"purple",fuchsia:"fuchsia",magenta:"magenta",inverse:"inverse"};function _({label:t="Label",appearance:s="label-only",size:l="compact",color:r="transparent",rounded:p=!0,solid:m=!1,icon:a,className:f="",onClick:o,...g}){const y=[e,u[s]&&`${e}--${u[s]}`,i[l]&&`${e}--${i[l]}`,d[r]&&`${e}--${d[r]}`,p&&`${e}--rounded`,m&&`${e}--solid`,f].filter(Boolean).join(" "),$=o?"button":"span",c=s==="icon-left"&&a;return n.jsxs($,{className:y,onClick:o,...g,children:[c&&typeof a=="string"&&n.jsx(b.default,{name:a,size:l==="compact"?10:12,appearance:"regular",className:`${e}__icon`}),c&&typeof a!="string"&&n.jsx("span",{className:`${e}__icon`,children:a}),t&&n.jsx("span",{className:`${e}__label`,children:t})]})}exports.default=_;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),b=require("../Icon/Icon.cjs");;/* empty css            */const e="uds-tag",_={"label-only":"label-only","icon-left":"icon-left"},u={compact:"compact",default:"default"},j={transparent:"transparent",neutral:"neutral",red:"red",orange:"orange",yellow:"yellow",emerald:"emerald",green:"green",sky:"sky",cyan:"cyan",blue:"blue",indigo:"indigo",purple:"purple",fuchsia:"fuchsia",magenta:"magenta",inverse:"inverse"};function h({label:l="Label",appearance:t="label-only",size:s="compact",color:i="transparent",rounded:p=!0,solid:r=!1,outlined:d=!1,icon:a,className:m="",onClick:o,...f}){const g=d&&!r,y=[e,`${e}--${_[t]}`,u[s]&&`${e}--${u[s]}`,`${e}--${j[i]}`,p&&`${e}--rounded`,r&&`${e}--solid`,g&&`${e}--outlined`,m].filter(Boolean).join(" "),$=o?"button":"span",c=t==="icon-left"&&a;return n.jsxs($,{className:y,onClick:o,...f,children:[c&&typeof a=="string"&&n.jsx(b.default,{name:a,size:s==="compact"?10:12,appearance:"regular",className:`${e}__icon`}),c&&typeof a!="string"&&n.jsx("span",{className:`${e}__icon`,children:a}),l&&n.jsx("span",{className:`${e}__label`,children:l})]})}exports.default=h;

package/dist/components/Tag/Tag.js

@@ -1 +1 @@
-import{jsxs as b,jsx as l}from"react/jsx-runtime";import _ from"../Icon/Icon.js";/* empty css         */const e="uds-tag",p={"label-only":"label-only","icon-left":"icon-left"},i={compact:"compact",default:"default"},m={transparent:"transparent",neutral:"neutral",red:"red",orange:"orange",yellow:"yellow",emerald:"emerald",green:"green",sky:"sky",cyan:"cyan",blue:"blue",indigo:"indigo",purple:"purple",fuchsia:"fuchsia",magenta:"magenta",inverse:"inverse"};function x({label:t="Label",appearance:n="label-only",size:s="compact",color:r="transparent",rounded:u=!0,solid:d=!1,icon:a,className:f="",onClick:o,...g}){const y=[e,p[n]&&`${e}--${p[n]}`,i[s]&&`${e}--${i[s]}`,m[r]&&`${e}--${m[r]}`,u&&`${e}--rounded`,d&&`${e}--solid`,f].filter(Boolean).join(" "),$=o?"button":"span",c=n==="icon-left"&&a;return b($,{className:y,onClick:o,...g,children:[c&&typeof a=="string"&&l(_,{name:a,size:s==="compact"?10:12,appearance:"regular",className:`${e}__icon`}),c&&typeof a!="string"&&l("span",{className:`${e}__icon`,children:a}),t&&l("span",{className:`${e}__label`,children:t})]})}export{x as default};
+import{jsxs as b,jsx as s}from"react/jsx-runtime";import _ from"../Icon/Icon.js";/* empty css         */const e="uds-tag",h={"label-only":"label-only","icon-left":"icon-left"},p={compact:"compact",default:"default"},N={transparent:"transparent",neutral:"neutral",red:"red",orange:"orange",yellow:"yellow",emerald:"emerald",green:"green",sky:"sky",cyan:"cyan",blue:"blue",indigo:"indigo",purple:"purple",fuchsia:"fuchsia",magenta:"magenta",inverse:"inverse"};function M({label:l="Label",appearance:t="label-only",size:n="compact",color:i="transparent",rounded:m=!0,solid:o=!1,outlined:u=!1,icon:a,className:d="",onClick:r,...f}){const g=u&&!o,$=[e,`${e}--${h[t]}`,p[n]&&`${e}--${p[n]}`,`${e}--${N[i]}`,m&&`${e}--rounded`,o&&`${e}--solid`,g&&`${e}--outlined`,d].filter(Boolean).join(" "),y=r?"button":"span",c=t==="icon-left"&&a;return b(y,{className:$,onClick:r,...f,children:[c&&typeof a=="string"&&s(_,{name:a,size:n==="compact"?10:12,appearance:"regular",className:`${e}__icon`}),c&&typeof a!="string"&&s("span",{className:`${e}__icon`,children:a}),l&&s("span",{className:`${e}__label`,children:l})]})}export{M as default};

package/dist/components/TextInput/TextInput.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),G=require("react"),O=require("../Icon/Icon.cjs");;/* empty css                   */const e="uds-input",j={compact:"compact",default:"default"},I={default:"default",focused:"focused",error:"error",disabled:"disabled"};function R({value:x,onChange:v,placeholder:g,type:N="text",size:l="default",state:h="default",disabled:c=!1,icon:n,iconPosition:d="right",onIconClick:u,id:B,label:i,helperText:a,errorText:r,className:S="","aria-describedby":y,...C}){const s=c?"disabled":h,q=G.useId().replace(/:/g,""),o=B??(!!i||!!a||!!r?`${e}-${q}`:void 0),p=a?`${o}-helper-text`:void 0,$=r?`${o}-error-text`:void 0,M=[y,s==="error"?$:p].filter(Boolean).join(" ")||void 0,w=[e,j[l]&&`${e}--${j[l]}`,I[s]&&`${e}--${I[s]}`,n&&`${e}--has-icon-${d}`].filter(Boolean).join(" "),f=[`${e}-wrapper`,n&&`${e}-wrapper--icon-${d}`,S].filter(Boolean).join(" "),_=t.jsx("input",{id:o,type:N,className:w,value:x,onChange:v,placeholder:g,disabled:c||s==="disabled","aria-invalid":s==="error"?!0:void 0,"aria-describedby":M,...C}),m=()=>{if(!n)return t.jsx("div",{className:f,children:_});const E=l==="compact"?16:20,b=typeof n=="string"?t.jsx(O.default,{name:n,size:E}):n,A=u?t.jsx("button",{type:"button",className:`${e}__icon ${e}__icon--${d} ${e}__icon--clickable`,onClick:u,disabled:c||s==="disabled",tabIndex:-1,"aria-label":"Input action",children:b}):t.jsx("span",{className:`${e}__icon ${e}__icon--${d}`,children:b});return t.jsxs("div",{className:f,children:[_,A]})};return!i&&!a&&!r?m():t.jsxs("div",{className:`${e}-field`,children:[i?t.jsx("label",{className:`${e}__label`,htmlFor:o,children:i}):null,m(),s==="error"&&r?t.jsx("p",{id:$,className:`${e}__supporting-text ${e}__supporting-text--error`,children:r}):null,s!=="error"&&a?t.jsx("p",{id:p,className:`${e}__supporting-text`,children:a}):null]})}exports.default=R;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),R=require("react"),k=require("../Icon/Icon.cjs");;/* empty css                   */const e="uds-input",x={compact:"compact",default:"default"},I={default:"default",focused:"focused",error:"error",disabled:"disabled"};function z({value:h,onChange:N,placeholder:v,type:g="text",size:o="default",state:B="default",disabled:u=!1,icon:t,iconPosition:i="right",onIconClick:p,id:S,label:d,helperText:r,errorText:l,endAdornment:n,className:y="","aria-describedby":C,...q}){const a=u?"disabled":B,w=R.useId().replace(/:/g,""),c=S??(!!d||!!r||!!l?`${e}-${w}`:void 0),$=r?`${c}-helper-text`:void 0,_=l?`${c}-error-text`:void 0,M=[C,a==="error"?_:$].filter(Boolean).join(" ")||void 0,E=[e,x[o]&&`${e}--${x[o]}`,I[a]&&`${e}--${I[a]}`,t&&`${e}--has-icon-${i}`,n&&`${e}--has-end-adornment`].filter(Boolean).join(" "),f=[`${e}-wrapper`,t&&`${e}-wrapper--icon-${i}`,n&&`${e}-wrapper--has-end-adornment`,y].filter(Boolean).join(" "),m=s.jsx("input",{id:c,type:g,className:E,value:h,onChange:N,placeholder:v,disabled:u||a==="disabled","aria-invalid":a==="error"?!0:void 0,"aria-describedby":M,...q}),j=()=>{if(!t)return s.jsxs("div",{className:f,children:[m,n?s.jsx("span",{className:`${e}__end-adornment`,children:n}):null]});const G=o==="compact"?16:20,b=typeof t=="string"?s.jsx(k.default,{name:t,size:G}):t,O=p?s.jsx("button",{type:"button",className:`${e}__icon ${e}__icon--${i} ${e}__icon--clickable`,onClick:p,disabled:u||a==="disabled",tabIndex:-1,"aria-label":"Input action",children:b}):s.jsx("span",{className:`${e}__icon ${e}__icon--${i}`,children:b});return s.jsxs("div",{className:f,children:[m,O,n?s.jsx("span",{className:`${e}__end-adornment`,children:n}):null]})};return!d&&!r&&!l?j():s.jsxs("div",{className:`${e}-field`,children:[d?s.jsx("label",{className:`${e}__label`,htmlFor:c,children:d}):null,j(),a==="error"&&l?s.jsx("p",{id:_,className:`${e}__supporting-text ${e}__supporting-text--error`,children:l}):null,a!=="error"&&r?s.jsx("p",{id:$,className:`${e}__supporting-text`,children:r}):null]})}exports.default=z;

package/dist/components/TextInput/TextInput.js

@@ -1 +1 @@
-import{jsxs as b,jsx as a}from"react/jsx-runtime";import M from"react";import k from"../Icon/Icon.js";/* empty css                */const e="uds-input",N={compact:"compact",default:"default"},h={default:"default",focused:"focused",error:"error",disabled:"disabled"};function D({value:v,onChange:g,placeholder:B,type:x="text",size:c="default",state:S="default",disabled:l=!1,icon:n,iconPosition:o="right",onIconClick:p,id:j,label:d,helperText:s,errorText:r,className:y="","aria-describedby":C,...w}){const t=l?"disabled":S,E=M.useId().replace(/:/g,""),i=j??(!!d||!!s||!!r?`${e}-${E}`:void 0),u=s?`${i}-helper-text`:void 0,m=r?`${i}-error-text`:void 0,z=[C,t==="error"?m:u].filter(Boolean).join(" ")||void 0,A=[e,N[c]&&`${e}--${N[c]}`,h[t]&&`${e}--${h[t]}`,n&&`${e}--has-icon-${o}`].filter(Boolean).join(" "),$=[`${e}-wrapper`,n&&`${e}-wrapper--icon-${o}`,y].filter(Boolean).join(" "),f=a("input",{id:i,type:x,className:A,value:v,onChange:g,placeholder:B,disabled:l||t==="disabled","aria-invalid":t==="error"?!0:void 0,"aria-describedby":z,...w}),_=()=>{if(!n)return a("div",{className:$,children:f});const I=typeof n=="string"?a(k,{name:n,size:c==="compact"?16:20}):n,G=p?a("button",{type:"button",className:`${e}__icon ${e}__icon--${o} ${e}__icon--clickable`,onClick:p,disabled:l||t==="disabled",tabIndex:-1,"aria-label":"Input action",children:I}):a("span",{className:`${e}__icon ${e}__icon--${o}`,children:I});return b("div",{className:$,children:[f,G]})};return!d&&!s&&!r?_():b("div",{className:`${e}-field`,children:[d?a("label",{className:`${e}__label`,htmlFor:i,children:d}):null,_(),t==="error"&&r?a("p",{id:m,className:`${e}__supporting-text ${e}__supporting-text--error`,children:r}):null,t!=="error"&&s?a("p",{id:u,className:`${e}__supporting-text`,children:s}):null]})}export{D as default};
+import{jsxs as u,jsx as a}from"react/jsx-runtime";import F from"react";import L from"../Icon/Icon.js";/* empty css                */const e="uds-input",N={compact:"compact",default:"default"},v={default:"default",focused:"focused",error:"error",disabled:"disabled"};function J({value:g,onChange:B,placeholder:x,type:S="text",size:c="default",state:j="default",disabled:p=!1,icon:s,iconPosition:l="right",onIconClick:$,id:y,label:o,helperText:r,errorText:i,endAdornment:n,className:C="","aria-describedby":w,...E}){const t=p?"disabled":j,z=F.useId().replace(/:/g,""),d=y??(!!o||!!r||!!i?`${e}-${z}`:void 0),m=r?`${d}-helper-text`:void 0,f=i?`${d}-error-text`:void 0,G=[w,t==="error"?f:m].filter(Boolean).join(" ")||void 0,M=[e,N[c]&&`${e}--${N[c]}`,v[t]&&`${e}--${v[t]}`,s&&`${e}--has-icon-${l}`,n&&`${e}--has-end-adornment`].filter(Boolean).join(" "),_=[`${e}-wrapper`,s&&`${e}-wrapper--icon-${l}`,n&&`${e}-wrapper--has-end-adornment`,C].filter(Boolean).join(" "),I=a("input",{id:d,type:S,className:M,value:g,onChange:B,placeholder:x,disabled:p||t==="disabled","aria-invalid":t==="error"?!0:void 0,"aria-describedby":G,...E}),b=()=>{if(!s)return u("div",{className:_,children:[I,n?a("span",{className:`${e}__end-adornment`,children:n}):null]});const h=typeof s=="string"?a(L,{name:s,size:c==="compact"?16:20}):s,k=$?a("button",{type:"button",className:`${e}__icon ${e}__icon--${l} ${e}__icon--clickable`,onClick:$,disabled:p||t==="disabled",tabIndex:-1,"aria-label":"Input action",children:h}):a("span",{className:`${e}__icon ${e}__icon--${l}`,children:h});return u("div",{className:_,children:[I,k,n?a("span",{className:`${e}__end-adornment`,children:n}):null]})};return!o&&!r&&!i?b():u("div",{className:`${e}-field`,children:[o?a("label",{className:`${e}__label`,htmlFor:d,children:o}):null,b(),t==="error"&&i?a("p",{id:f,className:`${e}__supporting-text ${e}__supporting-text--error`,children:i}):null,t!=="error"&&r?a("p",{id:m,className:`${e}__supporting-text`,children:r}):null]})}export{J as default};

package/dist/design-system/components/Dropdown/Dropdown.d.ts

@@ -18,6 +18,6 @@ import type { DropdownProps } from "./Dropdown.types";
  * @param {boolean} disabled - Whether the dropdown is disabled
  * @param {object} props - Additional props to pass to the trigger button
  */
-declare function Dropdown({ options, value, onChange, placeholder, size, state, placement, id, className, disabled, ...props }: DropdownProps): import("react/jsx-runtime").JSX.Element;
+declare function Dropdown({ options, value, onChange, placeholder, size, state, placement, searchable, menuFullWidth, id, className, disabled, ...props }: DropdownProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof Dropdown>;
 export default _default;

package/dist/design-system/components/Dropdown/Dropdown.types.d.ts

@@ -10,4 +10,6 @@ export interface DropdownProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     id?: unknown;
     className?: string;
     disabled?: boolean;
+    searchable?: boolean;
+    menuFullWidth?: boolean;
 }

package/dist/design-system/components/SearchInput/SearchInput.d.ts

@@ -1,2 +1,3 @@
+import "./_search-input.scss";
 import type { SearchInputProps } from "./SearchInput.types";
-export declare function SearchInput(props: SearchInputProps): import("react/jsx-runtime").JSX.Element;
+export declare function SearchInput({ dropdownOptions, dropdownValue, onDropdownChange, dropdownPlaceholder, dropdownDisabled, dropdownPlacement, className, disabled, size, ...props }: SearchInputProps): import("react/jsx-runtime").JSX.Element;

package/dist/design-system/components/SearchInput/SearchInput.types.d.ts

@@ -1,3 +1,22 @@
 import type { TextInputProps } from "../TextInput";
+export interface SearchInputDropdownOption {
+    value: string;
+    label: string;
+}
 export interface SearchInputProps extends Omit<TextInputProps, "type" | "icon" | "iconPosition"> {
+    /**
+     * Optional scope/filter dropdown rendered inside the right side of the input.
+     * Pass options to enable it.
+     */
+    dropdownOptions?: SearchInputDropdownOption[];
+    /** Current selected dropdown value. */
+    dropdownValue?: string;
+    /** Called when dropdown selection changes. */
+    onDropdownChange?: (value: string) => void;
+    /** Placeholder shown in the dropdown when no value is selected. */
+    dropdownPlaceholder?: string;
+    /** Optional disabled override for the embedded dropdown. */
+    dropdownDisabled?: boolean;
+    /** Menu placement for the embedded dropdown popover. */
+    dropdownPlacement?: "bottom-start" | "bottom-end" | "top-start" | "top-end";
 }

package/dist/design-system/components/Tag/Tag.d.ts

@@ -9,9 +9,10 @@ import type { TagProps } from "./Tag.types";
  * @param {string} color - Color variant: 'transparent', 'neutral', 'red', 'orange', 'yellow', 'emerald', 'green', 'sky', 'cyan', 'blue', 'indigo', 'purple', 'fuchsia', 'magenta', 'inverse'
  * @param {boolean} rounded - Whether to use rounded corners (default: true)
  * @param {boolean} solid - Whether to use solid background (default: false)
+ * @param {boolean} outlined - Whether to use outlined treatment (default: false)
  * @param {string|boolean} icon - Icon name to display (when appearance is 'icon-left')
  * @param {string} className - Additional CSS classes
  * @param {function} onClick - Click handler function
  * @param {object} props - Additional props to pass to the tag element
  */
-export default function Tag({ label, appearance, size, color, rounded, solid, icon, className, onClick, ...props }: TagProps): import("react/jsx-runtime").JSX.Element;
+export default function Tag({ label, appearance, size, color, rounded, solid, outlined, icon, className, onClick, ...props }: TagProps): import("react/jsx-runtime").JSX.Element;

package/dist/design-system/components/Tag/Tag.types.d.ts

@@ -1,11 +1,15 @@
 import type { HTMLAttributes, ReactNode } from "react";
+export type TagAppearance = "label-only" | "icon-left";
+export type TagSize = "compact" | "default";
+export type TagColor = "transparent" | "neutral" | "red" | "orange" | "yellow" | "emerald" | "green" | "sky" | "cyan" | "blue" | "indigo" | "purple" | "fuchsia" | "magenta" | "inverse";
 export interface TagProps extends HTMLAttributes<HTMLDivElement> {
     label?: string;
-    appearance?: string;
-    size?: string;
-    color?: string;
+    appearance?: TagAppearance;
+    size?: TagSize;
+    color?: TagColor;
     rounded?: boolean;
     solid?: boolean;
+    outlined?: boolean;
     icon?: string | ReactNode;
     className?: string;
     onClick?: (...args: unknown[]) => void;

package/dist/design-system/components/Tag/index.d.ts

@@ -1,3 +1,3 @@
 export { default } from "./Tag";
 export { default as Tag } from "./Tag";
-export type { TagProps } from "./Tag.types";
+export type { TagAppearance, TagColor, TagProps, TagSize } from "./Tag.types";

package/dist/design-system/components/TextInput/TextInput.d.ts

@@ -17,4 +17,4 @@ import type { TextInputProps } from "./TextInput.types";
  * @param {string} className - Additional CSS classes
  * @param {object} props - Additional props to pass to the input element
  */
-export default function Input({ value, onChange, placeholder, type, size, state, disabled, icon, iconPosition, onIconClick, id, label, helperText, errorText, className, "aria-describedby": ariaDescribedBy, ...props }: TextInputProps): import("react/jsx-runtime").JSX.Element;
+export default function Input({ value, onChange, placeholder, type, size, state, disabled, icon, iconPosition, onIconClick, id, label, helperText, errorText, endAdornment, className, "aria-describedby": ariaDescribedBy, ...props }: TextInputProps): import("react/jsx-runtime").JSX.Element;

package/dist/design-system/components/TextInput/TextInput.types.d.ts

@@ -42,4 +42,6 @@ export interface TextInputProps extends Omit<InputHTMLAttributes<HTMLInputElemen
     helperText?: ReactNode;
     /** Error text rendered below the input when in error state. */
     errorText?: ReactNode;
+    /** Optional custom element rendered inside the input on the right side. */
+    endAdornment?: ReactNode;
 }