@zeniai/web-components 3.17.3 → 3.17.4

package/dist/LabeledSingleSelectField-C0trJEzs.cjs

@@ -1,136 +0,0 @@
-"use strict";const t=require("./vendor-.pnpm-D0ILHvHB.cjs"),p=require("@emotion/styled"),o=require("./index-gTpRqqAW.cjs"),S=({allValues:e,selectedValue:n,onSelectedValueChanged:l,isDisabled:r,placeholder:a,style:h,customStyleConfig:u})=>{const c=t.useTheme(),x=P(e).sort((i,s)=>i.label.localeCompare(s.label)),m=n!=null&&n?b(n):void 0,w={control:(i,s)=>({...i,height:o.Space.sp6,backgroundColor:s.menuIsOpen?c.colors.brandColorGoldDark:c.colors.grey5,":hover":{fill:c.colors.primary,backgroundColor:s.isDisabled?c.colors.grey5:c.colors.background,borderColor:"none"},...u?.control?.(i,s)}),container:(i,s)=>({...i,width:"100%",...h,...u?.container?.(i,s)}),valueContainer:(i,s)=>({...i,margin:`${o.Space.sp0} ${o.Space.sp3}`,justifyContent:s.selectProps.menuIsOpen===!1?"flex-end":"flex-start",...u?.valueContainer?.(i,s)}),menu:(i,s)=>({...i,backgroundColor:c.colors.grey5,borderRadius:o.Space.sp1,boxShadow:`${o.Space.sp0} 2px ${o.Space.sp2} ${c.colors.dropShadowHover}`,whiteSpace:"nowrap",zIndex:2,width:"100%",margin:0,...u?.menu?.(i,s)}),menuList:(i,s)=>({...i,borderRadius:0,...u?.menuList?.(i,s)})};return t.jsxRuntimeExports.jsx(t.StateManagedSelect$1,{isMulti:!1,onChange:i=>{i?.value!=null&&m?.value===i.value?l(void 0):l(i?.value)},tabSelectsValue:!1,openMenuOnFocus:!0,classNamePrefix:"single-select-field",placeholder:a,menuPlacement:"auto",maxMenuHeight:288,defaultValue:m,value:m,menuShouldScrollIntoView:!1,closeMenuOnSelect:!0,components:{Control:v,Option:y,Input:$,SingleValue:R,ValueContainer:f,DropdownIndicator:L,IndicatorSeparator:I,ClearIndicator:M,Placeholder:j},hideSelectedOptions:!1,styles:w,options:x,isClearable:!0,isSearchable:!0,isDisabled:r!=null},t.nanoid())},v=e=>{const{menuIsOpen:n,isFocused:l,isDisabled:r,selectProps:a}=e,{value:h}=a;return t.jsxRuntimeExports.jsx(C,{menuIsOpen:n,isFocused:l,isDisabled:r,selectedValue:h,children:t.jsxRuntimeExports.jsx(t.components.Control,{...e,className:"select-control",children:e.children})})},f=e=>t.jsxRuntimeExports.jsx(t.components.ValueContainer,{...e,className:"select-value-container",children:e.children}),$=e=>{const{selectProps:n}=e,{placeholder:l,value:r}=n;return t.jsxRuntimeExports.jsx(t.components.Input,{...e,autoComplete:"new-password",placeholder:r==null?l:void 0,children:e.children})},R=e=>t.jsxRuntimeExports.jsx(t.components.SingleValue,{...e,children:e.children}),j=()=>null,y=e=>{const{isSelected:n,isDisabled:l,isFocused:r}=e;return t.jsxRuntimeExports.jsx(z,{isFocused:r,isSelected:n,isDisabled:l,children:t.jsxRuntimeExports.jsx(t.components.Option,{...e,className:"select-option",children:t.jsxRuntimeExports.jsxs(k,{children:[t.jsxRuntimeExports.jsx(E,{children:t.jsxRuntimeExports.jsx(O,{isSelected:n,isDisabled:l,children:e.label})}),n?t.jsxRuntimeExports.jsxs(D,{children:[t.jsxRuntimeExports.jsx(o.SvgTick,{className:"right-tick-icon",width:o.Space.sp3,height:o.Space.sp3,style:{marginRight:"2px"},color:"currentColor"}),t.jsxRuntimeExports.jsx(o.SvgClose,{className:"close-tick-icon",width:o.Space.sp3,height:o.Space.sp3,color:"currentColor"})]}):null]})})})},C=p.div`
-  width: 100%;
-  cursor: ${e=>e.isDisabled?"not-allowed":"pointer"};
-
-  .select-control {
-    border: none;
-    box-shadow: none;
-    width: auto;
-    min-height: auto;
-    cursor: pointer;
-  }
-  .select-value-container {
-    width: 100%;
-    display: flex;
-    padding: 0;
-    max-width: 100%;
-    height: 100%;
-    min-width: auto;
-    align-items: center;
-    flex-wrap: nowrap;
-    cursor: pointer;
-
-    .single-select-field__single-value {
-      border-radius: ${o.Space.sp0};
-      margin: ${o.Space.sp0};
-      color: ${e=>e.theme.colors.primary};
-      ${o.textStyles.standardRegular.css};
-      box-sizing: border-box;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    }
-
-    .single-select-field__input-container {
-      display: flex;
-      width: ${e=>e.menuIsOpen===!1&&e.selectedValue!=null?o.Space.sp0:"100%"};
-      position: ${e=>e.isFocused===!1&&e.selectedValue==null?"initial":"absolute"};
-      ${o.textStyles.standardRegular.css};
-      color: ${e=>e.theme.colors.primary};
-      margin: ${o.Space.sp0};
-      cursor: inherit;
-
-      > input {
-        text-align: ${e=>e.isFocused===!1&&e.selectedValue==null?"right":"initial"};
-        align-items: center;
-        overflow: hidden;
-        cursor: inherit;
-        :disabled {
-          visibility: visible;
-        }
-        ::placeholder {
-          color: ${e=>e.theme.colors.grey1};
-        }
-      }
-    }
-  }
-`,z=p.div`
-  .select-option {
-    ${o.textStyles.smallRegular.css};
-    height: ${o.Space.sp6};
-    padding: 9px ${o.Space.sp3};
-    color: ${e=>e.isSelected?e.theme.colors.primary:e.theme.colors.champion};
-    background-color: ${e=>e.isSelected?e.theme.colors.grey3:e.isFocused?e.theme.colors.background:e.theme.colors.grey5};
-    cursor: ${e=>e.isDisabled?"not-allowed":"pointer"};
-    border-top: none;
-    .close-tick-icon {
-      display: none;
-    }
-    &:hover {
-      background-color: ${e=>e.isDisabled?e.theme.colors.grey5:e.theme.colors.background};
-      color: ${e=>e.isDisabled?e.theme.colors.champion:e.theme.colors.primary};
-      .right-tick-icon {
-        display: none;
-      }
-      .close-tick-icon {
-        display: inline-block;
-      }
-    }
-  }
-`,k=p.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: space-between;
-`,O=p.label`
-  ${o.textStyles.standardRegular.css};
-  padding-right: 10px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  cursor: ${e=>e.isDisabled?"not-allowed":e.isSelected?"default":"pointer"};
-`,E=p.div`
-  width: 100%;
-  display: flex;
-  align-items: center;
-`,D=p.div`
-  display: flex;
-  color: ${e=>e.theme.colors.primary};
-  fill: ${e=>e.theme.colors.primary};
-`,L=()=>null,I=()=>null,M=()=>null,P=e=>e.map(n=>b(n)),b=e=>({value:e,label:e}),F=({name:e,registerOptions:n,defaultValue:l,placeholder:r,isDisabled:a,style:h,customStyleConfig:u})=>{const{control:c}=t.useFormContext();return t.jsxRuntimeExports.jsx(t.Controller,{name:e,control:c,defaultValue:l,rules:n,render:({field:{value:g,onChange:x}})=>t.jsxRuntimeExports.jsx(S,{onSelectedValueChanged:m=>x({allOptions:l.allOptions,selectedOption:m}),style:h,placeholder:r,selectedValue:g.selectedOption,allValues:l.allOptions,isDisabled:a,customStyleConfig:u})})},d={width:new o.ResponsiveSized(343,580,726),height:new o.ResponsiveSized(o.sp[6],o.sp[6]),controlHeight:new o.ResponsiveSized(o.sp[6],o.sp[6]),paddingTopBottom:new o.ResponsiveSized(o.sp[2],o.sp[2]),marginTop:new o.ResponsiveSized(o.sp[2],o.sp[2]),marginBottom:new o.ResponsiveSized(o.sp[2],o.sp[2]),marginRight:new o.ResponsiveSized(o.sp[2],o.sp[2]),labelMarginLeft:new o.ResponsiveSized(o.sp[3],o.sp[4]),labelMarginRight:new o.ResponsiveSized(o.sp[3],o.sp[4]),labelMarginTop:new o.ResponsiveSized(o.sp[2],o.sp[2])};function V({isDisabled:e,label:n,singleSelectField:l,style:r}){const a=o.useWindowSizeContext();return t.jsxRuntimeExports.jsxs(T,{size:a,style:r,isDisabled:e!=null,children:[t.jsxRuntimeExports.jsx(o.Label,{isDisabled:e,label:n.label,htmlFor:l.name,style:{marginLeft:d.labelMarginLeft.value(a),marginRight:d.labelMarginRight.value(a),marginTop:d.labelMarginTop.value(a),width:n.width??"auto"}}),t.jsxRuntimeExports.jsx(F,{...l,isDisabled:e,style:{display:"flex",flexGrow:1,maxWidth:n.width!=null?`calc(100% - ${n.width}px)`:"auto",height:d.controlHeight.value(a)}})]})}const T=p.div`
-  display: flex;
-  flex-direction: row;
-  align-items: flex-start;
-  background-color: ${e=>e.theme.colors.grey5};
-  width: ${e=>d.width.valuePx(e.size)};
-  min-height: ${e=>d.height.valuePx(e.size)};
-  padding-right: ${e=>d.marginRight.valuePx(e.size)};
-  padding-top: ${e=>d.paddingTopBottom.valuePx(e.size)};
-  padding-bottom: ${e=>d.paddingTopBottom.valuePx(e.size)};
-
-  :first-of-type {
-    border-top-left-radius: inherit;
-    border-top-right-radius: inherit;
-  }
-
-  :last-of-type {
-    border-bottom-left-radius: inherit;
-    border-bottom-right-radius: inherit;
-  }
-
-  &:focus-within {
-    z-index: 2;
-    outline: 1px solid ${e=>e.theme.colors.primary};
-    .select-control {
-      background-color: ${e=>e.theme.colors.background};
-    }
-  }
-
-  &:hover {
-    z-index: 1;
-    outline: ${e=>e.isDisabled===!0?"none":`1px solid ${e.theme.colors.primary}`};
-    .select-control {
-      background-color: ${e=>e.isDisabled?e.theme.colors.grey5:e.theme.colors.background};
-    }
-  }
-`;exports.LabeledSingleSelectField=V;

package/dist/LabeledSingleSelectWithoutClearableField-D8S-AThh.cjs

@@ -1,38 +0,0 @@
-"use strict";const s=require("./vendor-.pnpm-D0ILHvHB.cjs"),d=require("@emotion/styled"),e=require("./index-gTpRqqAW.cjs"),t={width:new e.ResponsiveSized(343,580,726),height:new e.ResponsiveSized(e.sp[6],e.sp[6]),controlHeight:new e.ResponsiveSized(e.sp[6],e.sp[6]),paddingTopBottom:new e.ResponsiveSized(e.sp[2],e.sp[2]),marginTop:new e.ResponsiveSized(e.sp[2],e.sp[2]),marginBottom:new e.ResponsiveSized(e.sp[2],e.sp[2]),marginRight:new e.ResponsiveSized(e.sp[2],e.sp[2]),labelMarginLeft:new e.ResponsiveSized(e.sp[3],e.sp[4]),labelMarginRight:new e.ResponsiveSized(e.sp[3],e.sp[4]),labelMarginTop:new e.ResponsiveSized(e.sp[2],e.sp[2])};function p({isDisabled:i,label:n,singleSelectWithoutClearableField:r,style:l,opacity:a=1}){const o=e.useWindowSizeContext();return s.jsxRuntimeExports.jsxs(g,{size:o,style:l,isDisabled:i!=null,opacity:a,children:[s.jsxRuntimeExports.jsx(e.Label,{isDisabled:i,label:n.label,htmlFor:r.name,style:{marginLeft:t.labelMarginLeft.value(o),marginRight:t.labelMarginRight.value(o),marginTop:t.labelMarginTop.value(o),width:n.width??"auto"}}),s.jsxRuntimeExports.jsx(e.SingleSelectWithoutClearableField,{...r,isDisabled:i,style:{display:"flex",flexGrow:1,width:n.width!=null?`calc(100% - ${n.width}px)`:"auto",height:t.controlHeight.value(o)}})]})}const g=d.div`
-  display: flex;
-  flex-direction: row;
-  align-items: flex-start;
-  background-color: ${i=>i.theme.colors.grey5};
-  width: ${i=>t.width.valuePx(i.size)};
-  min-height: ${i=>t.height.valuePx(i.size)};
-  padding-right: ${i=>t.marginRight.valuePx(i.size)};
-  padding-top: ${i=>t.paddingTopBottom.valuePx(i.size)};
-  padding-bottom: ${i=>t.paddingTopBottom.valuePx(i.size)};
-  opacity: ${i=>i.opacity};
-
-  :first-of-type {
-    border-top-left-radius: inherit;
-    border-top-right-radius: inherit;
-  }
-
-  :last-of-type {
-    border-bottom-left-radius: inherit;
-    border-bottom-right-radius: inherit;
-  }
-
-  &:focus-within {
-    z-index: 2;
-    outline: 1px solid ${i=>i.theme.colors.primary};
-    .select-control {
-      background-color: ${i=>i.theme.colors.background};
-    }
-  }
-
-  &:hover {
-    z-index: 1;
-    outline: ${i=>i.isDisabled===!0?"none":`1px solid ${i.theme.colors.primary}`};
-    .select-control {
-      background-color: ${i=>i.isDisabled?i.theme.colors.grey5:i.theme.colors.background};
-    }
-  }
-`;exports.LabeledSingleSelectWithoutClearableField=p;

package/dist/LabeledSingleSelectWithoutClearableField-Msyl9fFh.js

@@ -1,103 +0,0 @@
-import { j as n } from "./vendor-.pnpm-B2klaOGU.js";
-import g from "@emotion/styled";
-import { u as h, aB as m, R as t, aV as c, D as i } from "./index-BEMjPEfs.js";
-const o = {
-  width: new t(343, 580, 726),
-  height: new t(i[6], i[6]),
-  controlHeight: new t(i[6], i[6]),
-  paddingTopBottom: new t(i[2], i[2]),
-  marginTop: new t(i[2], i[2]),
-  marginBottom: new t(i[2], i[2]),
-  marginRight: new t(i[2], i[2]),
-  labelMarginLeft: new t(i[3], i[4]),
-  labelMarginRight: new t(i[3], i[4]),
-  labelMarginTop: new t(i[2], i[2])
-};
-function b({
-  isDisabled: e,
-  label: a,
-  singleSelectWithoutClearableField: l,
-  style: d,
-  opacity: s = 1
-}) {
-  const r = h();
-  return /* @__PURE__ */ n.jsxs(
-    u,
-    {
-      size: r,
-      style: d,
-      isDisabled: e != null,
-      opacity: s,
-      children: [
-        /* @__PURE__ */ n.jsx(
-          m,
-          {
-            isDisabled: e,
-            label: a.label,
-            htmlFor: l.name,
-            style: {
-              marginLeft: o.labelMarginLeft.value(r),
-              marginRight: o.labelMarginRight.value(r),
-              marginTop: o.labelMarginTop.value(r),
-              width: a.width ?? "auto"
-            }
-          }
-        ),
-        /* @__PURE__ */ n.jsx(
-          c,
-          {
-            ...l,
-            isDisabled: e,
-            style: {
-              display: "flex",
-              flexGrow: 1,
-              width: a.width != null ? `calc(100% - ${a.width}px)` : "auto",
-              height: o.controlHeight.value(r)
-            }
-          }
-        )
-      ]
-    }
-  );
-}
-const u = g.div`
-  display: flex;
-  flex-direction: row;
-  align-items: flex-start;
-  background-color: ${(e) => e.theme.colors.grey5};
-  width: ${(e) => o.width.valuePx(e.size)};
-  min-height: ${(e) => o.height.valuePx(e.size)};
-  padding-right: ${(e) => o.marginRight.valuePx(e.size)};
-  padding-top: ${(e) => o.paddingTopBottom.valuePx(e.size)};
-  padding-bottom: ${(e) => o.paddingTopBottom.valuePx(e.size)};
-  opacity: ${(e) => e.opacity};
-
-  :first-of-type {
-    border-top-left-radius: inherit;
-    border-top-right-radius: inherit;
-  }
-
-  :last-of-type {
-    border-bottom-left-radius: inherit;
-    border-bottom-right-radius: inherit;
-  }
-
-  &:focus-within {
-    z-index: 2;
-    outline: 1px solid ${(e) => e.theme.colors.primary};
-    .select-control {
-      background-color: ${(e) => e.theme.colors.background};
-    }
-  }
-
-  &:hover {
-    z-index: 1;
-    outline: ${(e) => e.isDisabled === !0 ? "none" : `1px solid ${e.theme.colors.primary}`};
-    .select-control {
-      background-color: ${(e) => e.isDisabled ? e.theme.colors.grey5 : e.theme.colors.background};
-    }
-  }
-`;
-export {
-  b as L
-};

package/dist/LabeledText-BWNQqqXM.js

@@ -1,103 +0,0 @@
-import { j as n } from "./vendor-.pnpm-B2klaOGU.js";
-import r from "@emotion/styled";
-import { u as m, e as d, aB as u, R as i, D as t, S as l, o as b, aw as c } from "./index-BEMjPEfs.js";
-const a = {
-  width: new i(343, 580, 726),
-  height: new i(t[6], t[6]),
-  controlHeight: new i(t[6], t[6]),
-  paddingTopBottom: new i(t[2], t[2]),
-  marginTop: new i(t[2], t[2]),
-  marginBottom: new i(t[2], t[2]),
-  marginRight: new i(t[2], t[2]),
-  labelMarginLeft: new i(t[3], t[4]),
-  labelMarginRight: new i(t[3], t[4]),
-  labelMarginTop: new i(t[2], t[2])
-}, x = {
-  infoLabel: new c("extraSmallRegular", "smallRegular")
-};
-function S({
-  label: e,
-  value: g,
-  additionalInfoLabel: s,
-  style: h,
-  infoLabelStyle: p
-}) {
-  const o = m();
-  return /* @__PURE__ */ n.jsxs(
-    w,
-    {
-      size: o,
-      style: h,
-      "data-testid": d("labeled-text", e.label),
-      children: [
-        /* @__PURE__ */ n.jsx(
-          u,
-          {
-            label: e.label,
-            style: {
-              marginLeft: a.labelMarginLeft.value(o),
-              marginRight: a.labelMarginRight.value(o),
-              marginTop: a.labelMarginTop.value(o),
-              width: e.width ?? "auto"
-            }
-          }
-        ),
-        /* @__PURE__ */ n.jsxs($, { labelWidth: e.width, children: [
-          /* @__PURE__ */ n.jsx(
-            f,
-            {
-              "data-testid": d("labeled-text-input", e.label),
-              children: g
-            }
-          ),
-          s != null ? /* @__PURE__ */ n.jsx(y, { size: o, style: p, children: s }) : null
-        ] })
-      ]
-    }
-  );
-}
-const w = r.div`
-  display: flex;
-  flex-direction: row;
-  align-items: flex-start;
-  background-color: ${(e) => e.theme.colors.grey5};
-  width: ${(e) => a.width.valuePx(e.size)};
-  min-height: ${(e) => a.height.valuePx(e.size)};
-  padding-right: ${(e) => a.marginRight.valuePx(e.size)};
-  padding-top: ${(e) => a.paddingTopBottom.valuePx(e.size)};
-  padding-bottom: ${(e) => a.paddingTopBottom.valuePx(e.size)};
-  :first-of-type {
-    border-top-left-radius: inherit;
-    border-top-right-radius: inherit;
-  }
-  :last-of-type {
-    border-bottom-left-radius: inherit;
-    border-bottom-right-radius: inherit;
-  }
-`, f = r(b)`
-  display: flex;
-  border-width: ${l.sp0};
-  outline-width: ${l.sp0};
-  color: ${(e) => e.theme.colors.primary};
-  background-color: ${(e) => e.theme.colors.grey5};
-  border-radius: ${l.sp1};
-  text-align: right;
-  padding: 0 ${l.sp3};
-  width: 100%;
-  justify-content: flex-end;
-  margin-top: ${l.sp2};
-  margin-bottom: ${l.sp2};
-`, $ = r.label`
-  width: ${(e) => e.labelWidth != null ? `calc(100% - ${e.labelWidth}px)` : "100%"};
-`, y = r.label`
-  width: 100%;
-  display: flex;
-  justify-content: flex-end;
-  color: ${(e) => e.theme.colors.hero};
-  ${(e) => `${x.infoLabel.style(e.size)}`};
-  padding-right: ${l.sp3};
-  text-align: right;
-`;
-export {
-  S as L
-};

package/dist/LabeledText-BhHEFarC.cjs

@@ -1,42 +0,0 @@
-"use strict";const n=require("./vendor-.pnpm-D0ILHvHB.cjs"),o=require("@emotion/styled"),e=require("./index-gTpRqqAW.cjs"),i={width:new e.ResponsiveSized(343,580,726),height:new e.ResponsiveSized(e.sp[6],e.sp[6]),controlHeight:new e.ResponsiveSized(e.sp[6],e.sp[6]),paddingTopBottom:new e.ResponsiveSized(e.sp[2],e.sp[2]),marginTop:new e.ResponsiveSized(e.sp[2],e.sp[2]),marginBottom:new e.ResponsiveSized(e.sp[2],e.sp[2]),marginRight:new e.ResponsiveSized(e.sp[2],e.sp[2]),labelMarginLeft:new e.ResponsiveSized(e.sp[3],e.sp[4]),labelMarginRight:new e.ResponsiveSized(e.sp[3],e.sp[4]),labelMarginTop:new e.ResponsiveSized(e.sp[2],e.sp[2])},p={infoLabel:new e.ResponsiveSizedStyle("extraSmallRegular","smallRegular")};function g({label:t,value:r,additionalInfoLabel:a,style:l,infoLabelStyle:d}){const s=e.useWindowSizeContext();return n.jsxRuntimeExports.jsxs(h,{size:s,style:l,"data-testid":e.generateDataTestId("labeled-text",t.label),children:[n.jsxRuntimeExports.jsx(e.Label,{label:t.label,style:{marginLeft:i.labelMarginLeft.value(s),marginRight:i.labelMarginRight.value(s),marginTop:i.labelMarginTop.value(s),width:t.width??"auto"}}),n.jsxRuntimeExports.jsxs(u,{labelWidth:t.width,children:[n.jsxRuntimeExports.jsx(c,{"data-testid":e.generateDataTestId("labeled-text-input",t.label),children:r}),a!=null?n.jsxRuntimeExports.jsx(x,{size:s,style:d,children:a}):null]})]})}const h=o.div`
-  display: flex;
-  flex-direction: row;
-  align-items: flex-start;
-  background-color: ${t=>t.theme.colors.grey5};
-  width: ${t=>i.width.valuePx(t.size)};
-  min-height: ${t=>i.height.valuePx(t.size)};
-  padding-right: ${t=>i.marginRight.valuePx(t.size)};
-  padding-top: ${t=>i.paddingTopBottom.valuePx(t.size)};
-  padding-bottom: ${t=>i.paddingTopBottom.valuePx(t.size)};
-  :first-of-type {
-    border-top-left-radius: inherit;
-    border-top-right-radius: inherit;
-  }
-  :last-of-type {
-    border-bottom-left-radius: inherit;
-    border-bottom-right-radius: inherit;
-  }
-`,c=o(e.StandardRegular)`
-  display: flex;
-  border-width: ${e.Space.sp0};
-  outline-width: ${e.Space.sp0};
-  color: ${t=>t.theme.colors.primary};
-  background-color: ${t=>t.theme.colors.grey5};
-  border-radius: ${e.Space.sp1};
-  text-align: right;
-  padding: 0 ${e.Space.sp3};
-  width: 100%;
-  justify-content: flex-end;
-  margin-top: ${e.Space.sp2};
-  margin-bottom: ${e.Space.sp2};
-`,u=o.label`
-  width: ${t=>t.labelWidth!=null?`calc(100% - ${t.labelWidth}px)`:"100%"};
-`,x=o.label`
-  width: 100%;
-  display: flex;
-  justify-content: flex-end;
-  color: ${t=>t.theme.colors.hero};
-  ${t=>`${p.infoLabel.style(t.size)}`};
-  padding-right: ${e.Space.sp3};
-  text-align: right;
-`;exports.LabeledText=g;

package/dist/LabeledUserSingleSelectWithSubtitlesField-aFI_uy2K.cjs

@@ -1,229 +0,0 @@
-"use strict";const s=require("./vendor-.pnpm-D0ILHvHB.cjs"),r=require("@emotion/styled"),t=require("./index-gTpRqqAW.cjs"),te=require("./RoleWithToolTip-DLjgWlHq.cjs"),W=require("./avatar-D-486uIp.cjs"),T={selectContainerMarginHorizontal:new t.ResponsiveSized(t.sp[2],t.sp[3]),marginTop:new t.ResponsiveSized(t.sp[1],t.sp[0])},se=r(t.ExtraSmallRegular)`
-  display: flex;
-  gap: ${t.Space.sp2};
-  align-items: center;
-  color: ${e=>e.theme.colors.grey1};
-  justify-content: ${e=>e.menuIsOpen?"flex-start":"flex-end"};
-  height: 18px;
-  width: 100%;
-`,ne=r.div`
-  display: flex;
-  align-items: center;
-`,re=r.div`
-  height: ${t.Space.sp1};
-  width: ${t.Space.sp1};
-  background-color: ${e=>e.theme.colors.grey1};
-  border-radius: 50%;
-  opacity: 0.4;
-`,oe=r.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: space-between;
-  width: 100%;
-  height: ${t.Space.sp6};
-  gap: ${t.Space.sp3};
-`,ie=r(t.StandardRegular)`
-  display: flex;
-`,le=r.div`
-  width: 100%;
-  display: flex;
-  align-items: center;
-  opacity: ${e=>e.isCurrOptionDisabled?.5:1};
-`,ae=r.div`
-  display: flex;
-  align-items: center;
-  margin-right: ${t.Space.sp2};
-`,ce=r.img`
-  height: ${t.Space.sp5};
-  width: ${t.Space.sp5};
-  border-radius: 50%;
-  justify-content: center;
-`,ue=r.img`
-  height: ${t.Space.sp4};
-  width: ${t.Space.sp4};
-  border-radius: 50%;
-  justify-content: center;
-  color: ${e=>e.theme.colors.hero};
-`,M=r.div`
-  display: flex;
-  flex-direction: row;
-  cursor: pointer;
-  align-items: center;
-  gap: ${t.Space.sp2};
-  height: 100%;
-`,de=r(M)`
-  flex-direction: column;
-  gap: ${t.Space.sp0};
-`,pe=r.div`
-  display: flex;
-  align-items: center;
-  height: ${t.Space.sp6};
-  gap: ${t.Space.sp2};
-  justify-content: ${e=>e.menuIsOpen?"flex-start":"flex-end"};
-  width: 100%;
-`,xe=r(t.StandardRegular)`
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-`,me=r.div`
-  display: flex;
-  align-items: center;
-  color: ${e=>e.isError===!0&&e.menuIsOpen!==!0?t.Colors.important:e.theme.colors.grey1};
-  fill: ${e=>e.theme.colors.grey1};
-`,he=r(t.SmallRegular)`
-  color: ${e=>e.hasSelectedUser?e.theme.colors.primary:e.theme.colors.hero};
-  margin-left: -10px;
-  margin-right: -10px;
-  display: flex;
-  padding: ${t.Space.sp2} 12px 12px 12px;
-  fill: ${e=>e.hasSelectedUser?e.theme.colors.primary:e.theme.colors.hero};
-  cursor: ${e=>e.hasSelectedUser?"pointer":"default"};
-  &:hover {
-    color: ${e=>e.theme.colors.primary};
-    background: ${e=>e.theme.colors.background};
-    fill: ${e=>e.theme.colors.primary};
-  }
-  border-bottom: 1px solid ${e=>e.theme.colors.grey3};
-  margin-bottom: -${t.Space.sp2};
-  box-sizing: border-box;
-  align-items: center;
-  justify-content: space-between;
-`,ge=r(M)`
-  align-items: center;
-  gap: ${t.Space.sp2};
-`,V=r.div`
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-`,F=r.div``,je=r.div`
-  width: 100%;
-  background-color: ${e=>e.theme.colors.grey5};
-  cursor: ${e=>e.isDisabled?"not-allowed":"pointer"};
-  .select-control {
-    border: none;
-    height: 100%;
-    background-color: ${e=>e.menuIsOpen&&e.isValuePlacedAtEnd===!0?e.theme.colors.background:e.isError===!0?t.Colors.importantLight:e.theme.colors.grey5};
-    box-shadow: none;
-    border-radius: ${t.Space.sp1};
-    &:hover {
-      fill: ${e=>e.theme.colors.primary};
-      background-color: ${e=>e.isDisabled?e.theme.colors.grey5:e.isValuePlacedAtEnd!==!0?"inherit":e.theme.colors.background};
-      border-color: none;
-    }
-    width: auto;
-    min-height: auto;
-    cursor: pointer;
-    padding: 0;
-  }
-  .select-value-container {
-    width: 100%;
-    display: flex;
-    margin: ${e=>`${t.Space.sp0} ${e.isValuePlacedAtEnd===!0?e.bigMarginRightForSmallScreens===!0?t.Space.sp3:T.selectContainerMarginHorizontal.valuePx(e.windowSize):t.Space.sp0}`};
-    padding: 0;
-    max-width: 100%;
-    height: 100%;
-    min-width: auto;
-    align-items: center;
-    flex-wrap: nowrap;
-    cursor: pointer;
-    justify-content: ${e=>e.menuIsOpen===!1&&e.isValuePlacedAtEnd===!0?"flex-end":"flex-start"};
-
-    .single-select-field__single-value {
-      border-radius: ${t.Space.sp0};
-      margin: ${t.Space.sp0};
-      color: ${e=>e.theme.colors.primary};
-      ${t.textStyles.standardRegular.css};
-      box-sizing: border-box;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      height: 100%;
-    }
-
-    .single-select-field__input-container {
-      display: flex;
-      width: ${e=>e.menuIsOpen===!1?t.Space.sp0:"100%"};
-      position: ${e=>e.isFocused===!1&&e.selectedValue==null?"initial":"absolute"};
-      ${t.textStyles.standardRegular.css};
-      color: ${e=>e.theme.colors.primary};
-      margin: ${t.Space.sp0};
-      cursor: inherit;
-
-      > input {
-        text-align: ${e=>e.isFocused===!1&&e.selectedValue==null?"right":"initial"};
-        align-items: center;
-        overflow: hidden;
-        cursor: inherit;
-        :disabled {
-          visibility: visible;
-        }
-        ::placeholder {
-          color: ${e=>e.isError===!0&&e.menuIsOpen!==!0?t.Colors.important:e.theme.colors.grey1};
-        }
-      }
-    }
-  }
-`,Se=r.div`
-  width: ${e=>e.windowSize==="small"?"max-content":"100%"};
-  display: flex;
-  flex-direction: column;
-`,fe=r(W.SvgAvatar)`
-  width: ${t.Space.sp5};
-  height: ${t.Space.sp5};
-  color: ${e=>e.theme.colors.hero};
-`,U=r(t.EyebrowSmallRegular)`
-  color: ${e=>e.theme.colors.alert};
-  text-transform: none;
-  border: 1px solid ${e=>e.theme.colors.alert};
-  padding: 1px ${t.Space.sp1};
-  border-radius: ${t.Space.sp1};
-  margin-top: ${({windowSize:e})=>T.marginTop.valuePx(e)};
-  width: fit-content;
-`;function $e({allUsers:e,selectedValue:a,showOneOffLabel:l,placeholder:m,isOptionRemovable:R,valueToSubtitle:j,onSelectionChanged:S,name:y,userContainerStyles:h,optionStyles:P,isValuePlacedAtEnd:b=!0,isDisabled:k,showOnlyAvatar:E=!1,showAvatarAndSubtitles:v=!0,isOptionDisabled:C,disabledOptionHint:f,bigMarginRightForSmallScreens:L=!1}){const{formState:{errors:N}}=s.useFormContext(),z=s.has(N,y??""),d=t.useWindowSizeContext(),w=[];l!=null&&w.push(l.value),w.push(...e.map(n=>n.userId));const B=n=>{if(l!=null&&l.value===n)return l.label;const o=e.findIndex(i=>i.userId===n);if(o!==-1){const i=e[o];return i.user?.firstName||i.user?.lastName?`${i.user?.firstName} ${i.user?.lastName}`:`${i.user?.email}`}else return""},O=n=>{const o=e.findIndex(i=>i.userId===n);if(o!==-1)return e[o].user},_=n=>{const{menuIsOpen:o,children:i}=n;return s.jsxRuntimeExports.jsx(me,{menuIsOpen:o,isError:z,children:s.jsxRuntimeExports.jsx(ie,{children:i})})},q=({labelDetails:n})=>s.jsxRuntimeExports.jsxs(he,{hasSelectedUser:a===n.value,children:[s.jsxRuntimeExports.jsxs(ge,{children:[s.jsxRuntimeExports.jsx(fe,{}),s.jsxRuntimeExports.jsx(F,{children:s.jsxRuntimeExports.jsx(V,{children:n.label})})]}),a===n.value?s.jsxRuntimeExports.jsx(s.jsxRuntimeExports.Fragment,{children:s.jsxRuntimeExports.jsx(t.SvgTick,{width:t.Space.sp3,height:t.Space.sp3})}):null]}),G=n=>{const{children:o,data:i,selectProps:c}=n,{menuIsOpen:p}=c;if(l!=null&&i?.value===l.value)return s.jsxRuntimeExports.jsxs(M,{children:[v||E?s.jsxRuntimeExports.jsx(W.SvgAvatar,{style:{height:t.Space.sp4,width:t.Space.sp4}}):null,s.jsxRuntimeExports.jsx(xe,{children:l.label})]});const u=e.findIndex($=>$.userId===i.value),x=e[u],g=j(i.value);return s.jsxRuntimeExports.jsxs(de,{children:[s.jsxRuntimeExports.jsxs(pe,{menuIsOpen:p,children:[v||E?s.jsxRuntimeExports.jsx(s.jsxRuntimeExports.Fragment,{children:x?.user?.photo!=null?s.jsxRuntimeExports.jsx(ue,{src:x?.user?.photo.href,alt:t.appLocale.getLocalizedStrings().cockpit.userProfileAltText,onError:({currentTarget:$})=>{$.onerror=null,$.src=t.AvatarSVG},loading:"lazy"}):s.jsxRuntimeExports.jsx(t.EntityAvatarWithInitials,{firstName:x?.user?.firstName??"",lastName:x?.user?.lastName??"",size:`${t.Space.sp4}`,index:u})}):null,s.jsxRuntimeExports.jsx(V,{children:o})]}),v?s.jsxRuntimeExports.jsx(A,{subtitleList:g,menuIsOpen:c.menuIsOpen,member:x}):null]})},A=({subtitleList:n,member:o,menuIsOpen:i})=>{const c=n.length;return s.jsxRuntimeExports.jsxs(se,{menuIsOpen:i,children:[o!=null?s.jsxRuntimeExports.jsx(te.RoleWithToolTip,{roles:o?.userRole.userRoles}):null,o!=null&&c>0?s.jsxRuntimeExports.jsx(re,{}):null,c>0?n.map((p,u)=>s.jsxRuntimeExports.jsx(ne,{children:p},`${p}${u}`)):null]})},H=n=>{const{data:o,isSelected:i,selectProps:c,value:p}=n,u=!!C?.(p)&&i===!1;if(l!=null&&o?.value===l.value)return s.jsxRuntimeExports.jsx(q,{labelDetails:l});const x=e.findIndex(I=>I.userId===o.value),g=e[x],$=j(o.value);return s.jsxRuntimeExports.jsxs(oe,{style:P,children:[s.jsxRuntimeExports.jsxs(le,{isCurrOptionDisabled:u,children:[s.jsxRuntimeExports.jsx(ae,{children:g?.user?.photo!=null?s.jsxRuntimeExports.jsx(ce,{src:g?.user?.photo.href,alt:t.appLocale.getLocalizedStrings().cockpit.userProfileAltText,onError:({currentTarget:I})=>{I.onerror=null,I.src=t.AvatarSVG},loading:"lazy"}):s.jsxRuntimeExports.jsx(t.EntityAvatarWithInitials,{firstName:g?.user?.firstName??"",lastName:g?.user?.lastName??"",size:`${t.Space.sp5}`,index:x})}),s.jsxRuntimeExports.jsxs(F,{children:[s.jsxRuntimeExports.jsx(V,{children:n.label}),s.jsxRuntimeExports.jsx(A,{menuIsOpen:c.menuIsOpen,subtitleList:$,member:g}),d==="small"&&u&&f!=null?s.jsxRuntimeExports.jsx(U,{windowSize:d,children:f}):null]})]}),!!i&&s.jsxRuntimeExports.jsx(s.jsxRuntimeExports.Fragment,{children:s.jsxRuntimeExports.jsx(t.SvgTick,{width:t.Space.sp3,height:t.Space.sp3})}),d!=="small"&&u&&f!=null?s.jsxRuntimeExports.jsx(U,{windowSize:d,children:f}):null]})},Z=n=>{S(n)},J=()=>null,K=n=>{const{menuIsOpen:o,isFocused:i,isDisabled:c,selectProps:p}=n,{value:u}=p;return s.jsxRuntimeExports.jsx(je,{menuIsOpen:o,isFocused:i,isDisabled:c,selectedValue:u,isError:z,isValuePlacedAtEnd:b,windowSize:d,bigMarginRightForSmallScreens:L,children:s.jsxRuntimeExports.jsx(s.components.Control,{...n,className:"select-control",children:n.children})})},Q=n=>s.jsxRuntimeExports.jsx(s.components.ValueContainer,{...n,className:"select-value-container",children:n.children}),X=n=>s.jsxRuntimeExports.jsx(Se,{windowSize:d,children:n.children}),Y=(n,o)=>o&&typeof n.label=="string"?n.label.toLowerCase().includes(o.toLowerCase())||n.data?.data?.email?.toLowerCase().includes(o.toLowerCase()):!0,ee=s.useTheme();return s.jsxRuntimeExports.jsx(t.ZeniSingleSelect,{placeholder:m??t.appLocale.getLocalizedStrings().commonSetUp.approval.userSelectPlaceholder,selectedValue:a,pickerValues:w,valueToLabel:B,valueToData:O,backgroundColor:ee.colors.background,onPickerSelectionChanged:Z,OptionComponent:H,PlaceholderComponent:_,SingleValueComponent:G,isOptionRemovable:R,containerStyles:h,DropDownIndicatorComponent:J,ControlComponent:K,classNamePrefix:"single-select-field",ValueContainerComponent:Q,MenuListComponent:X,menuPosition:d==="small"?"right":"left",isSearchable:!0,isDisabled:k,isOptionDisabled:n=>C?.(n)===!0&&a!==n,filterOption:Y})}const Re={infoLabel:new t.ResponsiveSizedStyle("smallRegular","smallRegular")},ye=({name:e,placeholderLabel:a,registerOptions:l,value:m,valueToSubtitle:R,showOneOffLabel:j,userContainerStyles:S,optionStyles:y,isValuePlacedAtEnd:h,isDisabled:P,additionalLabelInfo:b,isOptionDisabled:k,showOnlyAvatar:E=!1,showAvatarAndSubtitles:v=!0,disabledOptionHint:C,bigMarginRightForSmallScreens:f=!1})=>{const{control:L}=s.useFormContext(),N=t.useWindowSizeContext();return s.jsxRuntimeExports.jsx(s.Controller,{name:e,control:L,defaultValue:m,rules:l,render:({field:{value:z,onChange:d}})=>s.jsxRuntimeExports.jsxs(ve,{width:S?.width,"data-testid":t.generateDataTestId("user-single-select",e),children:[s.jsxRuntimeExports.jsx($e,{onSelectionChanged:w=>{d({allUsers:m.allUsers,selectedUser:w})},selectedValue:z.selectedUser,valueToSubtitle:R,allUsers:m.allUsers,placeholder:a,name:e,showOneOffLabel:j,userContainerStyles:S,isValuePlacedAtEnd:h,isDisabled:P,isOptionDisabled:k,showAvatarAndSubtitles:v,showOnlyAvatar:E,disabledOptionHint:C,bigMarginRightForSmallScreens:f,optionStyles:y}),b!==null&&s.jsxRuntimeExports.jsx(we,{size:N,children:b})]})})},ve=r.div`
-  display: flex;
-  flex-direction: column;
-  width: ${e=>e.width!=null?e.width:"auto"};
-`,we=r.label`
-  color: ${e=>e.theme.colors.hero};
-  ${e=>`${Re.infoLabel.style(e.size)}`};
-  text-align: right;
-  padding-right: ${t.Space.sp3};
-`,D={width:new t.ResponsiveSized(343,580,726),labelMarginLeft:new t.ResponsiveSized(t.sp[3],t.sp[4]),labelMarginRight:new t.ResponsiveSized(t.sp[3],t.sp[4])};function be({isDisabled:e,label:a,userSingleSelectWithSubTitlesField:l,style:m,showTooltip:R=!1,tooltipTitle:j,toolTipWidth:S,opacity:y=1}){const h=t.useWindowSizeContext();return s.jsxRuntimeExports.jsxs(Ee,{size:h,style:m,isDisabled:e!=null,opacity:y,"data-testid":t.generateDataTestId("labeled-user-single-select",l.name),children:[s.jsxRuntimeExports.jsx(t.Label,{isDisabled:e,label:a.label,htmlFor:l.name,style:{marginLeft:D.labelMarginLeft.value(h),marginRight:D.labelMarginRight.value(h),marginTop:t.Space.sp2,width:a.width??"auto"},showTooltip:R,tooltipTitle:j,toolTipWidth:S}),s.jsxRuntimeExports.jsx(ye,{...l,isDisabled:e,userContainerStyles:{display:"flex",flexGrow:1,...l.showOnlyAvatar===!1&&{minWidth:"unset",maxWidth:"unset"},width:a.width!=null?`calc(100% - ${a.width}px)`:"auto",height:l.value.selectedUser==null||l.value.selectedUser!=null&&l.showOnlyAvatar===!0?t.Space.sp6:t.Space.sp9}})]})}const Ee=r.div`
-  display: flex;
-  flex-direction: row;
-  align-items: flex-start;
-  background-color: ${e=>e.theme.colors.grey5};
-  width: ${e=>D.width.valuePx(e.size)};
-  min-height: ${t.Space.sp6};
-  padding-right: ${t.Space.sp2};
-  padding-top: ${t.Space.sp2};
-  padding-bottom: ${t.Space.sp2};
-  opacity: ${e=>e.opacity};
-
-  :first-of-type {
-    border-top-left-radius: inherit;
-    border-top-right-radius: inherit;
-  }
-
-  :last-of-type {
-    border-bottom-left-radius: inherit;
-    border-bottom-right-radius: inherit;
-  }
-
-  &:focus-within {
-    z-index: 2;
-    outline: 1px solid ${e=>e.theme.colors.primary};
-    .select-control {
-      background-color: ${e=>e.theme.colors.background};
-    }
-  }
-
-  &:hover {
-    z-index: 1;
-    outline: ${e=>e.isDisabled===!0?"none":`1px solid ${e.theme.colors.primary}`};
-    .select-control {
-      background-color: ${e=>e.isDisabled?e.theme.colors.grey5:e.theme.colors.background};
-    }
-  }
-`;exports.LabeledUserSingleSelectWithSubtitlesField=be;