@kubit-ui-web/react-components 2.0.0-beta.11 ā 2.0.0-beta.12
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/README.md +2 -2
- package/dist/cjs/.storybook/bundle-sizes.json +13 -0
- package/dist/cjs/assets/banner_kubit_readme.png +0 -0
- package/dist/cjs/components/avatar/fragments/drawContent.js +1 -1
- package/dist/cjs/components/badge/badgeStandAlone.js +1 -1
- package/dist/cjs/components/button/button.js +1 -1
- package/dist/cjs/components/button/buttonStandAlone.js +1 -1
- package/dist/cjs/components/cardImage/cardImageStandAlone.js +1 -1
- package/dist/cjs/components/carousel/hooks/useCarousel.js +1 -1
- package/dist/cjs/components/carousel/hooks/useCarouselKeyNavigation.js +1 -1
- package/dist/cjs/components/checkboxBase/checkboxBaseStandAlone.js +1 -1
- package/dist/cjs/components/chip/chipStandAlone.js +1 -1
- package/dist/cjs/components/container/containerStandAlone.js +1 -1
- package/dist/cjs/components/dataTable/hooks/useDataTableHasScroll.js +1 -1
- package/dist/cjs/components/dataTable/hooks/useDataTableShadow.js +1 -1
- package/dist/cjs/components/dataTable/hooks/useDataTableStickyDividers.js +1 -1
- package/dist/cjs/components/dataTable/hooks/useDataTableStickyLeftColumns.js +1 -1
- package/dist/cjs/components/dataTable/hooks/useDataTableStickyRightColumns.js +1 -1
- package/dist/cjs/components/dropdownSelected/dropdownSelectedControlled.js +1 -1
- package/dist/cjs/components/dropdownSelected/dropdownSelectedStandAlone.js +1 -1
- package/dist/cjs/components/input/input.js +1 -1
- package/dist/cjs/components/inputSignature/inputSignatureStandAlone.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/modalControlled.js +1 -1
- package/dist/cjs/components/modal/modalStandAlone.js +1 -1
- package/dist/cjs/components/modal/modalUnControlled.js +1 -1
- package/dist/cjs/components/option/optionStandAlone.js +1 -1
- package/dist/cjs/components/popover/hooks/usePopoverInteractions.js +1 -1
- package/dist/cjs/components/popover/hooks/usePopoverLifecycle.js +1 -1
- package/dist/cjs/components/radioButton/radioButtonStandAlone.js +1 -1
- package/dist/cjs/components/selectorBoxFile/components/selectorBoxFileContainerBox.js +1 -1
- package/dist/cjs/components/selectorBoxFile/components/selectorBoxFileErrorMessage.js +1 -1
- package/dist/cjs/components/selectorBoxFile/components/selectorBoxFileHeader.js +1 -1
- package/dist/cjs/components/slider/sliderStandAlone.js +1 -1
- package/dist/cjs/components/table/hooks/useTableHasScroll.js +1 -1
- package/dist/cjs/components/table/hooks/useTableShadow.js +1 -1
- package/dist/cjs/components/table/hooks/useTableStickyLeftColumns.js +1 -1
- package/dist/cjs/components/table/hooks/useTableStickyRightColumns.js +1 -1
- package/dist/cjs/components/tabs/tabsStandAlone.js +1 -1
- package/dist/cjs/components/tag/tagStandAlone.js +1 -1
- package/dist/cjs/components/textArea/components/errorStandAlone.js +1 -1
- package/dist/cjs/components/textArea/components/helpMessageStandAlone.js +1 -1
- package/dist/cjs/components/textArea/components/titleStandAlone.js +1 -1
- package/dist/cjs/components/textArea/textAreaStandAlone.js +1 -1
- package/dist/cjs/components/toggle/toggleStandAlone.js +1 -1
- package/dist/cjs/components/tooltip/tooltipStandAlone.js +1 -1
- package/dist/cjs/components/tooltip/tooltipUnControlled.js +1 -1
- package/dist/cjs/lib/components/errorMessage/errorMessageStandAlone.js +1 -1
- package/dist/cjs/lib/hooks/useContentVisibility/useContentVisibility.js +1 -1
- package/dist/cjs/lib/hooks/useScrollDetection/useScrollDetection.js +1 -1
- package/dist/cjs/lib/utils/keyboard/keyboard.js +1 -1
- package/dist/cjs/lib/utils/process/processCommonProp.js +1 -0
- package/dist/cjs/scripts/generate-bundle-sizes.mjs +236 -0
- package/dist/cjs/scripts/new-component-web-ui.js +2092 -0
- package/dist/esm/.storybook/bundle-sizes.json +13 -0
- package/dist/esm/assets/banner_kubit_readme.png +0 -0
- package/dist/esm/components/avatar/fragments/drawContent.js +1 -1
- package/dist/esm/components/badge/badgeStandAlone.js +6 -6
- package/dist/esm/components/button/button.js +1 -1
- package/dist/esm/components/button/buttonStandAlone.js +3 -3
- package/dist/esm/components/cardImage/cardImageStandAlone.js +7 -7
- package/dist/esm/components/carousel/hooks/useCarousel.js +1 -1
- package/dist/esm/components/carousel/hooks/useCarouselKeyNavigation.js +1 -1
- package/dist/esm/components/checkboxBase/checkboxBaseStandAlone.js +4 -4
- package/dist/esm/components/chip/chipStandAlone.js +7 -7
- package/dist/esm/components/container/containerStandAlone.js +4 -4
- package/dist/esm/components/dataTable/hooks/useDataTableHasScroll.js +1 -1
- package/dist/esm/components/dataTable/hooks/useDataTableShadow.js +1 -1
- package/dist/esm/components/dataTable/hooks/useDataTableStickyDividers.js +1 -1
- package/dist/esm/components/dataTable/hooks/useDataTableStickyLeftColumns.js +1 -1
- package/dist/esm/components/dataTable/hooks/useDataTableStickyRightColumns.js +1 -1
- package/dist/esm/components/dropdownSelected/dropdownSelectedControlled.js +1 -1
- package/dist/esm/components/dropdownSelected/dropdownSelectedStandAlone.js +5 -5
- package/dist/esm/components/input/input.js +2 -2
- package/dist/esm/components/inputSignature/inputSignatureStandAlone.js +3 -3
- package/dist/esm/components/listOptions/listOptionsStandAlone.js +2 -2
- package/dist/esm/components/message/messageStandAlone.js +5 -5
- package/dist/esm/components/modal/fragments/modalHeader.js +1 -1
- package/dist/esm/components/modal/modalControlled.js +1 -1
- package/dist/esm/components/modal/modalStandAlone.js +3 -3
- package/dist/esm/components/modal/modalUnControlled.js +2 -2
- package/dist/esm/components/option/optionStandAlone.js +9 -9
- package/dist/esm/components/popover/hooks/usePopoverInteractions.js +1 -1
- package/dist/esm/components/popover/hooks/usePopoverLifecycle.js +1 -1
- package/dist/esm/components/radioButton/radioButtonStandAlone.js +4 -4
- package/dist/esm/components/selectorBoxFile/components/selectorBoxFileContainerBox.js +4 -4
- package/dist/esm/components/selectorBoxFile/components/selectorBoxFileErrorMessage.js +2 -2
- package/dist/esm/components/selectorBoxFile/components/selectorBoxFileHeader.js +5 -5
- package/dist/esm/components/slider/sliderStandAlone.js +14 -14
- package/dist/esm/components/table/hooks/useTableHasScroll.js +1 -1
- package/dist/esm/components/table/hooks/useTableShadow.js +1 -1
- package/dist/esm/components/table/hooks/useTableStickyLeftColumns.js +1 -1
- package/dist/esm/components/table/hooks/useTableStickyRightColumns.js +1 -1
- package/dist/esm/components/tabs/tabsStandAlone.js +4 -4
- package/dist/esm/components/tag/tagStandAlone.js +4 -4
- package/dist/esm/components/textArea/components/errorStandAlone.js +3 -3
- package/dist/esm/components/textArea/components/helpMessageStandAlone.js +1 -1
- package/dist/esm/components/textArea/components/titleStandAlone.js +1 -1
- package/dist/esm/components/textArea/textAreaStandAlone.js +11 -11
- package/dist/esm/components/toggle/toggleStandAlone.js +4 -4
- package/dist/esm/components/tooltip/tooltipStandAlone.js +7 -7
- package/dist/esm/components/tooltip/tooltipUnControlled.js +1 -1
- package/dist/esm/lib/components/errorMessage/errorMessageStandAlone.js +4 -4
- package/dist/esm/lib/hooks/useContentVisibility/useContentVisibility.js +1 -1
- package/dist/esm/lib/hooks/useScrollDetection/useScrollDetection.js +1 -1
- package/dist/esm/lib/utils/keyboard/keyboard.js +1 -1
- package/dist/esm/lib/utils/process/processCommonProp.js +1 -0
- package/dist/esm/scripts/generate-bundle-sizes.mjs +236 -0
- package/dist/esm/scripts/new-component-web-ui.js +2092 -0
- package/package.json +2 -2
- package/dist/cjs/lib/hooks/useInputFocus/useInputFocus.js +0 -1
- package/dist/cjs/lib/utils/process/processIcon/processIcon.js +0 -1
- package/dist/cjs/lib/utils/process/processText/processText.js +0 -1
- package/dist/cjs/lib/utils/resizeObserver/resizeObserver.js +0 -1
- package/dist/esm/lib/hooks/useInputFocus/useInputFocus.js +0 -1
- package/dist/esm/lib/utils/process/processIcon/processIcon.js +0 -1
- package/dist/esm/lib/utils/process/processText/processText.js +0 -1
- package/dist/esm/lib/utils/resizeObserver/resizeObserver.js +0 -1
- /package/dist/cjs/lib/{hooks/syncRefs ā utils/refs}/syncRefs.js +0 -0
- /package/dist/esm/lib/{hooks/syncRefs ā utils/refs}/syncRefs.js +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../_virtual/jsx-runtime.js"),e=require("react"),s=require("../text/text.js"),a=require("../../lib/components/elementOrIcon/elementOrIcon.js"),i=require("../../lib/components/itemRove/itemRove.js"),n=require("../../lib/hooks/useMediaDevice/useActiveBreakpoints.js"),o=require("../../lib/types/states/states.js"),r=require("../../lib/utils/classNames/classNames.js"),l=require("../../lib/utils/pickCustomAttributes/pickCustomAttributes.js"),c=require("../../lib/utils/process/
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../_virtual/jsx-runtime.js"),e=require("react"),s=require("../text/text.js"),a=require("../../lib/components/elementOrIcon/elementOrIcon.js"),i=require("../../lib/components/itemRove/itemRove.js"),n=require("../../lib/hooks/useMediaDevice/useActiveBreakpoints.js"),o=require("../../lib/types/states/states.js"),r=require("../../lib/utils/classNames/classNames.js"),l=require("../../lib/utils/pickCustomAttributes/pickCustomAttributes.js"),c=require("../../lib/utils/process/processCommonProp.js"),b=require("./hooks/useTabs/useTabs.js"),d=e.forwardRef(({allowFocusTabPanel:d=!0,autoWidth:u=!1,content:m,cssClasses:x,device:p,hideLabelForSingleTab:j,leftControlAriaLabel:h,leftIcon:$,maxTabsInView:T=3,onSelectTab:E,rightControlAriaLabel:v,rightIcon:C,selectedTab:R,tabs:S,unMountContent:N=!0,...f},A)=>{const{isMobile:I}=n.useActiveBreakpoints(),g=`tabs-${e.useId().replace(/:/g,"")}`,k=`${g}-tab-list`,q=`${g}-tab-panel`,y=S?.length??0,w=Math.min(y,T),{focus:L,handleClickIcon:P,handleClickTab:M,listEl:O,position:D}=b.useTabs({numTabsInView:w,selectedTab:R,tabsLength:y}),F=0===D,B=D>=y-w,V=f["data-testid"]||"tabs",W=l.pickCustomAttributes(f),U=e=>{const s="left"===e,i=s?F:B;return y>w?t.jsxRuntimeExports.jsx("button",{"aria-label":s?h:v,className:x?.arrowiconcontainer,"data-position":s?"left":"right","data-testid":`${V}-icon-${e}`,disabled:i,tabIndex:0,type:"button",onClick:()=>{i||P(!s)},children:t.jsxRuntimeExports.jsx(a.ElementOrIcon,{className:x?.icon,customAttributes:{"data-disabled":i},"data-position":s?"left":"right",...s?$:C})}):null};return t.jsxRuntimeExports.jsxs("div",{ref:A,className:x?.tabs,"data-testid":V,...W,children:[t.jsxRuntimeExports.jsxs("div",{className:x?.container,children:[U("left"),t.jsxRuntimeExports.jsx("div",{ref:O,className:x?.tabbuttonscontainer,id:k,role:"tablist",children:S?.map((e,a)=>{const n=R===a,b=n?o.STATES.SELECTED:o.STATES.UNSELECTED,d=a>=D&&a<D+w,m={"data-state":b};return t.jsxRuntimeExports.jsx("div",{className:x?.tabcontainer,"data-testid":`${V}-tab-${a}`,...l.pickCustomAttributes(m),style:{minWidth:I?`calc(100% / ${w})`:"auto",width:u?"auto":`calc(100% / ${y})`},children:y>1?t.jsxRuntimeExports.jsx(i.ItemRove,{ariaDisabled:I&&!d||e.disabled,ariaSelected:n,asElement:"button",checkIsFirstTime:!0,classNames:r.classNames(x?.tabbutton,{[`${x?.firsttabbutton}`]:0===a,[`${x?.lasttabbutton}`]:a===y-1}),customAttributes:m,disabled:I&&!d||e.disabled,focus:L===a,id:`${g}-tab-${a}`,index:a,preventScrollOnFocus:!0,role:"tab",type:"button",onSelectItem:()=>{E?.(a),M(a)},children:t.jsxRuntimeExports.jsx(s.Text,{additionalClasses:{text:x?.label},component:"span",customAttributes:m,"data-hidden":!!j,...c.processTextProp(e)})}):t.jsxRuntimeExports.jsx("div",{className:r.classNames(x?.onetabcontainer,{[`${x?.tabbutton}`]:!!j}),id:`${g}-tab-${a}`,role:"tab",children:t.jsxRuntimeExports.jsx(s.Text,{additionalClasses:{text:x?.label},"data-hidden":!!j,...c.processTextProp(e),children:c.processTextProp(e).children})})},`${V}-tab-${a.toString()}`)})}),U("right")]}),(()=>{const e={role:"tabpanel",tabIndex:d?0:-1};return N?null!=R&&t.jsxRuntimeExports.jsx("div",{"aria-labelledby":`${g}-tab-${R}`,className:x?.contentcontainer,...e,children:m?.[R]}):m?.map((s,a)=>t.jsxRuntimeExports.jsx("div",{"aria-labelledby":`${g}-tab-${a}`,className:x?.contentcontainer,id:`${q}-${a}`,style:{display:R===a?"block":"none"},...e,children:s},`${g}-${a.toString()}-tab`))})()]})});exports.TabsStandAlone=d;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js"),t=require("react"),s=require("../text/text.js"),o=require("../../lib/components/customComponent/customComponent.js"),r=require("../../lib/components/elementOrIcon/elementOrIcon.js"),n=require("../../lib/utils/pickCustomAttributes/pickCustomAttributes.js"),i=require("../../lib/utils/process/processCommonProp.js"),c=t.forwardRef(({component:t="div",cssClasses:c,icon:m,label:u,...p},l)=>{const a=n.pickCustomAttributes(p);return e.jsxRuntimeExports.jsx(o.CustomComponent,{ref:l,className:c?.tag,component:t,"data-testid":"tag",...a,children:e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(r.ElementOrIcon,{className:c?.icon,...i.processIconProp(m)}),e.jsxRuntimeExports.jsx(s.Text,{additionalClasses:{text:c?.label},component:"span",...i.processTextProp(u)})]})})});exports.TagStandAlone=c;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../_virtual/jsx-runtime.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../_virtual/jsx-runtime.js"),r=require("../../text/text.js"),s=require("../../../lib/components/elementOrIcon/elementOrIcon.js"),t=require("../../../lib/types/states/states.js"),o=require("../../../lib/utils/process/processCommonProp.js");exports.ErrorStandAlone=({cssClasses:i,customAttributtes:n,errorAriaLiveType:c,errorIcon:x,errorMessage:l,id:a,state:p})=>e.jsxRuntimeExports.jsx("div",{"aria-live":c,className:i?.errorcontainer,id:a,...n,children:!!o.processTextProp(l).children&&p===t.STATES.ERROR&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(s.ElementOrIcon,{className:i?.erroricon,customAttributes:n,...x}),e.jsxRuntimeExports.jsx(r.Text,{additionalClasses:{text:i?.errormessage},component:"p",customAttributes:n,...o.processTextProp(l),children:o.processTextProp(l).children})]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../_virtual/jsx-runtime.js"),s=require("../../text/text.js"),t=require("../../../lib/utils/process/
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../_virtual/jsx-runtime.js"),s=require("../../text/text.js"),t=require("../../../lib/utils/process/processCommonProp.js");exports.HelpMessageStandAlone=({cssClasses:r,customAttributtes:o,helpMessage:i,id:l})=>e.jsxRuntimeExports.jsx(s.Text,{additionalClasses:{text:r?.helpmessage},component:"small",customAttributes:o,id:l,...t.processTextProp(i)});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../../_virtual/jsx-runtime.js"),e=require("../../text/text.js"),s=require("../../../lib/utils/process/processCommonProp.js");exports.TitleStandAlone=({cssClasses:r,customAttributtes:o,title:i})=>i?t.jsxRuntimeExports.jsx("div",{className:r?.titlecontainer,...o,children:t.jsxRuntimeExports.jsx(e.Text,{additionalClasses:{text:r?.title},customAttributes:o,...s.processTextProp(i),component:s.processTextProp(i).component??"p",children:s.processTextProp(i).children})}):null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js"),t=require("react"),s=require("../label/labelStandAlone.js"),r=require("../../lib/types/states/states.js"),a=require("../../lib/utils/pickCustomAttributes/pickCustomAttributes.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js"),t=require("react"),s=require("../label/labelStandAlone.js"),r=require("../../lib/types/states/states.js"),a=require("../../lib/utils/pickCustomAttributes/pickCustomAttributes.js"),o=require("../../lib/utils/process/processCommonProp.js"),i=require("./components/errorStandAlone.js"),n=require("./components/helpMessageStandAlone.js"),l=require("./components/textCount/textCount.js"),u=require("./components/titleStandAlone.js"),c=require("./utils/aria.utils.js"),d=t.forwardRef(({additionalInfo:d,counterVariant:x,cssClasses:p,errorAriaLiveType:m="assertive",errorIcon:h,errorMessage:j,height:b,helpMessage:A,id:g,label:C,labelInsideTextArea:E,maxLength:T,onBlur:S,onChange:q,onFocus:v,placeholder:I,required:R,screenReaderTextCount:y,spellCheck:f,state:L,title:M,value:k,...B},D)=>{const P=`textarea-${t.useId().replace(/:/g,"")}`,N=g??P,_=`${N}HelpText`,$=`${N}Error`,F=`${N}TextCount`,H=a.pickCustomAttributes({"data-state":L}),w=[r.STATES.DISABLED_EMPTY,r.STATES.DISABLED_FILLED].includes(L);return e.jsxRuntimeExports.jsxs("div",{ref:D,className:p?.text_area,"data-testid":"text-area",...H,...a.pickCustomAttributes(B),children:[e.jsxRuntimeExports.jsx(u.TitleStandAlone,{cssClasses:p,customAttributtes:H,title:M}),e.jsxRuntimeExports.jsxs("div",{className:p?.labeltextareacontainer,role:"button",style:{height:E?b:void 0},tabIndex:0,onClick:()=>document.getElementById(N)?.focus(),onKeyDown:e=>{"Enter"===e.key&&document.getElementById(N)?.focus()},children:[e.jsxRuntimeExports.jsxs("div",{className:p?.labelandadditionalinfocontainer,children:[e.jsxRuntimeExports.jsx(s.LabelStandAlone,{asteriskCssClasses:p?.required,customAttributes:H,inputId:N,required:R,textCssClasses:p?.label,...o.processTextProp(C),children:o.processTextProp(C).children}),d]}),e.jsxRuntimeExports.jsx("textarea",{"aria-describedby":c.buildAriaDescribedBy({errorMessage:o.processTextProp(j).children,helpMessage:o.processTextProp(A).children,state:L,textAreaErrorId:$,textAreaHelpTextId:_}),className:p?.textarea,disabled:w,id:N,maxLength:T,placeholder:I,required:R,spellCheck:f,style:{height:b||void 0},value:k,onBlur:S,onChange:q,onFocus:v,...H,children:k})]}),e.jsxRuntimeExports.jsxs("div",{className:p?.bottomcontainer,...H,children:[e.jsxRuntimeExports.jsxs("div",{className:p?.helpmessageerrorcontainer,...H,children:[e.jsxRuntimeExports.jsx(i.ErrorStandAlone,{cssClasses:p,customAttributtes:H,errorAriaLiveType:m,errorIcon:h,errorMessage:j,id:$,state:L}),e.jsxRuntimeExports.jsx(n.HelpMessageStandAlone,{cssClasses:p,customAttributtes:H,helpMessage:A,id:_})]}),!!x&&e.jsxRuntimeExports.jsx(l.TextCount,{additionalClasses:{letftext:p?.counterleft,righttext:p?.counterright,text_count:p?.counter},currentCharacters:k?.length??0,id:F,maxLength:T,screenReaderText:y,variant:x})]})]})});exports.TextAreaStandAlone=d;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js"),s=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js"),s=require("react"),o=require("../../lib/components/customComponent/customComponent.js"),t=require("../../lib/components/elementOrIcon/elementOrIcon.js"),n=require("../../lib/utils/pickCustomAttributes/pickCustomAttributes.js"),a=require("../../lib/utils/process/processCommonProp.js"),r=require("./utils/buildComponentProps.js"),i=require("./utils/thumbTransformCalculations.js"),l=({checked:l=!1,component:c="button",cssClasses:d,dataTestId:u="toggle",disabled:m=!1,id:p,leftIcon:b,name:x,onBlur:j,onClick:v,onFocus:f,onKeyDown:h,onMouseEnter:y,onMouseLeave:C,rightIcon:g,tabIndex:k,value:I,...R},E)=>{const q=l&&!!g,N=!l&&!!b,T="button"!==c,P=s.useRef(null),w=s.useRef(null),{transform:M}=i.useToggleTransform({checked:l,thumbRef:w,trackRef:P});s.useImperativeHandle(E,()=>P.current,[]);const O=n.pickCustomAttributes(R),A=r.buildComponentProps({"aria-describedby":R["aria-describedby"],"aria-label":R["aria-label"],"aria-labelledby":R["aria-labelledby"],checked:l,decorative:T,disabled:m,id:p,name:x,onBlur:j,onClick:v,onFocus:f,onKeyDown:h,onMouseEnter:y,onMouseLeave:C,tabIndex:k,value:I});return e.jsxRuntimeExports.jsx(o.CustomComponent,{...O,...A,ref:P,className:d?.track,component:c,"data-checked":!!l||void 0,"data-disabled":!!m||void 0,"data-testid":u,children:e.jsxRuntimeExports.jsxs("span",{ref:w,className:d?.thumb,"data-checked":!!l||void 0,"data-disabled":!!m||void 0,style:{transform:M},children:[e.jsxRuntimeExports.jsx("div",{className:d?.iconwrapper,"data-testid":`${u}-right-icon`,style:{opacity:q?1:0},children:e.jsxRuntimeExports.jsx(t.ElementOrIcon,{className:d?.icon,"data-disabled":!!m||void 0,...a.processIconProp(g)})}),e.jsxRuntimeExports.jsx("div",{className:d?.iconwrapper,"data-testid":`${u}-left-icon`,style:{opacity:N?1:0},children:e.jsxRuntimeExports.jsx(t.ElementOrIcon,{className:d?.icon,"data-disabled":!!m||void 0,...a.processIconProp(b)})})]})})};l.displayName="ToggleStandAlone";const c=s.forwardRef(l);exports.ToggleStandalone=c;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js");;/* empty css */const t=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js");;/* empty css */const t=require("react"),o=require("../text/text.js"),s=require("../../lib/components/elementOrIcon/elementOrIcon.js"),i=require("../../lib/hooks/useMediaDevice/useActiveBreakpoints.js"),r=require("../../lib/types/positions/positions.js"),n=require("../../lib/utils/classNames/classNames.js"),l=require("../../lib/utils/pickCustomAttributes/pickCustomAttributes.js"),a=require("../../lib/utils/process/processCommonProp.js"),c=require("../icon/iconHost.js"),p=require("../popover/popover.js"),d=require("./components/tooltipTrigger.js"),u=require("./utils/tooltip.utils.js");exports.TooltipStandAlone=({align:x,children:m,childrenAsButton:j=!0,closeIcon:b,content:v,contentHasScroll:g,contentRef:h,contentScrollArias:y,cssClasses:T,disabled:C,dragIcon:R,dragIconRef:E,labelRef:N,mediaDevice:k,onCloseIconClick:A,onPopoverCloseInternally:I,onTooltipFocus:f,onTooltipKeyDown:q,onTriggerClick:D,onTriggerKeyDown:w,onTriggerMouseDown:B,onTriggerMouseUp:P,popover:_,popoverOpen:O,title:M,tooltipAriaLabel:S,tooltipAsModal:$,tooltipRef:F,triggerAsButton:K,...H})=>{const U=H["data-testid"]||"tooltip",z=l.pickCustomAttributes(H),L=`tooltip-${t.useId().replace(/:/g,"")}`,G=`${L}-title`,J=`${L}-content`,Q=a.processTextProp(v),V=a.processTextProp(M),W="string"==typeof Q.children,{isDesktop:X,isMobile:Y,isTablet:Z}=i.useActiveBreakpoints(),ee=X||Z;if(C)return e.jsxRuntimeExports.jsx("div",{className:"kbt-tooltip","data-testid":U,children:e.jsxRuntimeExports.jsx(d.TooltipTrigger,{childrenAsButton:j,disabled:!0,children:m})});const te=u.getAriaDescriptorsBy({contentId:J,hasContent:!!v,hasTitle:!!V.children,titleId:G}),oe={"data-align":x||r.POSITIONS.TOP},se=l.pickCustomAttributes(oe),ie=e.jsxRuntimeExports.jsxs("div",{ref:F,"aria-label":ee?S:void 0,"aria-labelledby":ee?u.getAriaDescriptorsBy({hasTitle:!!V.children,titleId:G}):void 0,"aria-modal":!(!ee||!$)||void 0,className:n.classNames("kbt-tooltip__external-container",T?.tooltipexternalcontainer),"data-testid":`${U}-content`,id:L,role:ee?$?"dialog":"tooltip":void 0,...ee&&{onFocus:f,onKeyDown:q},...z,children:[e.jsxRuntimeExports.jsxs("div",{className:T?.tooltipinternalcontainer,children:[(Y||Z)&&!!R&&e.jsxRuntimeExports.jsx("div",{ref:E,className:T?.dragiconcontainer,"data-testid":`${U}-drag`,children:e.jsxRuntimeExports.jsx(s.ElementOrIcon,{className:T?.dragicon,...R})}),e.jsxRuntimeExports.jsxs("div",{className:n.classNames(T?.title,T?.headercontainer),style:(re=!!V.children,ne=!!b?.icon,re&&ne?{justifyContent:"space-between"}:re?{justifyContent:"flex-end"}:ne?{justifyContent:"flex-start"}:{display:"none"}),children:[a.processIconProp(b).icon&&e.jsxRuntimeExports.jsx("div",{className:T?.closebuttoncontainer,children:e.jsxRuntimeExports.jsx(c.IconHost,{...a.processIconProp(b),className:T?.closebuttonicon,icon:a.processIconProp(b).icon,onClick:A})}),!!V.children&&e.jsxRuntimeExports.jsx("div",{className:"kbt-tooltip__title",id:G,children:e.jsxRuntimeExports.jsx(o.Text,{additionalClasses:{text:T?.title},component:"h2",...V,children:V.children})})]}),e.jsxRuntimeExports.jsx("div",{ref:h,"aria-label":g?y?.["aria-label"]:void 0,"aria-labelledby":g?y?.["aria-labelledby"]:void 0,className:"kbt-tooltip__inner-content",role:g?"region":void 0,...g&&{tabIndex:0},children:!!v&&e.jsxRuntimeExports.jsx("div",{className:n.classNames("kbt-tooltip__paragraph",T?.paragraphcontainer,{[`${T?.divider}`]:!!V.children}),id:J,children:W?e.jsxRuntimeExports.jsx(o.Text,{additionalClasses:{text:T?.paragraph},...Q}):Q.children})})]}),e.jsxRuntimeExports.jsx("div",{...se,className:n.classNames("kbt-tooltip__arrow",T?.arrowsize,T?.tooltipalignstyles,T?.arrowcontainer),children:e.jsxRuntimeExports.jsx("div",{className:T?.arrow})})]});var re,ne;return e.jsxRuntimeExports.jsxs("div",{ref:N,className:"kbt-tooltip","data-testid":U,children:[e.jsxRuntimeExports.jsx(d.TooltipTrigger,{ariaDescribedBy:$||!ee&&!O?void 0:te,childrenAsButton:j,triggerAsButton:K,onClick:D,onKeyDown:w,onMouseDown:B,onMouseUp:P,children:m}),ee?ie:e.jsxRuntimeExports.jsx(p.Popover,{additionalClasses:T?.popover?{arrow:"",popover:T.popover.popover||""}:void 0,"aria-label":_?.["aria-label"]||S,"aria-labelledby":u.getAriaDescriptorsBy({hasTitle:!!V.children,titleId:G}),"aria-modal":$||void 0,component:"div",disableAutoFocusFirstDescendantAfterClose:!0,disableTrapFocus:!1,open:O,preventCloseOnClickElements:[N?.current],role:$?"dialog":"tooltip",strategy:"absolute",onClose:I,..._,children:ie})]})};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js"),o=require("react"),r=require("../../lib/hooks/useClassName/useClassName.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js"),o=require("react"),s=require("../../lib/constants/keyboardKeys/keyboardKeys.js"),r=require("../../lib/hooks/useClassName/useClassName.js"),t=require("../../lib/hooks/useMediaDevice/useActiveBreakpoints.js"),l=require("../../lib/hooks/useScrollDetection/useScrollDetection.js"),i=require("../../lib/hooks/useSwipeDown/useSwipeDown.js"),n=require("../../lib/hooks/useTrapFocus/useTrapFocus.js"),a=require("../../lib/utils/keyboard/keyboard.js"),u=require("./hooks/useTooltip.js"),p=require("./hooks/useTooltipAsModal.js"),c=require("./tooltipStandAlone.js"),d=o.forwardRef(function({additionalClasses:d,align:T,closeIcon:v,onOpenClose:f,popover:g,tooltipAriaLabel:b,tooltipAsModal:k,variant:C,...j},D){const R=r.useClassName({additionalClassNames:d,component:"TOOLTIP",variant:C}),{device:y,isDesktop:M,isMobile:A,isTablet:S}=t.useActiveBreakpoints(),q=M||S,h=o.useRef(null),m=o.useRef(null),w=p.useTooltipAsModal({propTooltipAsModal:k,styleTooltipAsModal:k});o.useImperativeHandle(D,()=>h.current);const{allowFocusOpenTooltip:F,hideTooltip:x,open:I,placement:O,showTooltip:P}=u.useTooltip({additionalClasses:d,align:T||"top",labelRef:h,onOpenClose:f,tooltipAsModal:w,tooltipRef:m,variant:C}),{handleScrollDetection:N,hasScroll:E}=l.useScrollDetection({autoFocus:!0}),K=o.useRef(!1),{setDragIconRef:L,setPopoverRef:W}=i.useSwipeDown({onClose:x});return n.useTrapFocus({ref:m,trapFocus:I&&w}),e.jsxRuntimeExports.jsx(c.TooltipStandAlone,{...j,align:O,contentHasScroll:E,contentRef:N,cssClasses:R,dragIconRef:L,labelRef:h,mediaDevice:y,popover:{...g,popoverContainerRef:W},popoverOpen:I,tooltipAriaLabel:b,tooltipAsModal:w,tooltipRef:m,onCloseIconClick:e=>{v?.onClick?.(e),x()},onPopoverCloseInternally:()=>{g?.onClose?.(),x()},onTooltipFocus:e=>{w||(e.preventDefault(),e.stopPropagation())},onTriggerClick:e=>{if(q){if(!w)return;return I?void(m.current?.contains(e.target)||x()):void P()}I?m.current?.contains(e.target)||x():P()},onTriggerKeyDown:e=>{a.isKeyPressed(e.key,s.ENTER.key)&&!I&&(P(),e.preventDefault())},onTriggerMouseDown:()=>{K.current=!0},onTriggerMouseUp:()=>{K.current=!1},onWrapperBlur:e=>{w||e.currentTarget.contains(e.relatedTarget)||x()},onWrapperFocus:()=>{K.current||w||!F.current||A||P()},onWrapperMouseEnter:()=>{!w&&q&&P()},onWrapperMouseLeave:()=>{!w&&q&&x()}})});exports.Tooltip=d,exports.TooltipUnControlled=d;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../../../_virtual/jsx-runtime.js"),e=require("react"),r=require("../../../components/text/text.js"),t=require("../elementOrIcon/elementOrIcon.js"),o=require("../../utils/classNames/classNames.js"),i=require("../../utils/pickCustomAttributes/pickCustomAttributes.js"),n=require("../../utils/process/
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../../../_virtual/jsx-runtime.js"),e=require("react"),r=require("../../../components/text/text.js"),t=require("../elementOrIcon/elementOrIcon.js"),o=require("../../utils/classNames/classNames.js"),i=require("../../utils/pickCustomAttributes/pickCustomAttributes.js"),n=require("../../utils/process/processCommonProp.js"),u=e.forwardRef(({cssClasses:e,icon:u,message:c,...a},m)=>{if(!c)return null;const l=i.pickCustomAttributes(a);return s.jsxRuntimeExports.jsx("div",{ref:m,...l,className:o.classNames("kbt-error-message__container",e?.error_message,{"kbt-sr-only":!a.show}),id:a.id,children:a.show&&s.jsxRuntimeExports.jsxs(s.jsxRuntimeExports.Fragment,{children:[s.jsxRuntimeExports.jsx(t.ElementOrIcon,{className:e?.icon,...n.processIconProp(u)}),s.jsxRuntimeExports.jsx(r.Text,{additionalClasses:{text:e?.typography},...n.processTextProp(c)})]})})});exports.ErrorMessageStandAlone=u;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=require("
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=require("./utils/contentVisibility.js");exports.useContentVisibility=({minVisibleHeight:n=100,onContentInvisible:r,onContentVisible:s})=>{const i=e.useRef(null),o=e.useRef(null),c=e.useRef(),u=e.useRef(),l=e.useRef(void 0),b=e.useCallback(()=>{const e=i.current,t=o.current;e&&t&&(s?s():(e.style.overflowY="",t.style.overflowY=""))},[s]),a=e.useCallback(()=>{const e=i.current,t=o.current;e&&t&&(r?r():(e.style.overflowY="auto",t.style.overflowY="visible"))},[r]);return{handleContentVisibility:e.useCallback(({container:e,content:r})=>{if(i.current=e,o.current=r,e&&r){const s=()=>{const s=t.isContentVisibleEnough({container:e,content:r,minVisibleHeight:n});s!==l.current&&(s?b():a()),l.current=s};s(),c.current=new ResizeObserver(()=>{s()}),u.current=new ResizeObserver(()=>{s()}),c.current.observe(r),c.current.observe(e)}else c.current?.disconnect(),u.current?.disconnect()},[n,b,a])}};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),r=require("../../utils/
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),r=require("../../utils/scroll/hasScroll.js");exports.useScrollDetection=({autoFocus:t=!1}={})=>{const[s,c]=e.useState(!1),o=e.useRef(),l=e.useRef(!1);return{handleScrollDetection:e.useCallback(e=>{if(e){const s=e=>{const s=r.hasScroll(e);c(s),t&&s&&!l.current&&(e.focus(),l.current=!0)};s(e),o.current=new ResizeObserver(()=>{s(e)}),o.current.observe(e)}else o.current?.disconnect()},[t]),hasScroll:s}};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});exports.isKeyPressed=(e,...r)=>r.some(r=>Array.isArray(r)?r.includes(e):e===r);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=(t,r={})=>{const{allowReactElements:n=!0,extractContent:o=!0,maxLength:l,propertyName:c="children"}=r;if(null==t)return"children"===c?{children:null}:{};if("string"==typeof t){const e=l&&t.length>l?t.substring(0,l):t;return{[c]:e}}if(n&&e.isValidElement(t))return{children:t};if("object"==typeof t&&null!==t){if(o&&"content"in t){const e=t.content,r=l&&"string"==typeof e?e.substring(0,l):e;return{...t,children:r}}return t}return"children"===c?{children:null}:{}};exports.processCommonProp=t,exports.processIconProp=e=>t(e,{allowReactElements:!1,extractContent:!1,propertyName:"icon"}),exports.processTextProp=(e,r)=>t(e,{allowReactElements:!0,extractContent:!0,maxLength:r,propertyName:"children"});
|
|
@@ -0,0 +1,236 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Generate bundle size information for each component
|
|
5
|
+
* This script analyzes the dist folder and generates a JSON file with size information
|
|
6
|
+
*/
|
|
7
|
+
import fs from 'fs';
|
|
8
|
+
import path from 'path';
|
|
9
|
+
import { fileURLToPath } from 'url';
|
|
10
|
+
import { gzipSync } from 'zlib';
|
|
11
|
+
|
|
12
|
+
const __filename = fileURLToPath(import.meta.url);
|
|
13
|
+
const __dirname = path.dirname(__filename);
|
|
14
|
+
const rootDir = path.resolve(__dirname, '..');
|
|
15
|
+
|
|
16
|
+
// Paths
|
|
17
|
+
const distEsmDir = path.join(rootDir, 'dist/esm/components');
|
|
18
|
+
const outputFile = path.join(rootDir, '.storybook/bundle-sizes.json');
|
|
19
|
+
|
|
20
|
+
/**
|
|
21
|
+
* Get file size in bytes
|
|
22
|
+
*/
|
|
23
|
+
function getFileSize(filePath) {
|
|
24
|
+
try {
|
|
25
|
+
const stats = fs.statSync(filePath);
|
|
26
|
+
return stats.size;
|
|
27
|
+
} catch (error) {
|
|
28
|
+
return 0;
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
/**
|
|
33
|
+
* Get gzipped size of file
|
|
34
|
+
*/
|
|
35
|
+
function getGzipSize(filePath) {
|
|
36
|
+
try {
|
|
37
|
+
const content = fs.readFileSync(filePath);
|
|
38
|
+
const gzipped = gzipSync(content);
|
|
39
|
+
return gzipped.length;
|
|
40
|
+
} catch (error) {
|
|
41
|
+
return 0;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
/**
|
|
46
|
+
* Format bytes to human readable
|
|
47
|
+
*/
|
|
48
|
+
function formatBytes(bytes) {
|
|
49
|
+
if (bytes === 0) return '0 B';
|
|
50
|
+
const k = 1024;
|
|
51
|
+
const sizes = ['B', 'KB', 'MB'];
|
|
52
|
+
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
|
53
|
+
return `${parseFloat((bytes / Math.pow(k, i)).toFixed(2))} ${sizes[i]}`;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
/**
|
|
57
|
+
* Get component files
|
|
58
|
+
*/
|
|
59
|
+
function getComponentFiles(componentPath) {
|
|
60
|
+
const files = {
|
|
61
|
+
css: [],
|
|
62
|
+
js: [],
|
|
63
|
+
};
|
|
64
|
+
|
|
65
|
+
try {
|
|
66
|
+
const entries = fs.readdirSync(componentPath, { withFileTypes: true });
|
|
67
|
+
|
|
68
|
+
for (const entry of entries) {
|
|
69
|
+
const fullPath = path.join(componentPath, entry.name);
|
|
70
|
+
|
|
71
|
+
if (entry.isDirectory()) {
|
|
72
|
+
// Recursively search subdirectories
|
|
73
|
+
const subFiles = getComponentFiles(fullPath);
|
|
74
|
+
files.css.push(...subFiles.css);
|
|
75
|
+
files.js.push(...subFiles.js);
|
|
76
|
+
} else if (entry.isFile()) {
|
|
77
|
+
if (entry.name.endsWith('.css')) {
|
|
78
|
+
files.css.push(fullPath);
|
|
79
|
+
} else if (entry.name.endsWith('.js')) {
|
|
80
|
+
files.js.push(fullPath);
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
} catch (error) {
|
|
85
|
+
// Directory doesn't exist
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
return files;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
/**
|
|
92
|
+
* Calculate sizes for a component
|
|
93
|
+
*/
|
|
94
|
+
function calculateComponentSizes(componentName, componentPath) {
|
|
95
|
+
const files = getComponentFiles(componentPath);
|
|
96
|
+
|
|
97
|
+
let jsSize = 0;
|
|
98
|
+
let jsGzipSize = 0;
|
|
99
|
+
let cssSize = 0;
|
|
100
|
+
let cssGzipSize = 0;
|
|
101
|
+
|
|
102
|
+
// Sum JS files
|
|
103
|
+
for (const file of files.js) {
|
|
104
|
+
jsSize += getFileSize(file);
|
|
105
|
+
jsGzipSize += getGzipSize(file);
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
// Sum CSS files
|
|
109
|
+
for (const file of files.css) {
|
|
110
|
+
cssSize += getFileSize(file);
|
|
111
|
+
cssGzipSize += getGzipSize(file);
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
const totalSize = jsSize + cssSize;
|
|
115
|
+
const totalGzipSize = jsGzipSize + cssGzipSize;
|
|
116
|
+
|
|
117
|
+
return {
|
|
118
|
+
component: componentName,
|
|
119
|
+
sizes: {
|
|
120
|
+
js: {
|
|
121
|
+
raw: jsSize,
|
|
122
|
+
gzip: jsGzipSize,
|
|
123
|
+
formatted: formatBytes(jsSize),
|
|
124
|
+
gzipFormatted: formatBytes(jsGzipSize),
|
|
125
|
+
},
|
|
126
|
+
css: {
|
|
127
|
+
raw: cssSize,
|
|
128
|
+
gzip: cssGzipSize,
|
|
129
|
+
formatted: formatBytes(cssSize),
|
|
130
|
+
gzipFormatted: formatBytes(cssGzipSize),
|
|
131
|
+
},
|
|
132
|
+
total: {
|
|
133
|
+
raw: totalSize,
|
|
134
|
+
gzip: totalGzipSize,
|
|
135
|
+
formatted: formatBytes(totalSize),
|
|
136
|
+
gzipFormatted: formatBytes(totalGzipSize),
|
|
137
|
+
},
|
|
138
|
+
},
|
|
139
|
+
treeshakeable: true, // All ESM exports are treeshakeable
|
|
140
|
+
timestamp: new Date().toISOString(),
|
|
141
|
+
};
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
/**
|
|
145
|
+
* Main function
|
|
146
|
+
*/
|
|
147
|
+
function main() {
|
|
148
|
+
console.log('š¦ Generating bundle size information...\n');
|
|
149
|
+
|
|
150
|
+
if (!fs.existsSync(distEsmDir)) {
|
|
151
|
+
console.warn('ā ļø Warning: dist/esm/components directory not found.');
|
|
152
|
+
console.warn(
|
|
153
|
+
' Creating empty bundle-sizes.json. Run `yarn dist` to populate.\n',
|
|
154
|
+
);
|
|
155
|
+
|
|
156
|
+
// Create empty bundle sizes file
|
|
157
|
+
const emptyOutput = {
|
|
158
|
+
metadata: {
|
|
159
|
+
generated: new Date().toISOString(),
|
|
160
|
+
totalComponents: 0,
|
|
161
|
+
totalSize: {
|
|
162
|
+
raw: 0,
|
|
163
|
+
gzip: 0,
|
|
164
|
+
formatted: '0 B',
|
|
165
|
+
gzipFormatted: '0 B',
|
|
166
|
+
},
|
|
167
|
+
},
|
|
168
|
+
components: {},
|
|
169
|
+
};
|
|
170
|
+
|
|
171
|
+
const storybookDir = path.dirname(outputFile);
|
|
172
|
+
if (!fs.existsSync(storybookDir)) {
|
|
173
|
+
fs.mkdirSync(storybookDir, { recursive: true });
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
fs.writeFileSync(outputFile, JSON.stringify(emptyOutput, null, 2));
|
|
177
|
+
console.log('š Created empty bundle-sizes.json\n');
|
|
178
|
+
return;
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
const components = fs
|
|
182
|
+
.readdirSync(distEsmDir, { withFileTypes: true })
|
|
183
|
+
.filter((dirent) => dirent.isDirectory())
|
|
184
|
+
.map((dirent) => dirent.name);
|
|
185
|
+
|
|
186
|
+
const bundleSizes = {};
|
|
187
|
+
let totalComponents = 0;
|
|
188
|
+
let totalSize = 0;
|
|
189
|
+
let totalGzipSize = 0;
|
|
190
|
+
|
|
191
|
+
for (const component of components) {
|
|
192
|
+
const componentPath = path.join(distEsmDir, component);
|
|
193
|
+
const sizeInfo = calculateComponentSizes(component, componentPath);
|
|
194
|
+
|
|
195
|
+
bundleSizes[component] = sizeInfo;
|
|
196
|
+
totalComponents++;
|
|
197
|
+
totalSize += sizeInfo.sizes.total.raw;
|
|
198
|
+
totalGzipSize += sizeInfo.sizes.total.gzip;
|
|
199
|
+
|
|
200
|
+
console.log(
|
|
201
|
+
`ā ${component.padEnd(20)} ${sizeInfo.sizes.total.gzipFormatted} (gzip)`,
|
|
202
|
+
);
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
// Add metadata
|
|
206
|
+
const output = {
|
|
207
|
+
metadata: {
|
|
208
|
+
generated: new Date().toISOString(),
|
|
209
|
+
totalComponents,
|
|
210
|
+
totalSize: {
|
|
211
|
+
raw: totalSize,
|
|
212
|
+
gzip: totalGzipSize,
|
|
213
|
+
formatted: formatBytes(totalSize),
|
|
214
|
+
gzipFormatted: formatBytes(totalGzipSize),
|
|
215
|
+
},
|
|
216
|
+
},
|
|
217
|
+
components: bundleSizes,
|
|
218
|
+
};
|
|
219
|
+
|
|
220
|
+
// Write to file
|
|
221
|
+
const storybookDir = path.dirname(outputFile);
|
|
222
|
+
if (!fs.existsSync(storybookDir)) {
|
|
223
|
+
fs.mkdirSync(storybookDir, { recursive: true });
|
|
224
|
+
}
|
|
225
|
+
|
|
226
|
+
fs.writeFileSync(outputFile, JSON.stringify(output, null, 2));
|
|
227
|
+
|
|
228
|
+
console.log(`\n⨠Bundle sizes generated successfully!`);
|
|
229
|
+
console.log(`š Total components: ${totalComponents}`);
|
|
230
|
+
console.log(
|
|
231
|
+
`š¦ Total size: ${formatBytes(totalSize)} (raw) / ${formatBytes(totalGzipSize)} (gzip)`,
|
|
232
|
+
);
|
|
233
|
+
console.log(`š Output: ${path.relative(rootDir, outputFile)}\n`);
|
|
234
|
+
}
|
|
235
|
+
|
|
236
|
+
main();
|