@kubit-ui-web/react-components 2.0.0-beta.4 → 2.0.0-beta.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/avatar/fragments/drawContent.js +1 -1
- package/dist/cjs/components/breadcrumbs/components/crumbStandAlone/crumbStandAlone.js +1 -1
- package/dist/cjs/components/calendar/selector/selector.js +1 -1
- package/dist/cjs/components/checkbox/checkboxStandAlone.js +1 -1
- package/dist/cjs/components/chip/chipStandAlone.js +1 -1
- package/dist/cjs/components/dataTable/dataTableStandAlone.js +1 -1
- package/dist/cjs/components/dropdownSelected/dropdownSelectedStandAlone.js +1 -1
- package/dist/cjs/components/input/inputStandAlone.js +1 -1
- package/dist/cjs/components/inputSignature/inputSignatureStandAlone.js +1 -1
- package/dist/cjs/components/label/labelStandAlone.js +1 -1
- package/dist/cjs/components/listOptions/listOptionsStandAlone.js +1 -1
- package/dist/cjs/components/message/messageStandAlone.js +1 -1
- package/dist/cjs/components/modal/fragments/modalHeader.js +1 -1
- package/dist/cjs/components/modal/modalStandAlone.js +1 -1
- package/dist/cjs/components/option/optionStandAlone.js +1 -1
- package/dist/cjs/components/pageControl/components/controls.js +1 -1
- package/dist/cjs/components/pageControl/pageControlStandAlone.js +1 -1
- package/dist/cjs/components/radioButton/radioButtonStandAlone.js +1 -1
- package/dist/cjs/components/selectorBoxFile/components/selectorBoxFileAnimation.js +1 -1
- package/dist/cjs/components/selectorBoxFile/components/selectorBoxFileContainerBox.js +1 -1
- package/dist/cjs/components/selectorBoxFile/components/selectorBoxFileHeader.js +1 -1
- package/dist/cjs/components/selectorBoxFile/selectorBoxFileStandAlone.js +1 -1
- package/dist/cjs/components/slider/components/sliderHelperTextStandAlone.js +1 -1
- package/dist/cjs/components/slider/sliderStandAlone.js +1 -1
- package/dist/cjs/components/tabs/tabsStandAlone.js +1 -1
- package/dist/cjs/components/textArea/components/errorStandAlone.js +1 -1
- package/dist/cjs/components/textArea/textAreaStandAlone.js +1 -1
- package/dist/cjs/components/tooltip/tooltipStandAlone.js +1 -1
- package/dist/esm/components/avatar/fragments/drawContent.js +1 -4
- package/dist/esm/components/breadcrumbs/components/crumbStandAlone/crumbStandAlone.js +3 -6
- package/dist/esm/components/calendar/selector/selector.js +7 -9
- package/dist/esm/components/checkbox/checkboxStandAlone.js +5 -7
- package/dist/esm/components/chip/chipStandAlone.js +7 -8
- package/dist/esm/components/dataTable/dataTableStandAlone.js +10 -14
- package/dist/esm/components/dropdownSelected/dropdownSelectedStandAlone.js +5 -6
- package/dist/esm/components/input/inputStandAlone.js +3 -5
- package/dist/esm/components/inputSignature/inputSignatureStandAlone.js +3 -4
- package/dist/esm/components/label/labelStandAlone.js +2 -3
- package/dist/esm/components/listOptions/listOptionsStandAlone.js +2 -4
- package/dist/esm/components/message/messageStandAlone.js +5 -10
- package/dist/esm/components/modal/fragments/modalHeader.js +3 -9
- package/dist/esm/components/modal/modalStandAlone.js +4 -5
- package/dist/esm/components/option/optionStandAlone.js +9 -12
- package/dist/esm/components/pageControl/components/controls.js +2 -4
- package/dist/esm/components/pageControl/pageControlStandAlone.js +6 -8
- package/dist/esm/components/radioButton/radioButtonStandAlone.js +4 -8
- package/dist/esm/components/selectorBoxFile/components/selectorBoxFileAnimation.js +3 -7
- package/dist/esm/components/selectorBoxFile/components/selectorBoxFileContainerBox.js +9 -13
- package/dist/esm/components/selectorBoxFile/components/selectorBoxFileHeader.js +5 -9
- package/dist/esm/components/selectorBoxFile/selectorBoxFileStandAlone.js +7 -8
- package/dist/esm/components/slider/components/sliderHelperTextStandAlone.js +1 -3
- package/dist/esm/components/slider/sliderStandAlone.js +17 -19
- package/dist/esm/components/tabs/tabsStandAlone.js +5 -6
- package/dist/esm/components/textArea/components/errorStandAlone.js +3 -3
- package/dist/esm/components/textArea/textAreaStandAlone.js +11 -12
- package/dist/esm/components/tooltip/tooltipStandAlone.js +8 -10
- package/package.json +1 -1
- package/dist/cjs/lib/components/renderIf/renderIf.js +0 -1
- package/dist/esm/lib/components/renderIf/renderIf.js +0 -1
|
@@ -1,19 +1,17 @@
|
|
|
1
|
-
import{j as e}from"../../_virtual/jsx-runtime.js";import{forwardRef as t}from"react";import{
|
|
2
|
-
return e.jsxs("div",{ref:
|
|
3
|
-
/* @__PURE__ */e.jsx("div",{className:
|
|
4
|
-
/* @__PURE__ */e.jsx(
|
|
5
|
-
/* @__PURE__ */e.jsxs("div",{className:
|
|
6
|
-
/* @__PURE__ */e.jsx(
|
|
7
|
-
/* @__PURE__ */e.jsx("div",{className:
|
|
8
|
-
/* @__PURE__ */e.jsx(
|
|
9
|
-
/* @__PURE__ */e.jsx("div",{className:
|
|
10
|
-
/* @__PURE__ */e.jsx("div",{className:
|
|
11
|
-
/* @__PURE__ */e.jsx(
|
|
12
|
-
/* @__PURE__ */e.jsx(
|
|
13
|
-
/* @__PURE__ */e.jsx(
|
|
14
|
-
/* @__PURE__ */e.jsx(
|
|
15
|
-
/* @__PURE__ */e.jsx(
|
|
16
|
-
/* @__PURE__ */e.jsx(
|
|
17
|
-
/* @__PURE__ */e.jsx(
|
|
18
|
-
/* @__PURE__ */e.jsx(c,{...g,cssClasses:f,customAttributes:Y})]}),
|
|
19
|
-
/* @__PURE__ */e.jsx(d,{cssClasses:f,customAttributes:Y,leftHelperText:y,leftHelperTextId:se,rightHelperText:K,rightHelperTextId:ae})]})});export{b as SliderStandAlone};
|
|
1
|
+
import{j as e}from"../../_virtual/jsx-runtime.js";import{forwardRef as t}from"react";import{useId as s}from"../../lib/hooks/useId/useId.js";import{classNames as a}from"../../lib/utils/classNames/classNames.js";import{pickCustomAttributes as r}from"../../lib/utils/pickCustomAttributes/pickCustomAttributes.js";import{processText as i}from"../../lib/utils/process/processText/processText.js";import{Text as o}from"../text/text.js";import{SliderButtonStandAlone as l}from"./components/sliderButtonStandAlone.js";import{SliderHelperTextStandAlone as c}from"./components/sliderHelperTextStandAlone.js";import{SliderScaleStandAlone as d}from"./components/sliderScaleStandAlone.js";import{SliderThumbStandAlone as n}from"./components/sliderThumbStandAlone.js";import{buildAriaDescribedBy as u}from"./utils/accessibility.utils.js";import{getState as m}from"./utils/state.utils.js";import{isActive as h}from"./utils/ui.utils.js";const p=t(({activePointer:t,ariaLabel:p,ariaLabelBy:b,containerRef:x,cssClasses:v,decrementButton:f,disabled:j,hover:T,incrementButton:$,label:g,leftHelperText:k,max:y,min:A,offset:I,offsetLeft:L,offsetRight:C,onChange:N,onKeyPress:w,onMouseDown:B,onTouchStart:S,pressed:H,range:M,rightAriaLabel:D,rightAriaLabelBy:O,rightHelperText:F,rightThumbIcon:K,rightTooltip:R,scaleOffsets:P,setHover:_,showScale:q,step:z,thumbIcon:E,tooltip:G,value:J,...Q},U)=>{const V=s("slider"),W=m({disabled:j,hover:T,pressed:H}),X={"data-state":W},Y=Q["data-testid"]??"slider",Z=r(X),ee=i(g).children&&!M?`${V}Label`:void 0,te=`${V}LeftHelperText`,se=`${V}RightHelperText`,ae=b??ee;/* @__PURE__ */
|
|
2
|
+
return e.jsxs("div",{ref:U,className:v?.slider,"data-disabled":j,"data-hover":T,"data-pressed":H,...Z,children:[
|
|
3
|
+
/* @__PURE__ */e.jsx("div",{className:v?.labelcontainer,...Z,children:/* @__PURE__ */e.jsx(o,{additionalClasses:{text:v?.label},component:"label",customAttributes:X,id:ee,...i(g)})}),
|
|
4
|
+
/* @__PURE__ */e.jsx(d,{cssClasses:v,customAttributes:X,scaleOffsets:P,showScale:q}),
|
|
5
|
+
/* @__PURE__ */e.jsxs("div",{className:v?.buttonstrackscontainer,children:[
|
|
6
|
+
/* @__PURE__ */e.jsx(l,{...f,cssClasses:v,customAttributes:X}),
|
|
7
|
+
/* @__PURE__ */e.jsx("div",{className:v?.tracksthumbscontainer,children:/* @__PURE__ */e.jsxs("div",{ref:x,className:v?.tracksthumbsinnercontainer,"data-testid":`${Y}-container`,role:"button",tabIndex:0,onMouseDown:B,onTouchMove:N,onTouchStart:S,children:[M&&/* @__PURE__ */e.jsxs(e.Fragment,{children:[
|
|
8
|
+
/* @__PURE__ */e.jsx("div",{className:a({[`${v?.activetrack}`]:!1,[`${v?.inactivetrack}`]:!0}),...Z,"data-disabled":j,"data-hover":T,"data-pressed":H,"data-testid":`${Y}-inactive-left-track`,style:{left:0,width:`${L}%`}}),
|
|
9
|
+
/* @__PURE__ */e.jsx("div",{className:a({[`${v?.activetrack}`]:!0,[`${v?.inactivetrack}`]:!1}),"data-disabled":j,"data-hover":T,"data-pressed":H,"data-testid":`${Y}-active-track`,style:{left:`${L}%`,right:`${C}%`},...Z}),
|
|
10
|
+
/* @__PURE__ */e.jsx("div",{className:a({[`${v?.activetrack}`]:!1,[`${v?.inactivetrack}`]:!0}),"data-disabled":j,"data-hover":T,"data-pressed":H,"data-testid":`${Y}-inactive-right-track`,style:{right:0,width:`${C}%`},...Z}),
|
|
11
|
+
/* @__PURE__ */e.jsx(n,{ariaDescribedBy:u([{helperText:k,helperTextId:te},{helperText:F,helperTextId:se}]),ariaLabel:p,ariaLabelBy:ae,cssClasses:v,customAttributes:X,"data-testid":`${Y}-left-thumb`,disabled:j,hover:h(T,t.current,"left"),icon:E,max:J[1]-z,min:A,pressed:h(H,t.current,"left"),state:W,style:{left:`${L}%`},tooltip:G,value:J[0],onFocus:()=>t.current="left",onKeyDown:w,onMouseOut:()=>_(!1),onMouseOver:()=>{_(!0),t.current="left"},onTouchStart:()=>{t.current="left"}}),
|
|
12
|
+
/* @__PURE__ */e.jsx(n,{ariaDescribedBy:u([{helperText:k,helperTextId:te},{helperText:F,helperTextId:se}]),ariaLabel:D,ariaLabelBy:O,cssClasses:v,customAttributes:X,"data-testid":`${Y}-right-thumb`,disabled:j,hover:h(T,t.current,"right"),icon:K,max:y,min:J[0]+z,pressed:h(H,t.current,"right"),rightThumb:!0,state:W,style:{right:`${C}%`},tooltip:R,value:J[1],onFocus:()=>t.current="right",onKeyDown:w,onMouseOut:()=>_(!1),onMouseOver:()=>{_(!0),t.current="right"},onTouchStart:()=>{t.current="right"}})]}),!M&&/* @__PURE__ */e.jsxs(e.Fragment,{children:[
|
|
13
|
+
/* @__PURE__ */e.jsx("div",{className:a({[`${v?.activetrack}`]:!0,[`${v?.inactivetrack}`]:!1}),"data-disabled":j,"data-hover":T,"data-pressed":H,"data-testid":`${Y}-active-track`,style:{width:`${I}%`},...Z}),
|
|
14
|
+
/* @__PURE__ */e.jsx("div",{className:a({[`${v?.activetrack}`]:!1,[`${v?.inactivetrack}`]:!0}),"data-disabled":j,"data-hover":T,"data-pressed":H,"data-testid":`${Y}-inactive-track`,style:{right:0,width:`calc(${100-I}%)`},...Z}),
|
|
15
|
+
/* @__PURE__ */e.jsx(n,{ariaDescribedBy:u([{helperText:k,helperTextId:te},{helperText:F,helperTextId:se}]),ariaLabel:p,ariaLabelBy:ae,cssClasses:v,customAttributes:X,"data-testid":`${Y}-thumb`,disabled:j,hover:T,icon:E,max:y,min:A,pressed:H,state:W,style:{left:`${I}%`},tooltip:G,value:J,onKeyDown:w,onMouseOut:()=>_(!1),onMouseOver:()=>_(!0)})]})]})}),
|
|
16
|
+
/* @__PURE__ */e.jsx(l,{...$,cssClasses:v,customAttributes:X})]}),
|
|
17
|
+
/* @__PURE__ */e.jsx(c,{cssClasses:v,customAttributes:X,leftHelperText:k,leftHelperTextId:te,rightHelperText:F,rightHelperTextId:se})]})});export{p as SliderStandAlone};
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import{j as t}from"../../_virtual/jsx-runtime.js";import{forwardRef as e}from"react";import{Text as
|
|
2
|
-
return t.
|
|
3
|
-
|
|
4
|
-
/* @__PURE__ */t.
|
|
5
|
-
|
|
6
|
-
return t.jsx("div",{className:h?.tabcontainer,"data-testid":`${U}-tab-${a}`,...b(m),style:{minWidth:A?`calc(100% / ${F})`:"auto",width:u?"auto":`calc(100% / ${D})`},children:D>1?/* @__PURE__ */t.jsx(i,{ariaDisabled:A&&!l||e.disabled,ariaSelected:o,asElement:"button",checkIsFirstTime:!0,classNames:c(h?.tabbutton,{[`${h?.firsttabbutton}`]:0===a,[`${h?.lasttabbutton}`]:a===D-1}),customAttributes:m,disabled:A&&!l||e.disabled,focus:M===a,id:`${E}-tab-${a}`,index:a,preventScrollOnFocus:!0,role:"tab",type:"button",onSelectItem:()=>{I?.(a),R(a)},children:/* @__PURE__ */t.jsx(s,{additionalClasses:{text:h?.label},component:"span",customAttributes:m,"data-hidden":!!f,...d(e)})}):/* @__PURE__ */t.jsx("div",{className:c(h?.onetabcontainer,{[`${h?.tabbutton}`]:!!f}),id:`${E}-tab-${a}`,role:"tab",children:/* @__PURE__ */t.jsx(s,{additionalClasses:{text:h?.label},"data-hidden":!!f,...d(e),children:d(e).children})})},`${U}-tab-${a.toString()}`)})}),q("right")]}),(()=>{const s={role:"tabpanel",tabIndex:e?0:-1};return g?null!=N&&/* @__PURE__ */t.jsx("div",{"aria-labelledby":`${E}-tab-${N}`,className:h?.contentcontainer,...s,children:p?.[N]}):p?.map((e,a)=>/* @__PURE__ */t.jsx("div",{"aria-labelledby":`${E}-tab-${a}`,className:h?.contentcontainer,id:`${w}-${a}`,style:{display:N===a?"block":"none"},...s,children:e},`${E}-${a.toString()}-tab`))})()]})});export{u as TabsStandAlone};
|
|
1
|
+
import{j as t}from"../../_virtual/jsx-runtime.js";import{forwardRef as e}from"react";import{Text as a}from"../text/text.js";import{ElementOrIcon as s}from"../../lib/components/elementOrIcon/elementOrIcon.js";import{ItemRove as i}from"../../lib/components/itemRove/itemRove.js";import{useId as o}from"../../lib/hooks/useId/useId.js";import{useActiveBreakpoints as l}from"../../lib/hooks/useMediaDevice/useActiveBreakpoints.js";import{STATES as n}from"../../lib/types/states/states.js";import{classNames as r}from"../../lib/utils/classNames/classNames.js";import{pickCustomAttributes as c}from"../../lib/utils/pickCustomAttributes/pickCustomAttributes.js";import{processText as b}from"../../lib/utils/process/processText/processText.js";import{useTabs as d}from"./hooks/useTabs/useTabs.js";const m=e(({allowFocusTabPanel:e=!0,autoWidth:m=!1,content:u,cssClasses:p,device:h,hideLabelForSingleTab:j,leftControlAriaLabel:$,leftIcon:x,maxTabsInView:f=3,onSelectTab:T,rightControlAriaLabel:v,rightIcon:C,selectedTab:I,tabs:N,unMountContent:k=!0,...g},S)=>{const{isMobile:y}=l(),A=o("Tabs"),E=`${A}-tab-list`,L=`${A}-tab-panel`,w=N?.length??0,D=Math.min(w,f),{focus:F,handleClickIcon:M,handleClickTab:O,listEl:R,position:V}=d({numTabsInView:D,selectedTab:I,tabsLength:w}),W=0===V,B=V>=w-D,P=g["data-testid"]||"tabs",U=c(g),_=e=>{const a="left"===e,i=a?W:B;return w>D?/* @__PURE__ */t.jsx("button",{"aria-label":a?$:v,className:p?.arrowiconcontainer,"data-position":a?"left":"right","data-testid":`${P}-icon-${e}`,disabled:i,tabIndex:0,type:"button",onClick:()=>{i||M(!a)},children:/* @__PURE__ */t.jsx(s,{className:p?.icon,customAttributes:{"data-disabled":i},"data-position":a?"left":"right",...a?x:C})}):null};/* @__PURE__ */
|
|
2
|
+
return t.jsxs("div",{ref:S,className:p?.tabs,"data-testid":P,...U,children:[
|
|
3
|
+
/* @__PURE__ */t.jsxs("div",{className:p?.container,children:[_("left"),
|
|
4
|
+
/* @__PURE__ */t.jsx("div",{ref:R,className:p?.tabbuttonscontainer,id:E,role:"tablist",children:N?.map((e,s)=>{const o=I===s,l=o?n.SELECTED:n.UNSELECTED,d=s>=V&&s<V+D,u={"data-state":l};/* @__PURE__ */
|
|
5
|
+
return t.jsx("div",{className:p?.tabcontainer,"data-testid":`${P}-tab-${s}`,...c(u),style:{minWidth:y?`calc(100% / ${D})`:"auto",width:m?"auto":`calc(100% / ${w})`},children:w>1?/* @__PURE__ */t.jsx(i,{ariaDisabled:y&&!d||e.disabled,ariaSelected:o,asElement:"button",checkIsFirstTime:!0,classNames:r(p?.tabbutton,{[`${p?.firsttabbutton}`]:0===s,[`${p?.lasttabbutton}`]:s===w-1}),customAttributes:u,disabled:y&&!d||e.disabled,focus:F===s,id:`${A}-tab-${s}`,index:s,preventScrollOnFocus:!0,role:"tab",type:"button",onSelectItem:()=>{T?.(s),O(s)},children:/* @__PURE__ */t.jsx(a,{additionalClasses:{text:p?.label},component:"span",customAttributes:u,"data-hidden":!!j,...b(e)})}):/* @__PURE__ */t.jsx("div",{className:r(p?.onetabcontainer,{[`${p?.tabbutton}`]:!!j}),id:`${A}-tab-${s}`,role:"tab",children:/* @__PURE__ */t.jsx(a,{additionalClasses:{text:p?.label},"data-hidden":!!j,...b(e),children:b(e).children})})},`${P}-tab-${s.toString()}`)})}),_("right")]}),(()=>{const a={role:"tabpanel",tabIndex:e?0:-1};return k?null!=I&&/* @__PURE__ */t.jsx("div",{"aria-labelledby":`${A}-tab-${I}`,className:p?.contentcontainer,...a,children:u?.[I]}):u?.map((e,s)=>/* @__PURE__ */t.jsx("div",{"aria-labelledby":`${A}-tab-${s}`,className:p?.contentcontainer,id:`${L}-${s}`,style:{display:I===s?"block":"none"},...a,children:e},`${A}-${s.toString()}-tab`))})()]})});export{m as TabsStandAlone};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{j as e}from"../../../_virtual/jsx-runtime.js";import{Text as
|
|
2
|
-
/* @__PURE__ */e.jsx(
|
|
3
|
-
/* @__PURE__ */e.jsx(
|
|
1
|
+
import{j as e}from"../../../_virtual/jsx-runtime.js";import{Text as s}from"../../text/text.js";import{ElementOrIcon as r}from"../../../lib/components/elementOrIcon/elementOrIcon.js";import{STATES as t}from"../../../lib/types/states/states.js";import{processText as o}from"../../../lib/utils/process/processText/processText.js";const i=({cssClasses:i,customAttributtes:c,errorAriaLiveType:m,errorIcon:n,errorMessage:a,id:l,state:p})=>/* @__PURE__ */e.jsx("div",{"aria-live":m,className:i?.errorcontainer,id:l,...c,children:!!o(a).children&&p===t.ERROR&&/* @__PURE__ */e.jsxs(e.Fragment,{children:[
|
|
2
|
+
/* @__PURE__ */e.jsx(r,{className:i?.erroricon,customAttributes:c,...n}),
|
|
3
|
+
/* @__PURE__ */e.jsx(s,{additionalClasses:{text:i?.errormessage},component:"p",customAttributes:c,...o(a),children:o(a).children})]})});export{i as ErrorStandAlone};
|
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import{j as e}from"../../_virtual/jsx-runtime.js";import{forwardRef as t}from"react";import{LabelStandAlone as s}from"../label/labelStandAlone.js";import{
|
|
2
|
-
return e.jsxs("div",{ref:
|
|
3
|
-
/* @__PURE__ */e.jsx(
|
|
4
|
-
/* @__PURE__ */e.jsxs("div",{className:
|
|
5
|
-
/* @__PURE__ */e.jsxs("div",{className:
|
|
6
|
-
/* @__PURE__ */e.jsx(s,{asteriskCssClasses:
|
|
7
|
-
/* @__PURE__ */e.jsx("textarea",{"aria-describedby":
|
|
8
|
-
/* @__PURE__ */e.jsxs("div",{className:
|
|
9
|
-
/* @__PURE__ */e.jsxs("div",{className:
|
|
10
|
-
/* @__PURE__ */e.jsx(l,{cssClasses:
|
|
11
|
-
/* @__PURE__ */e.jsx(
|
|
12
|
-
/* @__PURE__ */e.jsx(r,{condition:!!x,children:/* @__PURE__ */e.jsx(d,{additionalClasses:{letftext:p?.counterleft,righttext:p?.counterright,text_count:p?.counter},currentCharacters:S?.length??0,id:w,maxLength:v,screenReaderText:M,variant:x})})]})]})});export{x as TextAreaStandAlone};
|
|
1
|
+
import{j as e}from"../../_virtual/jsx-runtime.js";import{forwardRef as t}from"react";import{LabelStandAlone as s}from"../label/labelStandAlone.js";import{useId as r}from"../../lib/hooks/useId/useId.js";import{STATES as o}from"../../lib/types/states/states.js";import{pickCustomAttributes as a}from"../../lib/utils/pickCustomAttributes/pickCustomAttributes.js";import{processText as i}from"../../lib/utils/process/processText/processText.js";import{ErrorStandAlone as l}from"./components/errorStandAlone.js";import{HelpMessageStandAlone as n}from"./components/helpMessageStandAlone.js";import{TextCount as c}from"./components/textCount/textCount.js";import{TitleStandAlone as d}from"./components/titleStandAlone.js";import{buildAriaDescribedBy as m}from"./utils/aria.utils.js";const u=t(({additionalInfo:t,counterVariant:u,cssClasses:x,errorAriaLiveType:p="assertive",errorIcon:h,errorMessage:j,height:b,helpMessage:g,id:C,label:f,labelInsideTextArea:A,maxLength:I,onBlur:v,onChange:T,onFocus:y,placeholder:E,required:L,screenReaderTextCount:k,spellCheck:M,state:B,title:D,value:N,...S},_)=>{const q=r("textArea"),F=C??q,$=`${F}HelpText`,H=`${F}Error`,R=`${F}TextCount`,w=a({"data-state":B}),K=[o.DISABLED_EMPTY,o.DISABLED_FILLED].includes(B);/* @__PURE__ */
|
|
2
|
+
return e.jsxs("div",{ref:_,className:x?.text_area,"data-testid":"text-area",...w,...a(S),children:[
|
|
3
|
+
/* @__PURE__ */e.jsx(d,{cssClasses:x,customAttributtes:w,title:D}),
|
|
4
|
+
/* @__PURE__ */e.jsxs("div",{className:x?.labeltextareacontainer,role:"button",style:{height:A?b:void 0},tabIndex:0,onClick:()=>document.getElementById(F)?.focus(),onKeyDown:e=>{"Enter"===e.key&&document.getElementById(F)?.focus()},children:[
|
|
5
|
+
/* @__PURE__ */e.jsxs("div",{className:x?.labelandadditionalinfocontainer,children:[
|
|
6
|
+
/* @__PURE__ */e.jsx(s,{asteriskCssClasses:x?.required,customAttributes:w,inputId:F,required:L,textCssClasses:x?.label,...i(f),children:i(f).children}),t]}),
|
|
7
|
+
/* @__PURE__ */e.jsx("textarea",{"aria-describedby":m({errorMessage:i(j).children,helpMessage:i(g).children,state:B,textAreaErrorId:H,textAreaHelpTextId:$}),className:x?.textarea,disabled:K,id:F,maxLength:I,placeholder:E,required:L,spellCheck:M,style:{height:b||void 0},value:N,onBlur:v,onChange:T,onFocus:y,...w,children:N})]}),
|
|
8
|
+
/* @__PURE__ */e.jsxs("div",{className:x?.bottomcontainer,...w,children:[
|
|
9
|
+
/* @__PURE__ */e.jsxs("div",{className:x?.helpmessageerrorcontainer,...w,children:[
|
|
10
|
+
/* @__PURE__ */e.jsx(l,{cssClasses:x,customAttributtes:w,errorAriaLiveType:p,errorIcon:h,errorMessage:j,id:H,state:B}),
|
|
11
|
+
/* @__PURE__ */e.jsx(n,{cssClasses:x,customAttributtes:w,helpMessage:g,id:$})]}),!!u&&/* @__PURE__ */e.jsx(c,{additionalClasses:{letftext:x?.counterleft,righttext:x?.counterright,text_count:x?.counter},currentCharacters:N?.length??0,id:R,maxLength:I,screenReaderText:k,variant:u})]})]})});export{u as TextAreaStandAlone};
|
|
@@ -1,10 +1,8 @@
|
|
|
1
|
-
import{j as o}from"../../_virtual/jsx-runtime.js";/* empty css */import{Text as e}from"../text/text.js";import{ElementOrIcon as
|
|
2
|
-
return o.jsx("div",{className:"kbt-tooltip","data-testid":
|
|
3
|
-
/* @__PURE__ */o.jsxs("div",{className:
|
|
4
|
-
/* @__PURE__ */o.
|
|
5
|
-
/* @__PURE__ */o.
|
|
6
|
-
/* @__PURE__ */o.jsx(
|
|
7
|
-
|
|
8
|
-
/* @__PURE__ */o.jsx(
|
|
9
|
-
return o.jsxs("div",{ref:w,className:"kbt-tooltip","data-testid":G,children:[
|
|
10
|
-
/* @__PURE__ */o.jsx(j,{ariaDescribedBy:z||!to&&!H?void 0:so,childrenAsButton:x,triggerAsButton:L,onClick:O,onKeyDown:$,onMouseDown:K,onMouseUp:R,children:v}),to?no:/* @__PURE__ */o.jsx(b,{additionalClasses:I?.popover?{arrow:"",popover:I.popover.popover||""}:void 0,"aria-label":S?.["aria-label"]||U,"aria-labelledby":h({hasTitle:!!Y.children,titleId:V}),"aria-modal":z||void 0,component:"div",disableAutoFocusFirstDescendantAfterClose:!0,disableTrapFocus:!1,open:H,preventCloseOnClickElements:[w?.current],role:z?"dialog":"tooltip",strategy:"absolute",onClose:B,...S,children:no})]})};export{u as TooltipStandAlone};
|
|
1
|
+
import{j as o}from"../../_virtual/jsx-runtime.js";/* empty css */import{Text as e}from"../text/text.js";import{ElementOrIcon as t}from"../../lib/components/elementOrIcon/elementOrIcon.js";import{useId as i}from"../../lib/hooks/useId/useId.js";import{useActiveBreakpoints as s}from"../../lib/hooks/useMediaDevice/useActiveBreakpoints.js";import{POSITIONS as l}from"../../lib/types/positions/positions.js";import{classNames as r}from"../../lib/utils/classNames/classNames.js";import{isString as n}from"../../lib/utils/is/isString.js";import{pickCustomAttributes as a}from"../../lib/utils/pickCustomAttributes/pickCustomAttributes.js";import{processIcon as c}from"../../lib/utils/process/processIcon/processIcon.js";import{processText as d}from"../../lib/utils/process/processText/processText.js";import{IconHost as p}from"../icon/iconHost.js";import{Popover as m}from"../popover/popover.js";import{TooltipTrigger as b}from"./components/tooltipTrigger.js";import{getAriaDescriptorsBy as j}from"./utils/tooltip.utils.js";const u=({align:u,children:h,childrenAsButton:v=!0,closeIcon:x,content:f,contentHasScroll:g,contentRef:C,contentScrollArias:k,cssClasses:y,disabled:I,dragIcon:N,dragIconRef:T,labelRef:A,mediaDevice:w,onCloseIconClick:D,onPopoverCloseInternally:_,onTooltipFocus:B,onTooltipKeyDown:M,onTriggerClick:F,onTriggerKeyDown:O,onTriggerMouseDown:$,onTriggerMouseUp:K,popover:R,popoverOpen:S,title:H,tooltipAriaLabel:P,tooltipAsModal:U,tooltipRef:z,triggerAsButton:E,...L})=>{const q=L["data-testid"]||"tooltip",G=a(L),J=i("tooltip"),Q=`${J}Title`,V=`${J}Content`,W=d(f),X=d(H),Y=n(W.children),{isDesktop:Z,isMobile:oo,isTablet:eo}=s(),to=Z||eo;if(I)/* @__PURE__ */
|
|
2
|
+
return o.jsx("div",{className:"kbt-tooltip","data-testid":q,children:/* @__PURE__ */o.jsx(b,{childrenAsButton:v,disabled:!0,children:h})});const io=j({contentId:V,hasContent:!!f,hasTitle:!!X.children,titleId:Q}),so={"data-align":u||l.TOP},lo=a(so),ro=/* @__PURE__ */o.jsxs("div",{ref:z,"aria-label":to?P:void 0,"aria-labelledby":to?j({hasTitle:!!X.children,titleId:Q}):void 0,"aria-modal":!(!to||!U)||void 0,className:r("kbt-tooltip__external-container",y?.tooltipexternalcontainer),"data-testid":`${q}-content`,id:J,role:to?U?"dialog":"tooltip":void 0,...to&&{onFocus:B,onKeyDown:M},...G,children:[
|
|
3
|
+
/* @__PURE__ */o.jsxs("div",{className:y?.tooltipinternalcontainer,children:[(oo||eo)&&!!N&&/* @__PURE__ */o.jsx("div",{ref:T,className:y?.dragiconcontainer,"data-testid":`${q}-drag`,children:/* @__PURE__ */o.jsx(t,{className:y?.dragicon,...N})}),
|
|
4
|
+
/* @__PURE__ */o.jsxs("div",{className:r(y?.title,y?.headercontainer),style:(no=!!X.children,ao=!!x?.icon,no&&ao?{justifyContent:"space-between"}:no?{justifyContent:"flex-end"}:ao?{justifyContent:"flex-start"}:{display:"none"}),children:[c(x).icon&&/* @__PURE__ */o.jsx("div",{className:y?.closebuttoncontainer,children:/* @__PURE__ */o.jsx(p,{...c(x),className:y?.closebuttonicon,icon:c(x).icon,onClick:D})}),!!X.children&&/* @__PURE__ */o.jsx("div",{className:"kbt-tooltip__title",id:Q,children:/* @__PURE__ */o.jsx(e,{additionalClasses:{text:y?.title},component:"h2",...X,children:X.children})})]}),
|
|
5
|
+
/* @__PURE__ */o.jsx("div",{ref:C,"aria-label":g?k?.["aria-label"]:void 0,"aria-labelledby":g?k?.["aria-labelledby"]:void 0,className:"kbt-tooltip__inner-content",role:g?"region":void 0,...g&&{tabIndex:0},children:!!f&&/* @__PURE__ */o.jsx("div",{className:r("kbt-tooltip__paragraph",y?.paragraphcontainer,{[`${y?.divider}`]:!!X.children}),id:V,children:Y?/* @__PURE__ */o.jsx(e,{additionalClasses:{text:y?.paragraph},...W}):W.children})})]}),
|
|
6
|
+
/* @__PURE__ */o.jsx("div",{...lo,className:r("kbt-tooltip__arrow",y?.arrowsize,y?.tooltipalignstyles,y?.arrowcontainer),children:/* @__PURE__ */o.jsx("div",{className:y?.arrow})})]});var no,ao;/* @__PURE__ */
|
|
7
|
+
return o.jsxs("div",{ref:A,className:"kbt-tooltip","data-testid":q,children:[
|
|
8
|
+
/* @__PURE__ */o.jsx(b,{ariaDescribedBy:U||!to&&!S?void 0:io,childrenAsButton:v,triggerAsButton:E,onClick:F,onKeyDown:O,onMouseDown:$,onMouseUp:K,children:h}),to?ro:/* @__PURE__ */o.jsx(m,{additionalClasses:y?.popover?{arrow:"",popover:y.popover.popover||""}:void 0,"aria-label":R?.["aria-label"]||P,"aria-labelledby":j({hasTitle:!!X.children,titleId:Q}),"aria-modal":U||void 0,component:"div",disableAutoFocusFirstDescendantAfterClose:!0,disableTrapFocus:!1,open:S,preventCloseOnClickElements:[A?.current],role:U?"dialog":"tooltip",strategy:"absolute",onClose:_,...R,children:ro})]})};export{u as TooltipStandAlone};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kubit-ui-web/react-components",
|
|
3
|
-
"version": "2.0.0-beta.
|
|
3
|
+
"version": "2.0.0-beta.5",
|
|
4
4
|
"description": "Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience",
|
|
5
5
|
"author": {
|
|
6
6
|
"name": "Kubit",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});exports.RenderIf=({children:e,condition:t})=>t?e:null;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
const n=({children:n,condition:o})=>o?n:null;export{n as RenderIf};
|