npm - @wix/patterns - Versions diffs - 1.423.0 → 1.425.0 - Mend

@wix/patterns 1.423.0 → 1.425.0

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.

Files changed (1109) hide show

package/dist/cjs/components/SetupWidget/SetupStepIcon.js CHANGED Viewed

@@ -12,15 +12,21 @@ var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cj
  * green check when completed, muted dot when disabled, blue dot otherwise.
  */
 const SetupStepIcon = ({
-  status
+  status,
+  /**
+   * Top nudge that centers the 18px icon on a single line of text. Defaults to
+   * the desktop value; the mobile card centers the icon via its own wrapper and
+   * passes "0px" to drop the nudge.
+   */
+  marginTop = '3px'
 }) => {
   if (status === 'completed') {
     return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
-      marginTop: "3px",
+      marginTop: marginTop,
       __self: void 0,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 17,
+        lineNumber: 24,
         columnNumber: 7
       }
     }, /*#__PURE__*/_react.default.createElement(_wixUiIconsCommon.ConfirmSmall, {
@@ -30,18 +36,18 @@ const SetupStepIcon = ({
       __self: void 0,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 18,
+        lineNumber: 25,
         columnNumber: 9
       }
     }));
   }
   const color = status === 'disabled' ? 'var(--wsr-color-D40)' : 'var(--wsr-color-B10)';
   return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
-    marginTop: "3px",
+    marginTop: marginTop,
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 27,
+      lineNumber: 34,
       columnNumber: 5
     }
   }, /*#__PURE__*/_react.default.createElement(_wixUiIconsCommon.CircleSmallFilledSmall, {
@@ -51,7 +57,7 @@ const SetupStepIcon = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 28,
+      lineNumber: 35,
       columnNumber: 7
     }
   }));

package/dist/cjs/components/SetupWidget/SetupStepIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_react","_interopRequireDefault","require","_designSystem","_wixUiIconsCommon","_jsxFileName","SetupStepIcon","status","default","createElement","Box","~~marginTop","~~__self","__source","fileName","lineNumber","columnNumber","ConfirmSmall","width","height","color","CircleSmallFilledSmall","exports"],"sources":["../../../../src/components/SetupWidget/SetupStepIcon.tsx"],"sourcesContent":["import React from 'react';\nimport { Box } from '@wix/design-system';\nimport { ConfirmSmall, CircleSmallFilledSmall } from '@wix/wix-ui-icons-common';\nimport { SetupWidgetStepStatus } from '@wix/bex-core';\n\n/*\n Leading status indicator for a step. Mirrors the existing Setup widget:\n * green check when completed, muted dot when disabled, blue dot otherwise.\n */\nexport const SetupStepIcon = ({\n status,\n}: {\n status: SetupWidgetStepStatus;\n}) => {\n if (status === 'completed') {\n return (\n <Box marginTop~~=\"3px\"~~>\n <ConfirmSmall width=\"18px\" height=\"18px\" color=\"var(--wsr-color-G20)\" />\n </Box>\n );\n }\n\n const color =\n status === 'disabled' ? 'var(--wsr-color-D40)' : 'var(--wsr-color-B10)';\n\n return (\n <Box marginTop~~=\"3px\"~~>\n <CircleSmallFilledSmall width=\"18px\" height=\"18px\" color={color} />\n </Box>\n );\n};\n"],"mappings":";;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AAAgF,IAAAG,YAAA;AAGhF;AACA;AACA;AACA;AACO,MAAMC,aAAa,GAAGA,CAAC;EAC5BC;~~AAGF~~,CAAC,KAAK;EACJ,~~IAAIA~~,MAAM,KAAK,WAAW,EAAE;IAC1B,oBACEP,MAAA,~~CAAAQ~~,OAAA,CAAAC,aAAA,~~CAACN~~,aAAA,~~CAAAO~~,GAAG;~~MAACC~~,SAAS,~~EAAC~~,~~KAAK~~;~~MAAAC~~,MAAA;MAAAC,QAAA;QAAAC,QAAA,EAAAT,YAAA;QAAAU,UAAA;QAAAC,YAAA;MAAA;IAAA,~~gBAClBhB~~,MAAA,~~CAAAQ~~,OAAA,CAAAC,aAAA,~~CAACL~~,iBAAA,CAAAa,YAAY;MAACC,KAAK,EAAC,MAAM;MAACC,MAAM,EAAC,MAAM;MAACC,KAAK,EAAC,sBAAsB;MAAAR,MAAA;MAAAC,QAAA;QAAAC,QAAA,EAAAT,YAAA;QAAAU,UAAA;QAAAC,YAAA;MAAA;IAAA,CAAE,CACpE,CAAC;EAEV;EAEA,MAAMI,KAAK,GACTb,MAAM,KAAK,UAAU,GAAG,sBAAsB,GAAG,sBAAsB;EAEzE,oBACEP,MAAA,~~CAAAQ~~,OAAA,CAAAC,aAAA,~~CAACN~~,aAAA,~~CAAAO~~,GAAG;~~IAACC~~,SAAS,~~EAAC~~,~~KAAK~~;~~IAAAC~~,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAT,YAAA;MAAAU,UAAA;MAAAC,YAAA;IAAA;EAAA,~~gBAClBhB~~,MAAA,~~CAAAQ~~,OAAA,CAAAC,aAAA,~~CAACL~~,iBAAA,CAAAiB,sBAAsB;IAACH,KAAK,EAAC,MAAM;IAACC,MAAM,EAAC,MAAM;IAACC,KAAK,EAAEA,KAAM;IAAAR,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAT,YAAA;MAAAU,UAAA;MAAAC,YAAA;IAAA;EAAA,CAAE,CAC/D,CAAC;AAEV,CAAC;AAACM,OAAA,CAAAhB,aAAA,GAAAA,aAAA","ignoreList":[]}
1	+ {"version":3,"names":["_react","_interopRequireDefault","require","_designSystem","_wixUiIconsCommon","_jsxFileName","SetupStepIcon","status","marginTop","default","createElement","Box","__self","__source","fileName","lineNumber","columnNumber","ConfirmSmall","width","height","color","CircleSmallFilledSmall","exports"],"sources":["../../../../src/components/SetupWidget/SetupStepIcon.tsx"],"sourcesContent":["import React from 'react';\nimport { Box } from '@wix/design-system';\nimport { ConfirmSmall, CircleSmallFilledSmall } from '@wix/wix-ui-icons-common';\nimport { SetupWidgetStepStatus } from '@wix/bex-core';\n\n/*\n Leading status indicator for a step. Mirrors the existing Setup widget:\n * green check when completed, muted dot when disabled, blue dot otherwise.\n /\nexport const SetupStepIcon = ({\n status,\n /\n Top nudge that centers the 18px icon on a single line of text. Defaults to\n * the desktop value; the mobile card centers the icon via its own wrapper and\n * passes \"0px\" to drop the nudge.\n */\n marginTop = '3px',\n}: {\n status: SetupWidgetStepStatus;\n marginTop?: string;\n}) => {\n if (status === 'completed') {\n return (\n <Box marginTop={marginTop}>\n <ConfirmSmall width=\"18px\" height=\"18px\" color=\"var(--wsr-color-G20)\" />\n </Box>\n );\n }\n\n const color =\n status === 'disabled' ? 'var(--wsr-color-D40)' : 'var(--wsr-color-B10)';\n\n return (\n <Box marginTop={marginTop}>\n <CircleSmallFilledSmall width=\"18px\" height=\"18px\" color={color} />\n </Box>\n );\n};\n"],"mappings":";;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AAAgF,IAAAG,YAAA;AAGhF;AACA;AACA;AACA;AACO,MAAMC,aAAa,GAAGA,CAAC;EAC5BC,MAAM;EACN;AACF;AACA;AACA;AACA;EACEC,SAAS,GAAG;AAId,CAAC,KAAK;EACJ,IAAID,MAAM,KAAK,WAAW,EAAE;IAC1B,oBACEP,MAAA,CAAAS,OAAA,CAAAC,aAAA,CAACP,aAAA,CAAAQ,GAAG;MAACH,SAAS,EAAEA,SAAU;MAAAI,MAAA;MAAAC,QAAA;QAAAC,QAAA,EAAAT,YAAA;QAAAU,UAAA;QAAAC,YAAA;MAAA;IAAA,gBACxBhB,MAAA,CAAAS,OAAA,CAAAC,aAAA,CAACN,iBAAA,CAAAa,YAAY;MAACC,KAAK,EAAC,MAAM;MAACC,MAAM,EAAC,MAAM;MAACC,KAAK,EAAC,sBAAsB;MAAAR,MAAA;MAAAC,QAAA;QAAAC,QAAA,EAAAT,YAAA;QAAAU,UAAA;QAAAC,YAAA;MAAA;IAAA,CAAE,CACpE,CAAC;EAEV;EAEA,MAAMI,KAAK,GACTb,MAAM,KAAK,UAAU,GAAG,sBAAsB,GAAG,sBAAsB;EAEzE,oBACEP,MAAA,CAAAS,OAAA,CAAAC,aAAA,CAACP,aAAA,CAAAQ,GAAG;IAACH,SAAS,EAAEA,SAAU;IAAAI,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAT,YAAA;MAAAU,UAAA;MAAAC,YAAA;IAAA;EAAA,gBACxBhB,MAAA,CAAAS,OAAA,CAAAC,aAAA,CAACN,iBAAA,CAAAiB,sBAAsB;IAACH,KAAK,EAAC,MAAM;IAACC,MAAM,EAAC,MAAM;IAACC,KAAK,EAAEA,KAAM;IAAAR,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAT,YAAA;MAAAU,UAAA;MAAAC,YAAA;IAAA;EAAA,CAAE,CAC/D,CAAC;AAEV,CAAC;AAACM,OAAA,CAAAhB,aAAA,GAAAA,aAAA","ignoreList":[]}

package/dist/cjs/components/SetupWidget/SetupWidget.js CHANGED Viewed

@@ -169,6 +169,7 @@ const _SetupWidget = ({
   const list = /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
     direction: "vertical",
     gap: isMobile ? 'SP3' : 'SP1',
+    width: "100%",
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
@@ -221,6 +222,7 @@ const _SetupWidget = ({
       dataHook: dataHook,
       direction: "vertical",
       gap: "SP3",
+      width: "100%",
       __self: void 0,
       __source: {
         fileName: _jsxFileName,

package/dist/cjs/components/SetupWidget/SetupWidget.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_react","_interopRequireDefault","require","_mobxReactLite","_designSystem","_react2","_CardContainer","_useIsMobile","_useIntersectionObserver","_SetupWidgetHeader","_SetupStepRow","_SetupStepCard","_SetupStepGroup","_AllCompleteState","_SetupWidgetSkeleton","_jsxFileName","StepViewTracker","stepId","onView","children","elementRef","useIntersectionObserver","default","createElement","ref","__self","__source","fileName","lineNumber","columnNumber","_SetupWidget","state","renderStepContent","onStepClick","onCompletedStepClick","onStepView","onAllCompleteClick","renderError","dataHook","translate","t","useWixPatternsContainer","isMobile","useIsMobile","status","_loadTask","activateStep","step","expansionMode","_toggleStep","id","activateChild","child","renderLeaf","isChild","expanded","_expandedStepId","onActivate","isFocused","_focusedStepId","SetupStepCard","key","isPrimary","SetupStepRow","_isAllComplete","AllCompleteState","onCtaClick","SetupWidgetSkeleton","_state$_loadTask$erro","Fragment","retry","_retry","error","errorStatus","header","SetupWidgetHeader","title","_title","completedCount","_completedCount","totalCount","_totalCount","progressPercentage","_progressPercentage","list","Box","direction","gap","steps","map","_step$steps","node","length","SetupStepGroup","_primaryStepId","onToggle","renderChild","body","CardContainer","errorState","subtitle","action","text","onClick","padding","SetupWidget","exports","observer"],"sources":["../../../../src/components/SetupWidget/SetupWidget.tsx"],"sourcesContent":["import React from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { Box } from '@wix/design-system';\nimport { SetupWidgetState, SetupWidgetStep } from '@wix/bex-core';\nimport { useWixPatternsContainer } from '@wix/bex-core/react';\nimport { CardContainer } from '../CardContainer';\nimport { useIsMobile } from '../../hooks/useIsMobile';\nimport { useIntersectionObserver } from '../../hooks/useIntersectionObserver';\nimport { SetupWidgetHeader } from './SetupWidgetHeader';\nimport { SetupStepRow } from './SetupStepRow';\nimport { SetupStepCard } from './SetupStepCard';\nimport { SetupStepGroup } from './SetupStepGroup';\nimport { AllCompleteState } from './AllCompleteState';\nimport { SetupWidgetSkeleton } from './SetupWidgetSkeleton';\n\nexport interface SetupWidgetProps {\n /*\n A Setup widget state instance created with `useSetupWidget`. The widget\n * owns loading / error / refetch; the state exposes the steps and a public\n * API to change a step's status.\n /\n state: SetupWidgetState;\n /\n Inline-expansion content for a step, supplied at render time (the data does\n * not carry it). Returned for the currently-expanded inline step.\n /\n renderStepContent?: (step: SetupWidgetStep) => React.ReactNode;\n /* Fired when a `navigate` step (or its CTA) is activated. /\n onStepClick?: (step: SetupWidgetStep) => void;\n /\n Fired when a completed step's CTA (or row) is activated — a distinct\n * action from `onStepClick` (mirrors `onCompletedCtaClick` in dashboard-setup,\n * which targets the step's separate `completedCta`).\n /\n onCompletedStepClick?: (step: SetupWidgetStep) => void;\n /\n Fired once when a step (or group) scrolls into view — for the consumer to\n * report view telemetry (BI/dealer). The widget itself stays\n * telemetry-agnostic. Click telemetry hooks into `onStepClick` /\n * `onCompletedStepClick`.\n /\n onStepView?: (step: SetupWidgetStep) => void;\n /* Fired when the \"all complete\" celebratory CTA is clicked. /\n onAllCompleteClick?: () => void;\n /\n Replaces the default error UI when the initial load fails. Receives a\n * `retry` callback (re-runs the load) and the thrown `error`. When omitted, a\n * standard error card with a \"Try again\" retry is shown.\n /\n renderError?: (params: {\n retry: () => void;\n error: unknown;\n }) => React.ReactNode;\n /* Applies a data-hook attribute for tests. */\n dataHook?: string;\n}\n\n// Fires `onView` once when the wrapped step scrolls into view. Only mounted\n// when the consumer passes `onStepView`, so view tracking adds no DOM/observer\n// overhead otherwise.\nconst StepViewTracker = ({\n stepId,\n onView,\n children,\n}: {\n stepId: string;\n onView: () => void;\n children: React.ReactNode;\n}) => {\n const { elementRef } = useIntersectionObserver(onView);\n return (\n <div\n ref={elementRef as React.RefObject<HTMLDivElement>}\n data-hook={`setup-step-view-${stepId}`}\n >\n {children}\n </div>\n );\n};\n\nconst _SetupWidget = ({\n state,\n renderStepContent,\n onStepClick,\n onCompletedStepClick,\n onStepView,\n onAllCompleteClick,\n renderError,\n dataHook,\n}: SetupWidgetProps) => {\n const { translate: t } = useWixPatternsContainer();\n const isMobile = useIsMobile();\n const { status } = state._loadTask.status;\n\n const activateStep = (step: SetupWidgetStep) => {\n // Completed steps fire their own action (never expand) — distinct from the\n // active/navigate `onStepClick`.\n if (step.status === 'completed') {\n onCompletedStepClick?.(step);\n return;\n }\n if (step.expansionMode === 'inline') {\n state._toggleStep(step.id);\n } else {\n onStepClick?.(step);\n }\n };\n\n // Children of an aggregated group are leaf steps — they never toggle/expand;\n // completed children fire the completed action, the rest navigate.\n const activateChild = (child: SetupWidgetStep) => {\n if (child.status === 'completed') {\n onCompletedStepClick?.(child);\n } else {\n onStepClick?.(child);\n }\n };\n\n const renderLeaf = (step: SetupWidgetStep, isChild = false) => {\n const expanded =\n !isChild &&\n step.expansionMode === 'inline' &&\n state._expandedStepId === step.id;\n const onActivate = () =>\n isChild ? activateChild(step) : activateStep(step);\n\n // A single step is focused/highlighted at a time — the expanded step when\n // one is open, otherwise the primary. (Highlighting `primary \|\| expanded`\n // would mark two rows once the user opens a non-primary inline step.)\n const isFocused = !isChild && step.id === state._focusedStepId;\n\n return isMobile ? (\n <SetupStepCard\n key={step.id}\n step={step}\n isPrimary={isFocused}\n expanded={expanded}\n onActivate={onActivate}\n renderStepContent={renderStepContent}\n />\n ) : (\n <SetupStepRow\n key={step.id}\n step={step}\n isFocused={isFocused}\n expanded={expanded}\n onActivate={onActivate}\n renderStepContent={renderStepContent}\n />\n );\n };\n\n // All-complete is a distinct success surface with its own card.\n if (status === 'success' && state._isAllComplete) {\n return (\n <AllCompleteState dataHook={dataHook} onCtaClick={onAllCompleteClick} />\n );\n }\n\n // Built-in loading skeleton, shaped like the widget (desktop card / mobile\n // bare) so there's no layout jump when data resolves.\n if (status === 'idle' \|\| status === 'loading') {\n return <SetupWidgetSkeleton isMobile={isMobile} dataHook={dataHook} />;\n }\n\n // Consumer-supplied error UI fully replaces the default error card.\n if (status === 'error' && renderError) {\n return (\n <>\n {renderError({\n retry: () => state._retry(),\n error: state._loadTask.errorStatus?.error,\n })}\n </>\n );\n }\n\n const header = (\n <SetupWidgetHeader\n title={state._title}\n completedCount={state._completedCount}\n totalCount={state._totalCount}\n progressPercentage={state._progressPercentage}\n isMobile={isMobile}\n />\n );\n\n const list = (\n <Box direction=\"vertical\" gap={isMobile ? 'SP3' : 'SP1'}>\n {state.steps.map((step) => {\n const node = step.steps?.length ? (\n <SetupStepGroup\n step={step}\n isMobile={isMobile}\n expanded={state._expandedStepId === step.id}\n isPrimary={step.id === state._primaryStepId}\n onToggle={() => state._toggleStep(step.id)}\n renderChild={(child) => renderLeaf(child, true)}\n />\n ) : (\n renderLeaf(step)\n );\n\n return onStepView ? (\n <StepViewTracker\n key={step.id}\n stepId={step.id}\n onView={() => onStepView(step)}\n >\n {node}\n </StepViewTracker>\n ) : (\n <React.Fragment key={step.id}>{node}</React.Fragment>\n );\n })}\n </Box>\n );\n\n const body = (\n <>\n {header}\n {list}\n </>\n );\n\n // Mobile success renders bare — no outer card (matches the mobile design;\n // the consumer composes the surrounding page). Loading / error still flow\n // through CardContainer so the widget owns those states everywhere.\n if (isMobile && status === 'success') {\n return (\n <Box dataHook={dataHook} direction=\"vertical\" gap=\"SP3\">\n {body}\n </Box>\n );\n }\n\n return (\n <CardContainer\n dataHook={dataHook}\n status={status}\n errorState={{\n dataHook: 'error-state',\n title: t('cairo.setupWidget.error.title'),\n subtitle: t('cairo.setupWidget.error.subtitle'),\n action: {\n text: t('cairo.setupWidget.error.cta'),\n onClick: () => state._retry(),\n },\n }}\n >\n <Box direction=\"vertical\" padding=\"SP6\">\n {body}\n </Box>\n </CardContainer>\n );\n};\n\nexport const SetupWidget = observer(_SetupWidget);\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["_react","_interopRequireDefault","require","_mobxReactLite","_designSystem","_react2","_CardContainer","_useIsMobile","_useIntersectionObserver","_SetupWidgetHeader","_SetupStepRow","_SetupStepCard","_SetupStepGroup","_AllCompleteState","_SetupWidgetSkeleton","_jsxFileName","StepViewTracker","stepId","onView","children","elementRef","useIntersectionObserver","default","createElement","ref","__self","__source","fileName","lineNumber","columnNumber","_SetupWidget","state","renderStepContent","onStepClick","onCompletedStepClick","onStepView","onAllCompleteClick","renderError","dataHook","translate","t","useWixPatternsContainer","isMobile","useIsMobile","status","_loadTask","activateStep","step","expansionMode","_toggleStep","id","activateChild","child","renderLeaf","isChild","expanded","_expandedStepId","onActivate","isFocused","_focusedStepId","SetupStepCard","key","isPrimary","SetupStepRow","_isAllComplete","AllCompleteState","onCtaClick","SetupWidgetSkeleton","_state$_loadTask$erro","Fragment","retry","_retry","error","errorStatus","header","SetupWidgetHeader","title","_title","completedCount","_completedCount","totalCount","_totalCount","progressPercentage","_progressPercentage","list","Box","direction","gap","width","steps","map","_step$steps","node","length","SetupStepGroup","_primaryStepId","onToggle","renderChild","body","CardContainer","errorState","subtitle","action","text","onClick","padding","SetupWidget","exports","observer"],"sources":["../../../../src/components/SetupWidget/SetupWidget.tsx"],"sourcesContent":["import React from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { Box } from '@wix/design-system';\nimport { SetupWidgetState, SetupWidgetStep } from '@wix/bex-core';\nimport { useWixPatternsContainer } from '@wix/bex-core/react';\nimport { CardContainer } from '../CardContainer';\nimport { useIsMobile } from '../../hooks/useIsMobile';\nimport { useIntersectionObserver } from '../../hooks/useIntersectionObserver';\nimport { SetupWidgetHeader } from './SetupWidgetHeader';\nimport { SetupStepRow } from './SetupStepRow';\nimport { SetupStepCard } from './SetupStepCard';\nimport { SetupStepGroup } from './SetupStepGroup';\nimport { AllCompleteState } from './AllCompleteState';\nimport { SetupWidgetSkeleton } from './SetupWidgetSkeleton';\n\nexport interface SetupWidgetProps {\n /*\n A Setup widget state instance created with `useSetupWidget`. The widget\n * owns loading / error / refetch; the state exposes the steps and a public\n * API to change a step's status.\n /\n state: SetupWidgetState;\n /\n Inline-expansion content for a step, supplied at render time (the data does\n * not carry it). Returned for the currently-expanded inline step.\n /\n renderStepContent?: (step: SetupWidgetStep) => React.ReactNode;\n /* Fired when a `navigate` step (or its CTA) is activated. /\n onStepClick?: (step: SetupWidgetStep) => void;\n /\n Fired when a completed step's CTA (or row) is activated — a distinct\n * action from `onStepClick` (mirrors `onCompletedCtaClick` in dashboard-setup,\n * which targets the step's separate `completedCta`).\n /\n onCompletedStepClick?: (step: SetupWidgetStep) => void;\n /\n Fired once when a step (or group) scrolls into view — for the consumer to\n * report view telemetry (BI/dealer). The widget itself stays\n * telemetry-agnostic. Click telemetry hooks into `onStepClick` /\n * `onCompletedStepClick`.\n /\n onStepView?: (step: SetupWidgetStep) => void;\n /* Fired when the \"all complete\" celebratory CTA is clicked. /\n onAllCompleteClick?: () => void;\n /\n Replaces the default error UI when the initial load fails. Receives a\n * `retry` callback (re-runs the load) and the thrown `error`. When omitted, a\n * standard error card with a \"Try again\" retry is shown.\n /\n renderError?: (params: {\n retry: () => void;\n error: unknown;\n }) => React.ReactNode;\n /* Applies a data-hook attribute for tests. */\n dataHook?: string;\n}\n\n// Fires `onView` once when the wrapped step scrolls into view. Only mounted\n// when the consumer passes `onStepView`, so view tracking adds no DOM/observer\n// overhead otherwise.\nconst StepViewTracker = ({\n stepId,\n onView,\n children,\n}: {\n stepId: string;\n onView: () => void;\n children: React.ReactNode;\n}) => {\n const { elementRef } = useIntersectionObserver(onView);\n return (\n <div\n ref={elementRef as React.RefObject<HTMLDivElement>}\n data-hook={`setup-step-view-${stepId}`}\n >\n {children}\n </div>\n );\n};\n\nconst _SetupWidget = ({\n state,\n renderStepContent,\n onStepClick,\n onCompletedStepClick,\n onStepView,\n onAllCompleteClick,\n renderError,\n dataHook,\n}: SetupWidgetProps) => {\n const { translate: t } = useWixPatternsContainer();\n const isMobile = useIsMobile();\n const { status } = state._loadTask.status;\n\n const activateStep = (step: SetupWidgetStep) => {\n // Completed steps fire their own action (never expand) — distinct from the\n // active/navigate `onStepClick`.\n if (step.status === 'completed') {\n onCompletedStepClick?.(step);\n return;\n }\n if (step.expansionMode === 'inline') {\n state._toggleStep(step.id);\n } else {\n onStepClick?.(step);\n }\n };\n\n // Children of an aggregated group are leaf steps — they never toggle/expand;\n // completed children fire the completed action, the rest navigate.\n const activateChild = (child: SetupWidgetStep) => {\n if (child.status === 'completed') {\n onCompletedStepClick?.(child);\n } else {\n onStepClick?.(child);\n }\n };\n\n const renderLeaf = (step: SetupWidgetStep, isChild = false) => {\n const expanded =\n !isChild &&\n step.expansionMode === 'inline' &&\n state._expandedStepId === step.id;\n const onActivate = () =>\n isChild ? activateChild(step) : activateStep(step);\n\n // A single step is focused/highlighted at a time — the expanded step when\n // one is open, otherwise the primary. (Highlighting `primary \|\| expanded`\n // would mark two rows once the user opens a non-primary inline step.)\n const isFocused = !isChild && step.id === state._focusedStepId;\n\n return isMobile ? (\n <SetupStepCard\n key={step.id}\n step={step}\n isPrimary={isFocused}\n expanded={expanded}\n onActivate={onActivate}\n renderStepContent={renderStepContent}\n />\n ) : (\n <SetupStepRow\n key={step.id}\n step={step}\n isFocused={isFocused}\n expanded={expanded}\n onActivate={onActivate}\n renderStepContent={renderStepContent}\n />\n );\n };\n\n // All-complete is a distinct success surface with its own card.\n if (status === 'success' && state._isAllComplete) {\n return (\n <AllCompleteState dataHook={dataHook} onCtaClick={onAllCompleteClick} />\n );\n }\n\n // Built-in loading skeleton, shaped like the widget (desktop card / mobile\n // bare) so there's no layout jump when data resolves.\n if (status === 'idle' \|\| status === 'loading') {\n return <SetupWidgetSkeleton isMobile={isMobile} dataHook={dataHook} />;\n }\n\n // Consumer-supplied error UI fully replaces the default error card.\n if (status === 'error' && renderError) {\n return (\n <>\n {renderError({\n retry: () => state._retry(),\n error: state._loadTask.errorStatus?.error,\n })}\n </>\n );\n }\n\n const header = (\n <SetupWidgetHeader\n title={state._title}\n completedCount={state._completedCount}\n totalCount={state._totalCount}\n progressPercentage={state._progressPercentage}\n isMobile={isMobile}\n />\n );\n\n const list = (\n <Box direction=\"vertical\" gap={isMobile ? 'SP3' : 'SP1'} width=\"100%\">\n {state.steps.map((step) => {\n const node = step.steps?.length ? (\n <SetupStepGroup\n step={step}\n isMobile={isMobile}\n expanded={state._expandedStepId === step.id}\n isPrimary={step.id === state._primaryStepId}\n onToggle={() => state._toggleStep(step.id)}\n renderChild={(child) => renderLeaf(child, true)}\n />\n ) : (\n renderLeaf(step)\n );\n\n return onStepView ? (\n <StepViewTracker\n key={step.id}\n stepId={step.id}\n onView={() => onStepView(step)}\n >\n {node}\n </StepViewTracker>\n ) : (\n <React.Fragment key={step.id}>{node}</React.Fragment>\n );\n })}\n </Box>\n );\n\n const body = (\n <>\n {header}\n {list}\n </>\n );\n\n // Mobile success renders bare — no outer card (matches the mobile design;\n // the consumer composes the surrounding page). Loading / error still flow\n // through CardContainer so the widget owns those states everywhere.\n if (isMobile && status === 'success') {\n return (\n <Box dataHook={dataHook} direction=\"vertical\" gap=\"SP3\" width=\"100%\">\n {body}\n </Box>\n );\n }\n\n return (\n <CardContainer\n dataHook={dataHook}\n status={status}\n errorState={{\n dataHook: 'error-state',\n title: t('cairo.setupWidget.error.title'),\n subtitle: t('cairo.setupWidget.error.subtitle'),\n action: {\n text: t('cairo.setupWidget.error.cta'),\n onClick: () => state._retry(),\n },\n }}\n >\n <Box direction=\"vertical\" padding=\"SP6\">\n {body}\n </Box>\n </CardContainer>\n );\n};\n\nexport const SetupWidget = observer(_SetupWidget);\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/SetupWidget/SetupWidget.st.css CHANGED Viewed

@@ -8,6 +8,12 @@
 @property st-global(--wsr-color-B30);
 @property st-global(--wsr-color-B40);
 @property st-global(--wsr-color-B60);
+@property st-global(--wds-color-text-standard-primary);
+@property st-global(--wds-color-text-disabled);
+@property st-global(--wds-color-text-urgent);
+@property st-global(--wsr-color-D10);
+@property st-global(--wsr-color-D10-30);
+@property st-global(--wsr-color-O10);
 @property st-global(--wds-space-100);
 @property st-global(--wds-border-radius-200);
 @property st-global(--wds-border-radius-400);
@@ -93,3 +99,40 @@
 .card:clickable {
   cursor: pointer;
 }
+/* 24px icon cell (matches the Figma spec): a single-line step row is then
+ * 24px + 2×12px padding = 48px tall. The 18px glyph is centered within it, so
+ * the icon lines up with the title (single line) or its first line (wrapped). */
+.stepIcon {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  height: 24px;
+}
+/* Trailing chevron that replaces the per-step CTA button on mobile. WDS has no
+ * dedicated icon-color token; icons take the text-standard color (the Figma
+ * variable is grouped as "Text & icon"). */
+.chevron {
+  display: flex;
+  flex-shrink: 0;
+  color: var(--wds-color-text-standard-primary, var(--wsr-color-D10, #000624));
+}
+.chevronDisabled {
+  display: flex;
+  flex-shrink: 0;
+  color: var(--wds-color-text-disabled, var(--wsr-color-D10-30, rgba(0, 6, 36, 0.30)));
+}
+/* "IN PROGRESS" label, rendered with a WDS <Text> (so it uses the design
+ * system's typography) but in the urgent orange. <Text> has no "urgent" skin,
+ * so we override the standard-text color token it reads — this beats the
+ * component's own color rule without !important — and uppercase the label to
+ * match the Figma spec. Using <Text> (not a Badge) keeps it flush with the
+ * title, with no badge padding/offset. */
+.inProgressLabel {
+  --wds-color-text-standard-primary: var(--wds-color-text-urgent, var(--wsr-color-O10, #FE620F));
+  text-transform: uppercase;
+}

package/dist/cjs/components/SetupWidget/SetupWidget.st.css.js CHANGED Viewed

@@ -5,17 +5,21 @@ exports.vars = exports.style = exports.stVars = exports.st = exports.namespace =
 var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
 // @ts-nocheck
-var _namespace_ = "SetupWidget4051015157";
+var _namespace_ = "SetupWidget2333671370";
 var _style_ = _stylableEsmRuntime.classesRuntime.bind(null, _namespace_);
 var cssStates = exports.cssStates = _stylableEsmRuntime.statesRuntime.bind(null, _namespace_);
 var style = exports.style = _style_;
 var st = exports.st = _style_;
 var namespace = exports.namespace = _namespace_;
 var classes = exports.classes = {
-  "root": "SetupWidget4051015157__root",
-  "row": "SetupWidget4051015157__row",
-  "completedCta": "SetupWidget4051015157__completedCta",
-  "card": "SetupWidget4051015157__card"
+  "root": "SetupWidget2333671370__root",
+  "row": "SetupWidget2333671370__row",
+  "completedCta": "SetupWidget2333671370__completedCta",
+  "card": "SetupWidget2333671370__card",
+  "stepIcon": "SetupWidget2333671370__stepIcon",
+  "chevron": "SetupWidget2333671370__chevron",
+  "chevronDisabled": "SetupWidget2333671370__chevronDisabled",
+  "inProgressLabel": "SetupWidget2333671370__inProgressLabel"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};
@@ -32,6 +36,12 @@ var vars = exports.vars = {
   "wsr-color-B30": "--wsr-color-B30",
   "wsr-color-B40": "--wsr-color-B40",
   "wsr-color-B60": "--wsr-color-B60",
+  "wds-color-text-standard-primary": "--wds-color-text-standard-primary",
+  "wds-color-text-disabled": "--wds-color-text-disabled",
+  "wds-color-text-urgent": "--wds-color-text-urgent",
+  "wsr-color-D10": "--wsr-color-D10",
+  "wsr-color-D10-30": "--wsr-color-D10-30",
+  "wsr-color-O10": "--wsr-color-O10",
   "wds-space-100": "--wds-space-100",
   "wds-border-radius-200": "--wds-border-radius-200",
   "wds-border-radius-400": "--wds-border-radius-400"

package/dist/cjs/components/SetupWidget/SetupWidget.st.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/SetupWidget/SetupWidget.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"~~SetupWidget4051015157~~\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"~~SetupWidget4051015157__root~~\",\"row\":\"~~SetupWidget4051015157__row~~\",\"completedCta\":\"~~SetupWidget4051015157__completedCta~~\",\"card\":\"~~SetupWidget4051015157__card~~\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {\"wds-color-border-dark-secondary\":\"--wds-color-border-dark-secondary\",\"wds-color-border-standard-primary\":\"--wds-color-border-standard-primary\",\"wds-color-border-standard-secondary\":\"--wds-color-border-standard-secondary\",\"wds-color-fill-standard-tertiary\":\"--wds-color-fill-standard-tertiary\",\"wds-color-fill-standard-tertiary-hover\":\"--wds-color-fill-standard-tertiary-hover\",\"wsr-color-D60\":\"--wsr-color-D60\",\"wsr-color-D80\":\"--wsr-color-D80\",\"wsr-color-B30\":\"--wsr-color-B30\",\"wsr-color-B40\":\"--wsr-color-B40\",\"wsr-color-B60\":\"--wsr-color-B60\",\"wds-space-100\":\"--wds-space-100\",\"wds-border-radius-200\":\"--wds-border-radius-200\",\"wds-border-radius-400\":\"--wds-border-radius-400\"}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,uBAAuB;AACzC,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAAK,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AACnB,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC,6BAA6B;EAAC,KAAK,EAAC,4BAA4B;EAAC,cAAc,EAAC,qCAAqC;EAAC,MAAM,EAAC;~~AAA6B~~,CAAC;~~AACjL~~,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG;EAAC,iCAAiC,EAAC,mCAAmC;EAAC,mCAAmC,EAAC,qCAAqC;EAAC,qCAAqC,EAAC,uCAAuC;EAAC,kCAAkC,EAAC,oCAAoC;EAAC,wCAAwC,EAAC,0CAA0C;EAAC,eAAe,EAAC,iBAAiB;EAAC,eAAe,EAAC,iBAAiB;EAAC,eAAe,EAAC,iBAAiB;EAAC,eAAe,EAAC,iBAAiB;EAAC,eAAe,EAAC,iBAAiB;EAAC,eAAe,EAAC,iBAAiB;EAAC,uBAAuB,EAAC,yBAAyB;EAAC,uBAAuB,EAAC;AAAyB,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/SetupWidget/SetupWidget.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"SetupWidget2333671370\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"SetupWidget2333671370__root\",\"row\":\"SetupWidget2333671370__row\",\"completedCta\":\"SetupWidget2333671370__completedCta\",\"card\":\"SetupWidget2333671370__card\",\"stepIcon\":\"SetupWidget2333671370__stepIcon\",\"chevron\":\"SetupWidget2333671370__chevron\",\"chevronDisabled\":\"SetupWidget2333671370__chevronDisabled\",\"inProgressLabel\":\"SetupWidget2333671370__inProgressLabel\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {\"wds-color-border-dark-secondary\":\"--wds-color-border-dark-secondary\",\"wds-color-border-standard-primary\":\"--wds-color-border-standard-primary\",\"wds-color-border-standard-secondary\":\"--wds-color-border-standard-secondary\",\"wds-color-fill-standard-tertiary\":\"--wds-color-fill-standard-tertiary\",\"wds-color-fill-standard-tertiary-hover\":\"--wds-color-fill-standard-tertiary-hover\",\"wsr-color-D60\":\"--wsr-color-D60\",\"wsr-color-D80\":\"--wsr-color-D80\",\"wsr-color-B30\":\"--wsr-color-B30\",\"wsr-color-B40\":\"--wsr-color-B40\",\"wsr-color-B60\":\"--wsr-color-B60\",\"wds-color-text-standard-primary\":\"--wds-color-text-standard-primary\",\"wds-color-text-disabled\":\"--wds-color-text-disabled\",\"wds-color-text-urgent\":\"--wds-color-text-urgent\",\"wsr-color-D10\":\"--wsr-color-D10\",\"wsr-color-D10-30\":\"--wsr-color-D10-30\",\"wsr-color-O10\":\"--wsr-color-O10\",\"wds-space-100\":\"--wds-space-100\",\"wds-border-radius-200\":\"--wds-border-radius-200\",\"wds-border-radius-400\":\"--wds-border-radius-400\"}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,uBAAuB;AACzC,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAAK,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AACnB,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC,6BAA6B;EAAC,KAAK,EAAC,4BAA4B;EAAC,cAAc,EAAC,qCAAqC;EAAC,MAAM,EAAC,6BAA6B;EAAC,UAAU,EAAC,iCAAiC;EAAC,SAAS,EAAC,gCAAgC;EAAC,iBAAiB,EAAC,wCAAwC;EAAC,iBAAiB,EAAC;AAAwC,CAAC;AAC/X,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG;EAAC,iCAAiC,EAAC,mCAAmC;EAAC,mCAAmC,EAAC,qCAAqC;EAAC,qCAAqC,EAAC,uCAAuC;EAAC,kCAAkC,EAAC,oCAAoC;EAAC,wCAAwC,EAAC,0CAA0C;EAAC,eAAe,EAAC,iBAAiB;EAAC,eAAe,EAAC,iBAAiB;EAAC,eAAe,EAAC,iBAAiB;EAAC,eAAe,EAAC,iBAAiB;EAAC,eAAe,EAAC,iBAAiB;EAAC,iCAAiC,EAAC,mCAAmC;EAAC,yBAAyB,EAAC,2BAA2B;EAAC,uBAAuB,EAAC,yBAAyB;EAAC,eAAe,EAAC,iBAAiB;EAAC,kBAAkB,EAAC,oBAAoB;EAAC,eAAe,EAAC,iBAAiB;EAAC,eAAe,EAAC,iBAAiB;EAAC,uBAAuB,EAAC,yBAAyB;EAAC,uBAAuB,EAAC;AAAyB,CAAC","ignoreList":[]}

package/dist/cjs/components/SetupWidget/SetupWidgetHeader.js CHANGED Viewed

@@ -28,13 +28,18 @@ const SetupWidgetHeader = ({
     total: totalCount
   });
   if (isMobile) {
+    // Mobile (per Figma): the "X/Y" ratio sits inline to the left of the bar
+    // (no "completed" word) to save vertical space. The ratio is just numbers,
+    // so it needs no translation.
+    const ratio = `${completedCount}/${totalCount}`;
     return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
       direction: "vertical",
-      gap: "SP2",
+      gap: "SP3",
+      width: "100%",
       __self: void 0,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 35,
+        lineNumber: 39,
         columnNumber: 7
       }
     }, /*#__PURE__*/_react.default.createElement(_designSystem.Heading, {
@@ -43,26 +48,36 @@ const SetupWidgetHeader = ({
       __self: void 0,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 36,
+        lineNumber: 40,
         columnNumber: 9
       }
-    }, resolvedTitle), /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
+    }, resolvedTitle), /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+      width: "100%",
+      verticalAlign: "middle",
+      gap: "SP2",
+      __self: void 0,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 43,
+        columnNumber: 9
+      }
+    }, /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
       dataHook: "setup-widget-progress",
       size: "small",
       secondary: true,
       __self: void 0,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 39,
-        columnNumber: 9
+        lineNumber: 44,
+        columnNumber: 11
       }
-    }, ratioLabel), /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
-      width: "100%",
+    }, ratio), /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+      flexGrow: 1,
       __self: void 0,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 42,
-        columnNumber: 9
+        lineNumber: 47,
+        columnNumber: 11
       }
     }, /*#__PURE__*/_react.default.createElement(_designSystem.LinearProgressBar, {
       skin: "standard",
@@ -70,10 +85,10 @@ const SetupWidgetHeader = ({
       __self: void 0,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 43,
-        columnNumber: 11
+        lineNumber: 48,
+        columnNumber: 13
       }
-    })));
+    }))));
   }
   return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
     align: "space-between",
@@ -82,7 +97,7 @@ const SetupWidgetHeader = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 50,
+      lineNumber: 56,
       columnNumber: 5
     }
   }, /*#__PURE__*/_react.default.createElement(_designSystem.Heading, {
@@ -91,7 +106,7 @@ const SetupWidgetHeader = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 51,
+      lineNumber: 57,
       columnNumber: 7
     }
   }, resolvedTitle), /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
@@ -100,7 +115,7 @@ const SetupWidgetHeader = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 54,
+      lineNumber: 60,
       columnNumber: 7
     }
   }, /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
@@ -110,7 +125,7 @@ const SetupWidgetHeader = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 55,
+      lineNumber: 61,
       columnNumber: 9
     }
   }, ratioLabel), /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
@@ -119,7 +134,7 @@ const SetupWidgetHeader = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 58,
+      lineNumber: 64,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement(_designSystem.LinearProgressBar, {
@@ -128,7 +143,7 @@ const SetupWidgetHeader = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 59,
+      lineNumber: 65,
       columnNumber: 11
     }
   }))));

package/dist/cjs/components/SetupWidget/SetupWidgetHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_react","_interopRequireDefault","require","_designSystem","_react2","_jsxFileName","SetupWidgetHeader","title","completedCount","totalCount","progressPercentage","isMobile","translate","t","useWixPatternsContainer","resolvedTitle","ratioLabel","completed","total","default","createElement","Box","direction","gap","__self","__source","fileName","lineNumber","columnNumber","Heading","dataHook","size","Text","secondary","~~width~~","LinearProgressBar","skin","value","align","~~verticalAlign","~~marginBottom","weight","marginLeft","exports"],"sources":["../../../../src/components/SetupWidget/SetupWidgetHeader.tsx"],"sourcesContent":["import React from 'react';\nimport { Box, Heading, Text, LinearProgressBar } from '@wix/design-system';\nimport { useWixPatternsContainer } from '@wix/bex-core/react';\n\nexport interface SetupWidgetHeaderProps {\n /** Defaults to the translated \"Setup\" when omitted. /\n title?: string \| null;\n completedCount: number;\n totalCount: number;\n progressPercentage: number;\n isMobile: boolean;\n}\n\n/\n Widget header: title + \"X/Y completed\" ratio + progress bar.\n * - Desktop: title left, ratio + bar inline on the right.\n * - Mobile: large heading stacked above the ratio and a full-width bar.\n */\nexport const SetupWidgetHeader = ({\n title,\n completedCount,\n totalCount,\n progressPercentage,\n isMobile,\n}: SetupWidgetHeaderProps) => {\n const { translate: t } = useWixPatternsContainer();\n const resolvedTitle = title ?? t('cairo.setupWidget.title');\n const ratioLabel = t('cairo.setupWidget.progress.label', {\n completed: completedCount,\n total: totalCount,\n });\n\n if (isMobile) {\n return (\n <Box direction=\"vertical\" gap=\"~~SP2~~\">\n <Heading dataHook=\"setup-widget-title\" size=\"large\">\n {resolvedTitle}\n </Heading>\n <Text dataHook=\"setup-widget-progress\" size=\"small\" secondary>\n {~~ratioLabel~~}\n </Text>\n <Box ~~width=\"100%\"~~>\n <LinearProgressBar skin=\"standard\" value={progressPercentage} />\n </Box>\n </Box>\n );\n }\n\n return (\n <Box align=\"space-between\" verticalAlign=\"middle\" marginBottom=\"SP4\">\n <Heading dataHook=\"setup-widget-title\" size=\"medium\">\n {resolvedTitle}\n </Heading>\n <Box gap=\"SP1\" verticalAlign=\"middle\">\n <Text dataHook=\"setup-widget-progress\" size=\"tiny\" weight=\"thin\">\n {ratioLabel}\n </Text>\n <Box width={220} marginLeft=\"-8px\">\n <LinearProgressBar skin=\"standard\" value={progressPercentage} />\n </Box>\n </Box>\n </Box>\n );\n};\n"],"mappings":";;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AAA8D,IAAAG,YAAA;AAW9D;AACA;AACA;AACA;AACA;AACO,MAAMC,iBAAiB,GAAGA,CAAC;EAChCC,KAAK;EACLC,cAAc;EACdC,UAAU;EACVC,kBAAkB;EAClBC;AACsB,CAAC,KAAK;EAC5B,MAAM;IAAEC,SAAS,EAAEC;EAAE,CAAC,GAAG,IAAAC,+BAAuB,EAAC,CAAC;EAClD,MAAMC,aAAa,GAAGR,KAAK,IAAIM,CAAC,CAAC,yBAAyB,CAAC;EAC3D,MAAMG,UAAU,GAAGH,CAAC,CAAC,kCAAkC,EAAE;IACvDI,SAAS,EAAET,cAAc;IACzBU,KAAK,EAAET;EACT,CAAC,CAAC;EAEF,IAAIE,QAAQ,EAAE;IACZ,~~oBACEX~~,MAAA,~~CAAAmB~~,OAAA,CAAAC,aAAA,~~CAACjB~~,aAAA,~~CAAAkB~~,GAAG;MAACC,SAAS,EAAC,UAAU;MAACC,GAAG,EAAC,KAAK;MAAAC,MAAA;MAAAC,QAAA;QAAAC,QAAA,~~EAAArB~~,YAAA;~~QAAAsB~~,UAAA;QAAAC,YAAA;MAAA;IAAA,~~gBACjC5B~~,MAAA,~~CAAAmB~~,OAAA,CAAAC,aAAA,~~CAACjB~~,aAAA,~~CAAA0B~~,OAAO;MAACC,QAAQ,EAAC,oBAAoB;MAACC,IAAI,EAAC,OAAO;MAAAP,MAAA;MAAAC,QAAA;QAAAC,QAAA,~~EAAArB~~,YAAA;~~QAAAsB~~,UAAA;QAAAC,YAAA;MAAA;IAAA,~~GAChDb~~,aACM,CAAC,eACVf,MAAA,CAAAmB,OAAA,CAAAC,aAAA,~~CAACjB~~,aAAA,~~CAAA6B~~,IAAI;~~MAACF~~,QAAQ,EAAC,uBAAuB;MAACC,IAAI,EAAC,OAAO;~~MAACE~~,SAAS;~~MAAAT~~,MAAA;MAAAC,QAAA;QAAAC,QAAA,~~EAAArB~~,YAAA;~~QAAAsB~~,UAAA;QAAAC,YAAA;MAAA;IAAA,~~GAC1DZ~~,~~UACG~~,CAAC,~~eACPhB~~,MAAA,~~CAAAmB~~,OAAA,CAAAC,aAAA,~~CAACjB~~,aAAA,~~CAAAkB~~,GAAG;~~MAACa~~,~~KAAK~~,~~EAAC~~,~~MAAM~~;~~MAAAV~~,MAAA;MAAAC,QAAA;QAAAC,QAAA,~~EAAArB~~,YAAA;~~QAAAsB~~,UAAA;QAAAC,YAAA;MAAA;IAAA,~~gBACf5B~~,MAAA,~~CAAAmB~~,OAAA,CAAAC,aAAA,~~CAACjB~~,aAAA,~~CAAAgC~~,iBAAiB;MAACC,IAAI,EAAC,UAAU;MAACC,KAAK,~~EAAE3B~~,kBAAmB;~~MAAAc~~,MAAA;MAAAC,QAAA;QAAAC,QAAA,~~EAAArB~~,YAAA;~~QAAAsB~~,UAAA;QAAAC,YAAA;MAAA;IAAA,CAAE,CAC5D,CACF,CAAC;EAEV;EAEA,~~oBACE5B~~,MAAA,~~CAAAmB~~,OAAA,CAAAC,aAAA,~~CAACjB~~,aAAA,~~CAAAkB~~,GAAG;~~IAACiB~~,KAAK,EAAC,eAAe;~~IAACC~~,aAAa,EAAC,QAAQ;~~IAACC~~,YAAY,EAAC,KAAK;IAAAhB,MAAA;IAAAC,QAAA;MAAAC,QAAA,~~EAAArB~~,YAAA;~~MAAAsB~~,UAAA;MAAAC,YAAA;IAAA;EAAA,~~gBAClE5B~~,MAAA,~~CAAAmB~~,OAAA,CAAAC,aAAA,~~CAACjB~~,aAAA,~~CAAA0B~~,OAAO;IAACC,QAAQ,EAAC,oBAAoB;IAACC,IAAI,EAAC,QAAQ;IAAAP,MAAA;IAAAC,QAAA;MAAAC,QAAA,~~EAAArB~~,YAAA;~~MAAAsB~~,UAAA;MAAAC,YAAA;IAAA;EAAA,~~GACjDb~~,aACM,CAAC,eACVf,MAAA,~~CAAAmB~~,OAAA,CAAAC,aAAA,~~CAACjB~~,aAAA,~~CAAAkB~~,GAAG;IAACE,GAAG,EAAC,KAAK;~~IAACgB~~,aAAa,EAAC,QAAQ;~~IAAAf~~,MAAA;IAAAC,QAAA;MAAAC,QAAA,~~EAAArB~~,YAAA;~~MAAAsB~~,UAAA;MAAAC,YAAA;IAAA;EAAA,~~gBACnC5B~~,MAAA,~~CAAAmB~~,OAAA,CAAAC,aAAA,~~CAACjB~~,aAAA,~~CAAA6B~~,IAAI;~~IAACF~~,QAAQ,EAAC,uBAAuB;IAACC,IAAI,EAAC,MAAM;IAACU,MAAM,EAAC,MAAM;IAAAjB,MAAA;IAAAC,QAAA;MAAAC,QAAA,~~EAAArB~~,YAAA;~~MAAAsB~~,UAAA;MAAAC,YAAA;IAAA;EAAA,~~GAC7DZ~~,UACG,CAAC,eACPhB,MAAA,~~CAAAmB~~,OAAA,CAAAC,aAAA,~~CAACjB~~,aAAA,~~CAAAkB~~,GAAG;~~IAACa~~,KAAK,EAAE,GAAI;~~IAACQ~~,UAAU,EAAC,MAAM;IAAAlB,MAAA;IAAAC,QAAA;MAAAC,QAAA,~~EAAArB~~,YAAA;~~MAAAsB~~,UAAA;MAAAC,YAAA;IAAA;EAAA,~~gBAChC5B~~,MAAA,~~CAAAmB~~,OAAA,CAAAC,aAAA,~~CAACjB~~,aAAA,~~CAAAgC~~,iBAAiB;IAACC,IAAI,EAAC,UAAU;IAACC,KAAK,~~EAAE3B~~,kBAAmB;~~IAAAc~~,MAAA;IAAAC,QAAA;MAAAC,QAAA,~~EAAArB~~,YAAA;~~MAAAsB~~,UAAA;MAAAC,YAAA;IAAA;EAAA,CAAE,CAC5D,CACF,CACF,CAAC;AAEV,CAAC;AAACe,OAAA,~~CAAArC~~,iBAAA,GAAAA,iBAAA","ignoreList":[]}
1	+ {"version":3,"names":["_react","_interopRequireDefault","require","_designSystem","_react2","_jsxFileName","SetupWidgetHeader","title","completedCount","totalCount","progressPercentage","isMobile","translate","t","useWixPatternsContainer","resolvedTitle","ratioLabel","completed","total","ratio","default","createElement","Box","direction","gap","width","__self","__source","fileName","lineNumber","columnNumber","Heading","dataHook","size","verticalAlign","Text","secondary","flexGrow","LinearProgressBar","skin","value","align","marginBottom","weight","marginLeft","exports"],"sources":["../../../../src/components/SetupWidget/SetupWidgetHeader.tsx"],"sourcesContent":["import React from 'react';\nimport { Box, Heading, Text, LinearProgressBar } from '@wix/design-system';\nimport { useWixPatternsContainer } from '@wix/bex-core/react';\n\nexport interface SetupWidgetHeaderProps {\n /** Defaults to the translated \"Setup\" when omitted. /\n title?: string \| null;\n completedCount: number;\n totalCount: number;\n progressPercentage: number;\n isMobile: boolean;\n}\n\n/\n Widget header: title + \"X/Y completed\" ratio + progress bar.\n * - Desktop: title left, ratio + bar inline on the right.\n * - Mobile: large heading stacked above the ratio and a full-width bar.\n */\nexport const SetupWidgetHeader = ({\n title,\n completedCount,\n totalCount,\n progressPercentage,\n isMobile,\n}: SetupWidgetHeaderProps) => {\n const { translate: t } = useWixPatternsContainer();\n const resolvedTitle = title ?? t('cairo.setupWidget.title');\n const ratioLabel = t('cairo.setupWidget.progress.label', {\n completed: completedCount,\n total: totalCount,\n });\n\n if (isMobile) {\n // Mobile (per Figma): the \"X/Y\" ratio sits inline to the left of the bar\n // (no \"completed\" word) to save vertical space. The ratio is just numbers,\n // so it needs no translation.\n const ratio = `${completedCount}/${totalCount}`;\n return (\n <Box direction=\"vertical\" gap=\"SP3\" width=\"100%\">\n <Heading dataHook=\"setup-widget-title\" size=\"large\">\n {resolvedTitle}\n </Heading>\n <Box width=\"100%\" verticalAlign=\"middle\" gap=\"SP2\">\n <Text dataHook=\"setup-widget-progress\" size=\"small\" secondary>\n {ratio}\n </Text>\n <Box flexGrow={1}>\n <LinearProgressBar skin=\"standard\" value={progressPercentage} />\n </Box>\n </Box>\n </Box>\n );\n }\n\n return (\n <Box align=\"space-between\" verticalAlign=\"middle\" marginBottom=\"SP4\">\n <Heading dataHook=\"setup-widget-title\" size=\"medium\">\n {resolvedTitle}\n </Heading>\n <Box gap=\"SP1\" verticalAlign=\"middle\">\n <Text dataHook=\"setup-widget-progress\" size=\"tiny\" weight=\"thin\">\n {ratioLabel}\n </Text>\n <Box width={220} marginLeft=\"-8px\">\n <LinearProgressBar skin=\"standard\" value={progressPercentage} />\n </Box>\n </Box>\n </Box>\n );\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/SkeletonCard/SkeletonCard.st.css.js CHANGED Viewed

@@ -5,15 +5,15 @@ exports.vars = exports.style = exports.stVars = exports.st = exports.namespace =
 var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
 // @ts-nocheck
-var _namespace_ = "SkeletonCard4040440223";
+var _namespace_ = "SkeletonCard1380766072";
 var _style_ = _stylableEsmRuntime.classesRuntime.bind(null, _namespace_);
 var cssStates = exports.cssStates = _stylableEsmRuntime.statesRuntime.bind(null, _namespace_);
 var style = exports.style = _style_;
 var st = exports.st = _style_;
 var namespace = exports.namespace = _namespace_;
 var classes = exports.classes = {
-  "root": "SkeletonCard4040440223__root",
-  "headerLoading": "SkeletonCard4040440223__headerLoading"
+  "root": "SkeletonCard1380766072__root",
+  "headerLoading": "SkeletonCard1380766072__headerLoading"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/SkeletonCard/SkeletonCard.st.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/SkeletonCard/SkeletonCard.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"~~SkeletonCard4040440223~~\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"~~SkeletonCard4040440223__root~~\",\"headerLoading\":\"~~SkeletonCard4040440223__headerLoading~~\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,wBAAwB;AAC1C,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAAK,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AACnB,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC,8BAA8B;EAAC,eAAe,EAAC;AAAuC,CAAC;AAC7G,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/SkeletonCard/SkeletonCard.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"SkeletonCard1380766072\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"SkeletonCard1380766072__root\",\"headerLoading\":\"SkeletonCard1380766072__headerLoading\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,wBAAwB;AAC1C,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAAK,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AACnB,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC,8BAA8B;EAAC,eAAe,EAAC;AAAuC,CAAC;AAC7G,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}

package/dist/cjs/components/SlidingModal/SlidingModal.st.css.js CHANGED Viewed

@@ -5,14 +5,14 @@ exports.vars = exports.style = exports.stVars = exports.st = exports.namespace =
 var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
 // @ts-nocheck
-var _namespace_ = "SlidingModal2850071977";
+var _namespace_ = "SlidingModal2315682368";
 var _style_ = _stylableEsmRuntime.classesRuntime.bind(null, _namespace_);
 var cssStates = exports.cssStates = _stylableEsmRuntime.statesRuntime.bind(null, _namespace_);
 var style = exports.style = _style_;
 var st = exports.st = _style_;
 var namespace = exports.namespace = _namespace_;
 var classes = exports.classes = {
-  "root": "SlidingModal2850071977__root"
+  "root": "SlidingModal2315682368__root"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/SlidingModal/SlidingModal.st.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/SlidingModal/SlidingModal.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"~~SlidingModal2850071977~~\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"~~SlidingModal2850071977__root~~\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,wBAAwB;AAC1C,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAAK,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AACnB,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC;AAA8B,CAAC;AACrD,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/SlidingModal/SlidingModal.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"SlidingModal2315682368\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"SlidingModal2315682368__root\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,wBAAwB;AAC1C,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAAK,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AACnB,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC;AAA8B,CAAC;AACrD,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}

package/dist/cjs/components/Table/TableCompat.js CHANGED Viewed

@@ -6,7 +6,7 @@ exports.TableCompat = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
 var _mobxReactLite = require("mobx-react-lite");
-var _ = require("../..");
+var _TableV = require("./TableV2");
 var _state = require("../../state");
 var _react2 = require("@wix/bex-core/react");
 var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/Table/TableCompat.tsx";
@@ -17,7 +17,7 @@ function _TableCompat(props) {
     collection: props.state,
     container
   }));
-  return /*#__PURE__*/_react.default.createElement(_.TableV2, (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/_react.default.createElement(_TableV.TableV2, (0, _extends2.default)({}, props, {
     state: state,
     __self: this,
     __source: {

package/dist/cjs/components/Table/TableCompat.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_react","_interopRequireWildcard","require","_mobxReactLite","_","_state","_react2","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_TableCompat","props","container","useWixPatternsContainer","state","useState","TableState","collection","createElement","TableV2","_extends2","__self","__source","fileName","lineNumber","columnNumber","TableCompat","exports","observer"],"sources":["../../../../src/components/Table/TableCompat.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { CollectionState, FiltersMap } from '@wix/bex-core';\nimport { TableV2 } from '~~../..~~';\nimport { TableState } from '../../state';\nimport { useWixPatternsContainer } from '@wix/bex-core/react';\nimport { CollectionTableBaseProps } from '../CollectionTable';\nimport type { TableSectionsProp } from '../TableSections';\n\nexport interface TableCompatProps<T, F extends FiltersMap>\n extends CollectionTableBaseProps<T, F> {\n /*\n A collection state instance created with [useCollection](./?path=/story/common-hooks--usecollection)\n * @external\n */\n state: CollectionState<T, F> \| TableState<T, F>;\n sections?: TableSectionsProp<T>;\n}\n\nfunction _TableCompat<T, F extends FiltersMap = FiltersMap>(\n props: TableCompatProps<T, F>,\n) {\n const container = useWixPatternsContainer();\n\n const [state] = useState(() =>\n props.state instanceof TableState\n ? props.state\n : new TableState<T, F>({\n collection: props.state,\n container,\n }),\n );\n\n return <TableV2 {...props} state={state} />;\n}\n\nexport const TableCompat = observer(_TableCompat);\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,cAAA,GAAAD,OAAA;AAEA,IAAAE,~~CAAA~~,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAA8D,IAAAK,YAAA;AAAA,SAAAN,wBAAAO,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAT,uBAAA,YAAAA,CAAAO,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAc9D,SAASkB,YAAYA,CACnBC,KAA6B,EAC7B;EACA,MAAMC,SAAS,GAAG,IAAAC,+BAAuB,EAAC,CAAC;EAE3C,MAAM,CAACC,KAAK,CAAC,GAAG,IAAAC,eAAQ,EAAC,MACvBJ,KAAK,CAACG,KAAK,YAAYE,iBAAU,GAC7BL,KAAK,CAACG,KAAK,GACX,IAAIE,iBAAU,CAAO;IACnBC,UAAU,EAAEN,KAAK,CAACG,KAAK;IACvBF;EACF,CAAC,CACP,CAAC;EAED,oBAAO7B,MAAA,CAAAkB,OAAA,CAAAiB,aAAA,CAAC/B,~~CAAA~~,CAAAgC,OAAO,MAAAC,SAAA,CAAAnB,OAAA,MAAKU,KAAK;IAAEG,KAAK,EAAEA,KAAM;IAAAO,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAjC,YAAA;MAAAkC,UAAA;MAAAC,YAAA;IAAA;EAAA,EAAE,CAAC;AAC7C;AAEO,MAAMC,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAG,IAAAE,uBAAQ,EAAClB,YAAY,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["_react","_interopRequireWildcard","require","_mobxReactLite","_TableV","_state","_react2","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_TableCompat","props","container","useWixPatternsContainer","state","useState","TableState","collection","createElement","TableV2","_extends2","__self","__source","fileName","lineNumber","columnNumber","TableCompat","exports","observer"],"sources":["../../../../src/components/Table/TableCompat.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { CollectionState, FiltersMap } from '@wix/bex-core';\nimport { TableV2 } from './TableV2';\nimport { TableState } from '../../state';\nimport { useWixPatternsContainer } from '@wix/bex-core/react';\nimport { CollectionTableBaseProps } from '../CollectionTable';\nimport type { TableSectionsProp } from '../TableSections';\n\nexport interface TableCompatProps<T, F extends FiltersMap>\n extends CollectionTableBaseProps<T, F> {\n /*\n A collection state instance created with [useCollection](./?path=/story/common-hooks--usecollection)\n * @external\n */\n state: CollectionState<T, F> \| TableState<T, F>;\n sections?: TableSectionsProp<T>;\n}\n\nfunction _TableCompat<T, F extends FiltersMap = FiltersMap>(\n props: TableCompatProps<T, F>,\n) {\n const container = useWixPatternsContainer();\n\n const [state] = useState(() =>\n props.state instanceof TableState\n ? props.state\n : new TableState<T, F>({\n collection: props.state,\n container,\n }),\n );\n\n return <TableV2 {...props} state={state} />;\n}\n\nexport const TableCompat = observer(_TableCompat);\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,cAAA,GAAAD,OAAA;AAEA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAA8D,IAAAK,YAAA;AAAA,SAAAN,wBAAAO,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAT,uBAAA,YAAAA,CAAAO,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAc9D,SAASkB,YAAYA,CACnBC,KAA6B,EAC7B;EACA,MAAMC,SAAS,GAAG,IAAAC,+BAAuB,EAAC,CAAC;EAE3C,MAAM,CAACC,KAAK,CAAC,GAAG,IAAAC,eAAQ,EAAC,MACvBJ,KAAK,CAACG,KAAK,YAAYE,iBAAU,GAC7BL,KAAK,CAACG,KAAK,GACX,IAAIE,iBAAU,CAAO;IACnBC,UAAU,EAAEN,KAAK,CAACG,KAAK;IACvBF;EACF,CAAC,CACP,CAAC;EAED,oBAAO7B,MAAA,CAAAkB,OAAA,CAAAiB,aAAA,CAAC/B,OAAA,CAAAgC,OAAO,MAAAC,SAAA,CAAAnB,OAAA,MAAKU,KAAK;IAAEG,KAAK,EAAEA,KAAM;IAAAO,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAjC,YAAA;MAAAkC,UAAA;MAAAC,YAAA;IAAA;EAAA,EAAE,CAAC;AAC7C;AAEO,MAAMC,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAG,IAAAE,uBAAQ,EAAClB,YAAY,CAAC","ignoreList":[]}

package/dist/cjs/components/TableGridSwitch/TableGridSwitch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_react","_interopRequireDefault","require","_mobxReactLite","_LayoutSwitch","_jsxFileName","_TableGridSwitch","props","state","dragAndDrop","sections","restProps","tableSections","TableSections","groupBy","renderSection","collapsible","events","undefined","gridSections","GridSections","default","createElement","LayoutSwitch","tableProps","tableState","table","sticky","gridProps","gridState","grid","__self","__source","fileName","lineNumber","columnNumber","TableGridSwitch","exports","observer"],"sources":["../../../../src/components/TableGridSwitch/TableGridSwitch.tsx"],"sourcesContent":["import React from 'react';\nimport { FiltersMap } from '@wix/bex-core';\nimport { observer } from 'mobx-react-lite';\nimport type { TableGridSwitchState } from '../../state/TableGridSwitchState';\nimport { GridPresetProps } from '../Grid/Grid.types';\nimport type { TableGridSwitchDragAndDrop } from './TableGridSwitchDragAndDrop';\nimport { GridSectionsContent } from '../GridSections/GridSectionsContent';\nimport type {\n GroupBy,\n RenderSection,\n SectionEvents,\n} from '../CollectionSectionHeader';\nimport { TableSections } from '../TableSections';\nimport { GridBasePropsWithoutPreset } from '../Grid/Grid';\nimport { TableProps } from '..';\nimport { LayoutSwitch } from '../LayoutSwitch';\n\nexport interface TableGridSwitchBaseProps<T, F extends FiltersMap>\n extends Omit<\n GridBasePropsWithoutPreset<T, F>,\n 'state' \| 'dragAndDrop' \| 'tableGridSwitchButton' \| 'sticky' \| 'sections'\n >,\n Omit<\n TableProps<T, F>,\n 'state' \| 'dragAndDrop' \| 'tableGridSwitchButton' \| 'sticky' \| 'sections'\n > {\n /*\n A `TableGridSwitchState` instance created using [useTableGridSwitch](./?path=/story/base-components-collections-tablegridswitch-usetablegridswitchcollection--usetablegridswitchcollection).\n /\n state: TableGridSwitchState<T, F>;\n /\n Adds functionality to allow visitors to reorder items manually.\n * For more information, see the [Drag and Drop Overview](./?path=/story/features-sort-drag-and-drop--overview).\n * @overrideType [TableGridSwitchDragAndDrop](./?path=/story/features-sort-drag-and-drop--tablegridswitchdraganddrop)\n * @external\n /\n dragAndDrop?: typeof TableGridSwitchDragAndDrop;\n /\n Configuration for rendering sections. When provided, the component will render with section headers\n * that group related rows together for both Grid and Table views.\n * @external\n */\n sections?: {\n GridSections: typeof GridSectionsContent;\n TableSections: typeof TableSections;\n groupBy: GroupBy<T>;\n renderSection: RenderSection<T>;\n collapsible?: boolean;\n events?: SectionEvents;\n };\n}\n\nexport type TableGridSwitchProps<T, F extends FiltersMap> = GridPresetProps<\n T,\n TableGridSwitchBaseProps<T, F>\n>;\n\nexport function _TableGridSwitch<T, F extends FiltersMap = FiltersMap>(\n props: TableGridSwitchProps<T, F>,\n) {\n const { state, dragAndDrop, sections, ...restProps } = props;\n\n const tableSections = sections\n ? {\n TableSections: sections.TableSections,\n groupBy: sections.groupBy,\n renderSection: sections.renderSection,\n collapsible: sections.collapsible,\n events: sections.events,\n }\n : undefined;\n\n const gridSections = sections\n ? {\n GridSections: sections.GridSections,\n groupBy: sections.groupBy,\n renderSection: sections.renderSection,\n }\n : undefined;\n\n return (\n <LayoutSwitch\n state={state}\n tableProps={{\n ...restProps,\n state: state.tableState,\n dragAndDrop: dragAndDrop?.table,\n sections: tableSections,\n sticky: true,\n }}\n gridProps={{\n ...restProps,\n state: state.gridState,\n dragAndDrop: dragAndDrop?.grid,\n sections: gridSections,\n }}\n />\n );\n}\n\nexport const TableGridSwitch = observer(_TableGridSwitch);\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,cAAA,GAAAD,OAAA;AAaA,IAAAE,aAAA,GAAAF,OAAA;AAA+C,IAAAG,YAAA;AA0CxC,SAASC,gBAAgBA,CAC9BC,KAAiC,EACjC;EACA,MAAM;IAAEC,KAAK;IAAEC,WAAW;IAAEC,QAAQ;IAAE,GAAGC;EAAU,CAAC,GAAGJ,KAAK;EAE5D,MAAMK,aAAa,GAAGF,QAAQ,GAC1B;IACEG,aAAa,EAAEH,QAAQ,CAACG,aAAa;IACrCC,OAAO,EAAEJ,QAAQ,CAACI,OAAO;IACzBC,aAAa,EAAEL,QAAQ,CAACK,aAAa;IACrCC,WAAW,EAAEN,QAAQ,CAACM,WAAW;IACjCC,MAAM,EAAEP,QAAQ,CAACO;EACnB,CAAC,GACDC,SAAS;EAEb,MAAMC,YAAY,GAAGT,QAAQ,GACzB;IACEU,YAAY,EAAEV,QAAQ,CAACU,YAAY;IACnCN,OAAO,EAAEJ,QAAQ,CAACI,OAAO;IACzBC,aAAa,EAAEL,QAAQ,CAACK;EAC1B,CAAC,GACDG,SAAS;EAEb,oBACElB,MAAA,CAAAqB,OAAA,CAAAC,aAAA,CAAClB,aAAA,CAAAmB,YAAY;IACXf,KAAK,EAAEA,KAAM;IACbgB,UAAU,EAAE;MACV,GAAGb,SAAS;MACZH,KAAK,EAAEA,KAAK,CAACiB,UAAU;MACvBhB,WAAW,EAAEA,WAAW,oBAAXA,WAAW,CAAEiB,KAAK;MAC/BhB,QAAQ,EAAEE,aAAa;MACvBe,MAAM,EAAE;IACV,CAAE;IACFC,SAAS,EAAE;MACT,GAAGjB,SAAS;MACZH,KAAK,EAAEA,KAAK,CAACqB,SAAS;MACtBpB,WAAW,EAAEA,WAAW,oBAAXA,WAAW,CAAEqB,IAAI;MAC9BpB,QAAQ,EAAES;IACZ,CAAE;IAAAY,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA5B,YAAA;MAAA6B,UAAA;MAAAC,YAAA;IAAA;EAAA,CACH,CAAC;AAEN;AAEO,MAAMC,eAAe,GAAAC,OAAA,CAAAD,eAAA,GAAG,IAAAE,uBAAQ,EAAChC,gBAAgB,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["_react","_interopRequireDefault","require","_mobxReactLite","_LayoutSwitch","_jsxFileName","_TableGridSwitch","props","state","dragAndDrop","sections","restProps","tableSections","TableSections","groupBy","renderSection","collapsible","events","undefined","gridSections","GridSections","default","createElement","LayoutSwitch","tableProps","tableState","table","sticky","gridProps","gridState","grid","__self","__source","fileName","lineNumber","columnNumber","TableGridSwitch","exports","observer"],"sources":["../../../../src/components/TableGridSwitch/TableGridSwitch.tsx"],"sourcesContent":["import React from 'react';\nimport { FiltersMap } from '@wix/bex-core';\nimport { observer } from 'mobx-react-lite';\nimport type { TableGridSwitchState } from '../../state/TableGridSwitchState';\nimport { GridPresetProps } from '../Grid/Grid.types';\nimport type { TableGridSwitchDragAndDrop } from './TableGridSwitchDragAndDrop';\nimport { GridSectionsContent } from '../GridSections/GridSectionsContent';\nimport type {\n GroupBy,\n RenderSection,\n SectionEvents,\n} from '../CollectionSectionHeader';\nimport { TableSections } from '../TableSections';\nimport { GridBasePropsWithoutPreset } from '../Grid/Grid';\nimport type { TableProps } from '..';\nimport { LayoutSwitch } from '../LayoutSwitch';\n\nexport interface TableGridSwitchBaseProps<T, F extends FiltersMap>\n extends Omit<\n GridBasePropsWithoutPreset<T, F>,\n 'state' \| 'dragAndDrop' \| 'tableGridSwitchButton' \| 'sticky' \| 'sections'\n >,\n Omit<\n TableProps<T, F>,\n 'state' \| 'dragAndDrop' \| 'tableGridSwitchButton' \| 'sticky' \| 'sections'\n > {\n /*\n A `TableGridSwitchState` instance created using [useTableGridSwitch](./?path=/story/base-components-collections-tablegridswitch-usetablegridswitchcollection--usetablegridswitchcollection).\n /\n state: TableGridSwitchState<T, F>;\n /\n Adds functionality to allow visitors to reorder items manually.\n * For more information, see the [Drag and Drop Overview](./?path=/story/features-sort-drag-and-drop--overview).\n * @overrideType [TableGridSwitchDragAndDrop](./?path=/story/features-sort-drag-and-drop--tablegridswitchdraganddrop)\n * @external\n /\n dragAndDrop?: typeof TableGridSwitchDragAndDrop;\n /\n Configuration for rendering sections. When provided, the component will render with section headers\n * that group related rows together for both Grid and Table views.\n * @external\n */\n sections?: {\n GridSections: typeof GridSectionsContent;\n TableSections: typeof TableSections;\n groupBy: GroupBy<T>;\n renderSection: RenderSection<T>;\n collapsible?: boolean;\n events?: SectionEvents;\n };\n}\n\nexport type TableGridSwitchProps<T, F extends FiltersMap> = GridPresetProps<\n T,\n TableGridSwitchBaseProps<T, F>\n>;\n\nexport function _TableGridSwitch<T, F extends FiltersMap = FiltersMap>(\n props: TableGridSwitchProps<T, F>,\n) {\n const { state, dragAndDrop, sections, ...restProps } = props;\n\n const tableSections = sections\n ? {\n TableSections: sections.TableSections,\n groupBy: sections.groupBy,\n renderSection: sections.renderSection,\n collapsible: sections.collapsible,\n events: sections.events,\n }\n : undefined;\n\n const gridSections = sections\n ? {\n GridSections: sections.GridSections,\n groupBy: sections.groupBy,\n renderSection: sections.renderSection,\n }\n : undefined;\n\n return (\n <LayoutSwitch\n state={state}\n tableProps={{\n ...restProps,\n state: state.tableState,\n dragAndDrop: dragAndDrop?.table,\n sections: tableSections,\n sticky: true,\n }}\n gridProps={{\n ...restProps,\n state: state.gridState,\n dragAndDrop: dragAndDrop?.grid,\n sections: gridSections,\n }}\n />\n );\n}\n\nexport const TableGridSwitch = observer(_TableGridSwitch);\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,cAAA,GAAAD,OAAA;AAaA,IAAAE,aAAA,GAAAF,OAAA;AAA+C,IAAAG,YAAA;AA0CxC,SAASC,gBAAgBA,CAC9BC,KAAiC,EACjC;EACA,MAAM;IAAEC,KAAK;IAAEC,WAAW;IAAEC,QAAQ;IAAE,GAAGC;EAAU,CAAC,GAAGJ,KAAK;EAE5D,MAAMK,aAAa,GAAGF,QAAQ,GAC1B;IACEG,aAAa,EAAEH,QAAQ,CAACG,aAAa;IACrCC,OAAO,EAAEJ,QAAQ,CAACI,OAAO;IACzBC,aAAa,EAAEL,QAAQ,CAACK,aAAa;IACrCC,WAAW,EAAEN,QAAQ,CAACM,WAAW;IACjCC,MAAM,EAAEP,QAAQ,CAACO;EACnB,CAAC,GACDC,SAAS;EAEb,MAAMC,YAAY,GAAGT,QAAQ,GACzB;IACEU,YAAY,EAAEV,QAAQ,CAACU,YAAY;IACnCN,OAAO,EAAEJ,QAAQ,CAACI,OAAO;IACzBC,aAAa,EAAEL,QAAQ,CAACK;EAC1B,CAAC,GACDG,SAAS;EAEb,oBACElB,MAAA,CAAAqB,OAAA,CAAAC,aAAA,CAAClB,aAAA,CAAAmB,YAAY;IACXf,KAAK,EAAEA,KAAM;IACbgB,UAAU,EAAE;MACV,GAAGb,SAAS;MACZH,KAAK,EAAEA,KAAK,CAACiB,UAAU;MACvBhB,WAAW,EAAEA,WAAW,oBAAXA,WAAW,CAAEiB,KAAK;MAC/BhB,QAAQ,EAAEE,aAAa;MACvBe,MAAM,EAAE;IACV,CAAE;IACFC,SAAS,EAAE;MACT,GAAGjB,SAAS;MACZH,KAAK,EAAEA,KAAK,CAACqB,SAAS;MACtBpB,WAAW,EAAEA,WAAW,oBAAXA,WAAW,CAAEqB,IAAI;MAC9BpB,QAAQ,EAAES;IACZ,CAAE;IAAAY,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA5B,YAAA;MAAA6B,UAAA;MAAAC,YAAA;IAAA;EAAA,CACH,CAAC;AAEN;AAEO,MAAMC,eAAe,GAAAC,OAAA,CAAAD,eAAA,GAAG,IAAAE,uBAAQ,EAAChC,gBAAgB,CAAC","ignoreList":[]}

package/dist/cjs/components/TabsFilter/TabsFilter.st.css.js CHANGED Viewed

@@ -5,15 +5,15 @@ exports.vars = exports.style = exports.stVars = exports.st = exports.namespace =
 var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
 // @ts-nocheck
-var _namespace_ = "TabsFilter3869411207";
+var _namespace_ = "TabsFilter311251995";
 var _style_ = _stylableEsmRuntime.classesRuntime.bind(null, _namespace_);
 var cssStates = exports.cssStates = _stylableEsmRuntime.statesRuntime.bind(null, _namespace_);
 var style = exports.style = _style_;
 var st = exports.st = _style_;
 var namespace = exports.namespace = _namespace_;
 var classes = exports.classes = {
-  "root": "TabsFilter3869411207__root",
-  "title": "TabsFilter3869411207__title"
+  "root": "TabsFilter311251995__root",
+  "title": "TabsFilter311251995__title"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};