@wix/patterns 1.217.0 → 1.220.0

package/dist/cjs/state/KanbanState/KanbanState.js

@@ -4,14 +4,104 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports.KanbanState = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _bexCore = require("@wix/bex-core");
+var _ToolbarCollectionState = require("../ToolbarCollectionState");
+var _KanbanStageState = require("./KanbanStageState");
+var _mobx = require("mobx");
 class KanbanState {
-  // @ts-expect-error
-  // eslint-disable-next-line @typescript-eslint/no-useless-constructor
   constructor(params) {
     (0, _defineProperty2.default)(this, "container", void 0);
     (0, _defineProperty2.default)(this, "kanbanStageStates", {});
     // @ts-expect-error
     (0, _defineProperty2.default)(this, "toolbar", void 0);
+    (0, _defineProperty2.default)(this, "stagesCollectionState", void 0);
+    (0, _defineProperty2.default)(this, "items", void 0);
+    this.container = params.container;
+    this.items = params.items;
+    this.stagesCollectionState = new _bexCore.CollectionState({
+      errorMonitor: this.container.errorMonitor,
+      history: this.container.history,
+      lodash: this.container.lodash,
+      onlineState: this.container.onlineState,
+      queryCache: this.container.queryCache,
+      translate: this.container.translate,
+      queryName: 'kanban-stages',
+      fetchData: params.stages.fetchData,
+      itemKey: params.stages.stageKey,
+      itemName: params.stages.stageName,
+      filters: {},
+      errorHandler: this.container.errorMonitor,
+      paginationMode: 'cursor'
+    });
+    this.toolbar = new _ToolbarCollectionState.ToolbarCollectionState({
+      collection: this.stagesCollectionState,
+      container: params.container,
+      componentType: 'Kanban',
+      reportBi: this.container.reportBi
+    });
+    (0, _mobx.makeObservable)(this, {
+      kanbanStageStates: _mobx.observable
+    });
+  }
+  async init() {
+    var _this$stagesCollectio;
+    this.stagesCollectionState.init();
+    await ((_this$stagesCollectio = this.stagesCollectionState) == null || (_this$stagesCollectio = _this$stagesCollectio.initTask) == null || (_this$stagesCollectio = _this$stagesCollectio.status) == null || (_this$stagesCollectio = _this$stagesCollectio.promise) == null ? void 0 : _this$stagesCollectio.catch(() => {}));
+    await this.initialAllStages();
+    this.waitLoadStagesState();
+    this.toolbar.init({
+      featuresInitializers: []
+    });
+  }
+  async initialAllStages() {
+    if (!this.items.fetchAllByStageIds) {
+      return;
+    }
+    const data = await this.items.fetchAllByStageIds({
+      ids: this.stagesCollectionState.result.keyedItems.map(item => this.stagesCollectionState.itemKey(item.item)),
+      filter: {}
+    });
+    this.stagesCollectionState.result.keyedItems.forEach(stage => {
+      (0, _mobx.runInAction)(() => {
+        var _data$stageId, _data$stageId2, _data$stageId3;
+        const stageId = this.stagesCollectionState.itemKey(stage.item);
+        const hasDataForStage = !!data[stageId];
+        this.kanbanStageStates[stageId] = new _KanbanStageState.KanbanStageState({
+          container: this.container,
+          fetchData: this.items.fetchData,
+          itemKey: this.items.itemKey,
+          itemName: this.items.itemName,
+          initialPage: hasDataForStage ? {
+            items: (_data$stageId = data[stageId]) == null ? void 0 : _data$stageId.items,
+            total: (_data$stageId2 = data[stageId]) == null ? void 0 : _data$stageId2.total,
+            cursor: (_data$stageId3 = data[stageId]) == null ? void 0 : _data$stageId3.cursor
+          } : undefined,
+          name: this.stagesCollectionState.itemName(stage.item),
+          key: this.stagesCollectionState.itemKey(stage.item),
+          stage: stage.item
+        });
+      });
+    });
+  }
+  waitLoadStagesState() {
+    Object.entries(this.kanbanStageStates).forEach(([, stageState]) => {
+      stageState.init();
+    });
+  }
+  stages() {
+    return this.stagesCollectionState.result.keyedItems.map(item => item.item);
+  }
+  getStageState(stage) {
+    return this.kanbanStageStates[this.stagesCollectionState.itemKey(stage)];
+  }
+  isLoading() {
+    return this.stagesCollectionState.initTask.status.isLoading || Object.keys(this.kanbanStageStates).length !== this.stagesCollectionState.result.keyedItems.length || Object.values(this.kanbanStageStates).some(stage => stage.isLoading());
+  }
+  stageName(stage) {
+    return this.stagesCollectionState.itemName(stage);
+  }
+  stageKey(stage) {
+    return this.stagesCollectionState.itemKey(stage);
   }
 }
 exports.KanbanState = KanbanState;

package/dist/cjs/state/KanbanState/KanbanState.js.map

@@ -1 +1 @@
-{"version":3,"names":["KanbanState","constructor","params","_defineProperty2","default","exports"],"sources":["../../../../src/state/KanbanState/KanbanState.ts"],"sourcesContent":["import {\n  CollectionStateParams,\n  DataResultRaw,\n  FiltersMap,\n  OptionalFiltersMap,\n  WixPatternsContainer,\n} from '@wix/bex-core';\nimport { ICollectionComponentState } from '../ICollectionComponentState';\nimport { ToolbarCollectionState } from '../ToolbarCollectionState';\nimport { KanbanDragEndItemEvent } from './KanbanDragEndEvent';\nimport { KanbanStageState } from './KanbanStageState';\n\nexport type stageType = 'DONE' | 'NONE';\n\nexport interface KanbanStateBaseParams<\n  T,\n  S,\n  F extends FiltersMap = OptionalFiltersMap,\n> {\n  stages: {\n    fetchData: CollectionStateParams<S, F>['fetchData'];\n    stageKey: CollectionStateParams<S, F>['itemKey'];\n    stageName: CollectionStateParams<S, F>['itemName'];\n    stageType?(stage: S): stageType;\n  };\n  items: {\n    fetchData: CollectionStateParams<T, F>['fetchData'];\n    itemKey: CollectionStateParams<T, F>['itemKey'];\n    itemName: CollectionStateParams<T, F>['itemName'];\n    fetchAllByStageIds?: ({\n      ids,\n      filter,\n    }: {\n      ids: string[];\n      filter: F;\n    }) => Promise<Record<string, DataResultRaw<T>>>;\n    dragAndDrop?: {\n      onSubmit?: (event: KanbanDragEndItemEvent<T>) => Promise<void>;\n    };\n  };\n}\n\nexport interface KanbanStateParams<\n  T,\n  S,\n  F extends FiltersMap = OptionalFiltersMap,\n> extends KanbanStateBaseParams<T, S, F> {\n  readonly container: WixPatternsContainer;\n}\n\nexport interface KanbanStateParamsAPI {\n  readonly toolbar: ToolbarCollectionState<unknown, {}>;\n}\n\nexport class KanbanState<T, S, F extends FiltersMap = OptionalFiltersMap>\n  implements ICollectionComponentState, KanbanStateParamsAPI\n{\n  readonly container: any;\n  kanbanStageStates: Record<string, KanbanStageState<T, S, F>> = {};\n  // @ts-expect-error\n  readonly toolbar: ToolbarCollectionState<unknown, {}>;\n  // @ts-expect-error\n  // eslint-disable-next-line @typescript-eslint/no-useless-constructor\n  constructor(params: KanbanStateParams<T, S, F>) {}\n}\n"],"mappings":";;;;;;AAsDO,MAAMA,WAAW,CAExB;EAKE;EACA;EACAC,WAAWA,CAACC,MAAkC,EAAE;IAAA,IAAAC,gBAAA,CAAAC,OAAA;IAAA,IAAAD,gBAAA,CAAAC,OAAA,6BALe,CAAC,CAAC;IACjE;IAAA,IAAAD,gBAAA,CAAAC,OAAA;EAIiD;AACnD;AAACC,OAAA,CAAAL,WAAA,GAAAA,WAAA","ignoreList":[]}
+{"version":3,"names":["_bexCore","require","_ToolbarCollectionState","_KanbanStageState","_mobx","KanbanState","constructor","params","_defineProperty2","default","container","items","stagesCollectionState","CollectionState","errorMonitor","history","lodash","onlineState","queryCache","translate","queryName","fetchData","stages","itemKey","stageKey","itemName","stageName","filters","errorHandler","paginationMode","toolbar","ToolbarCollectionState","collection","componentType","reportBi","makeObservable","kanbanStageStates","observable","init","_this$stagesCollectio","initTask","status","promise","catch","initialAllStages","waitLoadStagesState","featuresInitializers","fetchAllByStageIds","data","ids","result","keyedItems","map","item","filter","forEach","stage","runInAction","_data$stageId","_data$stageId2","_data$stageId3","stageId","hasDataForStage","KanbanStageState","initialPage","total","cursor","undefined","name","key","Object","entries","stageState","getStageState","isLoading","keys","length","values","some","exports"],"sources":["../../../../src/state/KanbanState/KanbanState.ts"],"sourcesContent":["import {\n  CollectionState,\n  CollectionStateParams,\n  DataResultRaw,\n  FiltersMap,\n  OptionalFiltersMap,\n  WixPatternsContainer,\n  stringFilter,\n} from '@wix/bex-core';\nimport { ICollectionComponentState } from '../ICollectionComponentState';\nimport { ToolbarCollectionState } from '../ToolbarCollectionState';\nimport { KanbanDragEndItemEvent } from './KanbanDragEndEvent';\nimport { KanbanStageState } from './KanbanStageState';\nimport { observable, makeObservable, runInAction } from 'mobx';\n\nexport type stageType = 'DONE' | 'NONE';\n\nexport interface KanbanStateBaseParams<\n  T,\n  S,\n  F extends FiltersMap = OptionalFiltersMap,\n> {\n  stages: {\n    fetchData: CollectionStateParams<S, F>['fetchData'];\n    stageKey: CollectionStateParams<S, F>['itemKey'];\n    stageName: CollectionStateParams<S, F>['itemName'];\n    stageType?(stage: S): stageType;\n  };\n  items: {\n    fetchData: CollectionStateParams<T, F>['fetchData'];\n    itemKey: CollectionStateParams<T, F>['itemKey'];\n    itemName: CollectionStateParams<T, F>['itemName'];\n    fetchAllByStageIds?: ({\n      ids,\n      filter,\n    }: {\n      ids: string[];\n      filter: F;\n    }) => Promise<Record<string, DataResultRaw<T>>>;\n    dragAndDrop?: {\n      onSubmit?: (event: KanbanDragEndItemEvent<T>) => Promise<void>;\n    };\n  };\n}\n\nexport interface KanbanStateParams<\n  T,\n  S,\n  F extends FiltersMap = OptionalFiltersMap,\n> extends KanbanStateBaseParams<T, S, F> {\n  readonly container: WixPatternsContainer;\n}\n\nexport interface KanbanStateParamsAPI {\n  readonly toolbar: ToolbarCollectionState<unknown, {}>;\n}\n\nexport class KanbanState<T, S, F extends FiltersMap = OptionalFiltersMap>\n  implements ICollectionComponentState, KanbanStateParamsAPI\n{\n  readonly container: any;\n  kanbanStageStates: Record<\n    string,\n    KanbanStageState<T, S, F & { stageId: ReturnType<typeof stringFilter> }>\n  > = {};\n  // @ts-expect-error\n  readonly toolbar: ToolbarCollectionState<S, F>;\n  readonly stagesCollectionState: CollectionState<S, F>;\n  items: KanbanStateBaseParams<T, S, F>['items'];\n\n  constructor(params: KanbanStateParams<T, S, F>) {\n    this.container = params.container;\n    this.items = params.items;\n    this.stagesCollectionState = new CollectionState<S, F>({\n      errorMonitor: this.container.errorMonitor,\n      history: this.container.history,\n      lodash: this.container.lodash,\n      onlineState: this.container.onlineState,\n      queryCache: this.container.queryCache,\n      translate: this.container.translate,\n      queryName: 'kanban-stages',\n      fetchData: params.stages.fetchData,\n      itemKey: params.stages.stageKey,\n      itemName: params.stages.stageName,\n      filters: {} as F,\n      errorHandler: this.container.errorMonitor,\n      paginationMode: 'cursor',\n    });\n\n    this.toolbar = new ToolbarCollectionState({\n      collection: this.stagesCollectionState,\n      container: params.container,\n      componentType: 'Kanban',\n      reportBi: this.container.reportBi,\n    });\n\n    makeObservable(this, {\n      kanbanStageStates: observable,\n    });\n  }\n\n  async init() {\n    this.stagesCollectionState.init();\n    await this.stagesCollectionState?.initTask?.status?.promise?.catch(\n      () => {},\n    );\n    await this.initialAllStages();\n    this.waitLoadStagesState();\n    this.toolbar.init({ featuresInitializers: [] });\n  }\n\n  async initialAllStages() {\n    if (!this.items.fetchAllByStageIds) {\n      return;\n    }\n\n    const data = await this.items.fetchAllByStageIds({\n      ids: this.stagesCollectionState.result.keyedItems.map((item) =>\n        this.stagesCollectionState.itemKey(item.item),\n      ),\n      filter: {} as any,\n    });\n\n    this.stagesCollectionState.result.keyedItems.forEach((stage) => {\n      runInAction(() => {\n        const stageId = this.stagesCollectionState.itemKey(stage.item);\n        const hasDataForStage = !!data[stageId];\n        this.kanbanStageStates[stageId] = new KanbanStageState<\n          T,\n          S,\n          F & { stageId: ReturnType<typeof stringFilter> }\n        >({\n          container: this.container,\n          fetchData: this.items.fetchData,\n          itemKey: this.items.itemKey,\n          itemName: this.items.itemName,\n          initialPage: hasDataForStage\n            ? {\n                items: data[stageId]?.items,\n                total: data[stageId]?.total,\n                cursor: data[stageId]?.cursor,\n              }\n            : undefined,\n          name: this.stagesCollectionState.itemName(stage.item),\n          key: this.stagesCollectionState.itemKey(stage.item),\n          stage: stage.item,\n        });\n      });\n    });\n  }\n\n  waitLoadStagesState() {\n    Object.entries(this.kanbanStageStates).forEach(([, stageState]) => {\n      stageState.init();\n    });\n  }\n\n  stages() {\n    return this.stagesCollectionState.result.keyedItems.map((item: any) => item.item);\n  }\n\n  getStageState(stage: S) {\n    return this.kanbanStageStates[this.stagesCollectionState.itemKey(stage)];\n  }\n\n  isLoading() {\n    return (\n      this.stagesCollectionState.initTask.status.isLoading ||\n      Object.keys(this.kanbanStageStates).length !==\n        this.stagesCollectionState.result.keyedItems.length ||\n      Object.values(this.kanbanStageStates).some((stage) => stage.isLoading())\n    );\n  }\n\n  stageName(stage: S) {\n    return this.stagesCollectionState.itemName(stage);\n  }\n\n  stageKey(stage: S) {\n    return this.stagesCollectionState.itemKey(stage);\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/styles.global.css

@@ -1 +1 @@
-.Collapse2862573187__root{transition-property:height;transition-timing-function:cubic-bezier(.4,0,.2,1)}.Collapse2862573187__exit{height:0}.CollectionPage2234520680__root.CollectionPage2234520680--mobile{--wds-page-header-padding-horizontal:24px}.CollectionToolbar3311516781__left{min-width:0}.CollectionToolbar3311516781__root.CollectionToolbar3311516781--views .CollectionToolbar3311516781__left{flex-shrink:1;flex-grow:0}.CollectionToolbar3311516781__left.CollectionToolbar3311516781--expandable{flex:auto}.CollectionToolbar3311516781__root .CollectionToolbar3311516781__right{justify-content:flex-end!important;flex-grow:1;flex-shrink:1;flex-basis:auto}.CollectionToolbar3311516781__root.CollectionToolbar3311516781--views .CollectionToolbar3311516781__right{min-width:0;flex-grow:1;flex-shrink:0;flex-basis:0}.CollectionToolbar3311516781__root .CollectionToolbar3311516781__right.CollectionToolbar3311516781__fullWidth{margin-inline-start:0!important}.SearchOrCustomFilter2384822968__search{min-width:140px;max-width:240px;flex:1 0}.SearchOrCustomFilter2384822968__searchMobile{width:100%;justify-content:flex-end}.AutoCompleteReadonly1541048836__root.AutoCompleteReadonly1541048836--disableEditing{cursor:pointer}.AutoCompleteReadonly1541048836__root.AutoCompleteReadonly1541048836--disableEditing input{cursor:pointer}.ViewsDropdown3898533690__root{width:200px}.DragHandle3363833134__root{display:flex;align-items:center}.DragHandle3363833134__root:not(.DragHandle3363833134--disabled){cursor:grab;color:#a8caff}.DragHandle3363833134__root.DragHandle3363833134--disabled{color:#acafc4}.DragHandle3363833134__root:focus-visible:not(.DragHandle3363833134--disabled){outline:0;box-shadow:0 0 0 3px #a6d0ff}.DragHandle3363833134__root.DragHandle3363833134--disabled{pointer-events:none}.DragHandle3363833134__root.DragHandle3363833134--dragging:not(.DragHandle3363833134--disabled){cursor:grabbing}.EntityPagePlain1931780518__root.EntityPagePlain1931780518--mobile{--wds-page-header-padding-horizontal:24px}.Fade4106482360__root{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);opacity:1}.Fade4106482360__root.Fade4106482360--exit{opacity:0}.Heading3870613627__root{visibility:visible}.Heading3870613627__root.Heading3870613627--appearanceH2{font-size:28px!important;line-height:36px!important}.InputOverflow4217286032__root.InputOverflow4217286032--selected:not(.InputOverflow4217286032--focused) input::placeholder{color:#000624}@keyframes LoadingRow1904102831__gradientSwoosh{0%{background-position:50% 50%;background-size:150% 125%}15%{background-position:75% 40%;background-size:130% 115%}30%{background-position:50% 50%;background-size:120% 135%}60%{background-position:30% 50%;background-size:120% 135%}80%{background-position:10% 30%;background-size:130% 155%}to{background-position:40% 45%;background-size:125% 135%}}.LoadingRow1904102831__root{background-image:linear-gradient(60deg,rgba(255,255,255,.15)0,rgba(255,255,255,.15) 50%,rgba(95,242,174,.15) 100%),linear-gradient(284.81deg,#fff 67.18%,#91bbff 158.87%),linear-gradient(29deg,rgba(145,187,255,.6)0,#fff 40%,rgba(95,242,174,.6) 100%);height:100%;background-size:150% 125%;background-repeat:no-repeat;animation:LoadingRow1904102831__gradientSwoosh 2s ease-out infinite alternate}.MaxHeightText1214324424__root{opacity:1}.MaxHeightText1214324424__root.MaxHeightText1214324424--height24{line-height:24px}.MaxLines3806585394__root{overflow:hidden}.MaxLines3806585394__root.MaxLines3806585394--clamp{-webkit-box-orient:vertical;display:-webkit-box}.MultiBulkActionToolbar1064087199__root{min-width:0}.NestedTablePlaceholderStatesRow2756054532__root td{padding:0!important;width:100%}.NestedTableRow1540656841__firstLevel td{padding-top:18px!important;padding-bottom:18px!important}.NestedTableRow1540656841__root:hover{background-color:#e7f0ff!important}.NestedTableRow1540656841__root.NestedTableRow1540656841--expandable{cursor:pointer}.NestedTableRow1540656841__placeholder td{padding:0!important;width:100%}.NestedTableRow1540656841__root:hover td:first-of-type::before,.NestedTableRow1540656841__parentHovered td:first-of-type::before{content:"";position:absolute;top:0;bottom:0;left:0;width:2px;background-color:#5999ff}.MultipleDragOverlayEffect1896191585__root{position:absolute;transform:translate(6px,6px);background-color:#fff;box-shadow:0 2px 4px 0 rgba(0,6,36,.12),0 0 6px 0 rgba(0,6,36,.12)}.NestedTableDragAndDropRow2381769299__root.NestedTableDragAndDropRow2381769299--draggingInto td{background-color:#e7f0ff!important}.PickerContent1862787464__root{display:flex}.PickerContentAdditionalStep90574228__titles{display:flex;justify-content:center;flex:1 1 auto;overflow:hidden;flex-direction:column}.PickerContentAdditionalStep90574228__suffix{display:flex;align-items:center;flex:0 0 auto;overflow:hidden}.PickerTableListItem2178989231__root{box-sizing:border-box}.ScrollableContent1148287279__root.ScrollableContent1148287279--overflowY{overflow-y:auto}.ScrollableContent1148287279__root.ScrollableContent1148287279--overflowX{overflow-x:auto}.ScrollableContent1148287279__root.ScrollableContent1148287279--smooth{scroll-behavior:smooth}.SkeletonCard1652744210__headerLoading{display:block!important}.SlidingModal53497934__root{transition:transform .4s ease 0s;position:fixed;z-index:1}.SlidingModal53497934__root:not(.SlidingModal53497934--exited){box-shadow:0 3px 24px 0 rgba(22,45,61,.18),0 8px 8px 0 rgba(22,45,61,.12)}.TabsFilter2818603779__root .TabsFilter2818603779__title{color:inherit!important}.ManageTagsModal3211574138__root{display:flex}.ToolbarItem663239614__root{min-width:0}.ToolbarItemBox2630346704__root{min-width:0}.ToolbarItemBox2630346704__root.ToolbarItemBox2630346704--removeStartPadding{margin-left:-24px}.ToolbarItemBox2630346704__root.ToolbarItemBox2630346704--expandable{flex:1 0}.common1544566567__column{display:flex;flex-direction:column}.common1544566567__fullHeight{height:100%;min-height:0}.CollectionPageHeader2141897132__root.CollectionPageHeader2141897132--mobile{flex-direction:column}.CollectionPageHeader2141897132__root.CollectionPageHeader2141897132--mobile>*{margin-left:0;margin-top:6px!important;height:auto}.FormPageHeader72576902__root.FormPageHeader72576902--mobile{flex-direction:column}.FormPageHeader72576902__root.FormPageHeader72576902--mobile>*{margin-left:0;margin-top:6px!important;height:auto}
+.Collapse3184086015__root{transition-property:height;transition-timing-function:cubic-bezier(.4,0,.2,1)}.Collapse3184086015__exit{height:0}.CollectionPage4021467891__root.CollectionPage4021467891--mobile{--wds-page-header-padding-horizontal:24px}.CollectionToolbar2141847393__left{min-width:0}.CollectionToolbar2141847393__root.CollectionToolbar2141847393--views .CollectionToolbar2141847393__left{flex-shrink:1;flex-grow:0}.CollectionToolbar2141847393__left.CollectionToolbar2141847393--expandable{flex:auto}.CollectionToolbar2141847393__root .CollectionToolbar2141847393__right{justify-content:flex-end!important;flex-grow:1;flex-shrink:1;flex-basis:auto}.CollectionToolbar2141847393__root.CollectionToolbar2141847393--views .CollectionToolbar2141847393__right{min-width:0;flex-grow:1;flex-shrink:0;flex-basis:0}.CollectionToolbar2141847393__root .CollectionToolbar2141847393__right.CollectionToolbar2141847393__fullWidth{margin-inline-start:0!important}.SearchOrCustomFilter3259780684__search{min-width:140px;max-width:240px;flex:1 0}.SearchOrCustomFilter3259780684__searchMobile{width:100%;justify-content:flex-end}.AutoCompleteReadonly2343733065__root.AutoCompleteReadonly2343733065--disableEditing{cursor:pointer}.AutoCompleteReadonly2343733065__root.AutoCompleteReadonly2343733065--disableEditing input{cursor:pointer}.ViewsDropdown3662498980__root{width:200px}.DragHandle2538640036__root{display:flex;align-items:center}.DragHandle2538640036__root:not(.DragHandle2538640036--disabled){cursor:grab;color:#a8caff}.DragHandle2538640036__root.DragHandle2538640036--disabled{color:#acafc4}.DragHandle2538640036__root:focus-visible:not(.DragHandle2538640036--disabled){outline:0;box-shadow:0 0 0 3px #a6d0ff}.DragHandle2538640036__root.DragHandle2538640036--disabled{pointer-events:none}.DragHandle2538640036__root.DragHandle2538640036--dragging:not(.DragHandle2538640036--disabled){cursor:grabbing}.EntityPagePlain3011613235__root.EntityPagePlain3011613235--mobile{--wds-page-header-padding-horizontal:24px}.Fade1720713043__root{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);opacity:1}.Fade1720713043__root.Fade1720713043--exit{opacity:0}.Heading711712968__root{visibility:visible}.Heading711712968__root.Heading711712968--appearanceH2{font-size:28px!important;line-height:36px!important}.InputOverflow741637010__root.InputOverflow741637010--selected:not(.InputOverflow741637010--focused) input::placeholder{color:#000624}@keyframes LoadingRow4276382591__gradientSwoosh{0%{background-position:50% 50%;background-size:150% 125%}15%{background-position:75% 40%;background-size:130% 115%}30%{background-position:50% 50%;background-size:120% 135%}60%{background-position:30% 50%;background-size:120% 135%}80%{background-position:10% 30%;background-size:130% 155%}to{background-position:40% 45%;background-size:125% 135%}}.LoadingRow4276382591__root{background-image:linear-gradient(60deg,rgba(255,255,255,.15)0,rgba(255,255,255,.15) 50%,rgba(95,242,174,.15) 100%),linear-gradient(284.81deg,#fff 67.18%,#91bbff 158.87%),linear-gradient(29deg,rgba(145,187,255,.6)0,#fff 40%,rgba(95,242,174,.6) 100%);height:100%;background-size:150% 125%;background-repeat:no-repeat;animation:LoadingRow4276382591__gradientSwoosh 2s ease-out infinite alternate}.MaxHeightText1958960322__root{opacity:1}.MaxHeightText1958960322__root.MaxHeightText1958960322--height24{line-height:24px}.MaxLines1460011817__root{overflow:hidden}.MaxLines1460011817__root.MaxLines1460011817--clamp{-webkit-box-orient:vertical;display:-webkit-box}.MultiBulkActionToolbar1457397207__root{min-width:0}.NestedTablePlaceholderStatesRow3539828977__root td{padding:0!important;width:100%}.NestedTableRow3721788398__firstLevel td{padding-top:18px!important;padding-bottom:18px!important}.NestedTableRow3721788398__root:hover{background-color:#e7f0ff!important}.NestedTableRow3721788398__root.NestedTableRow3721788398--expandable{cursor:pointer}.NestedTableRow3721788398__placeholder td{padding:0!important;width:100%}.NestedTableRow3721788398__root:hover td:first-of-type::before,.NestedTableRow3721788398__parentHovered td:first-of-type::before{content:"";position:absolute;top:0;bottom:0;left:0;width:2px;background-color:#5999ff}.MultipleDragOverlayEffect614865566__root{position:absolute;transform:translate(6px,6px);background-color:#fff;box-shadow:0 2px 4px 0 rgba(0,6,36,.12),0 0 6px 0 rgba(0,6,36,.12)}.NestedTableDragAndDropRow222583998__root.NestedTableDragAndDropRow222583998--draggingInto td{background-color:#e7f0ff!important}.PickerContent2538802778__root{display:flex}.PickerContentAdditionalStep1666665154__titles{display:flex;justify-content:center;flex:1 1 auto;overflow:hidden;flex-direction:column}.PickerContentAdditionalStep1666665154__suffix{display:flex;align-items:center;flex:0 0 auto;overflow:hidden}.PickerTableListItem1880046094__root{box-sizing:border-box}.ScrollableContent4018829961__root.ScrollableContent4018829961--overflowY{overflow-y:auto}.ScrollableContent4018829961__root.ScrollableContent4018829961--overflowX{overflow-x:auto}.ScrollableContent4018829961__root.ScrollableContent4018829961--smooth{scroll-behavior:smooth}.SkeletonCard2435795976__headerLoading{display:block!important}.SlidingModal1552245449__root{transition:transform .4s ease 0s;position:fixed;z-index:1}.SlidingModal1552245449__root:not(.SlidingModal1552245449--exited){box-shadow:0 3px 24px 0 rgba(22,45,61,.18),0 8px 8px 0 rgba(22,45,61,.12)}.TabsFilter168253011__root .TabsFilter168253011__title{color:inherit!important}.ManageTagsModal895948555__root{display:flex}.ToolbarItem1484564348__root{min-width:0}.ToolbarItemBox1626543772__root{min-width:0}.ToolbarItemBox1626543772__root.ToolbarItemBox1626543772--removeStartPadding{margin-left:-24px}.ToolbarItemBox1626543772__root.ToolbarItemBox1626543772--expandable{flex:1 0}.common3189685746__column{display:flex;flex-direction:column}.common3189685746__fullHeight{height:100%;min-height:0}.CollectionPageHeader568173292__root.CollectionPageHeader568173292--mobile{flex-direction:column}.CollectionPageHeader568173292__root.CollectionPageHeader568173292--mobile>*{margin-left:0;margin-top:6px!important;height:auto}.FormPageHeader1300850206__root.FormPageHeader1300850206--mobile{flex-direction:column}.FormPageHeader1300850206__root.FormPageHeader1300850206--mobile>*{margin-left:0;margin-top:6px!important;height:auto}

package/dist/cjs/version.js

@@ -2,5 +2,5 @@
 
 exports.__esModule = true;
 exports.version = void 0;
-const version = exports.version = 'patterns@1.217.0';
+const version = exports.version = 'patterns@1.220.0';
 //# sourceMappingURL=version.js.map

package/dist/cjs/version.js.map

@@ -1 +1 @@
-{"version":3,"names":["version","exports"],"sources":["../../src/version.ts"],"sourcesContent":["export const version = 'patterns@1.217.0';\n"],"mappings":";;;;AAAO,MAAMA,OAAO,GAAAC,OAAA,CAAAD,OAAA,GAAG,kBAAkB","ignoreList":[]}
+{"version":3,"names":["version","exports"],"sources":["../../src/version.ts"],"sourcesContent":["export const version = 'patterns@1.220.0';\n"],"mappings":";;;;AAAO,MAAMA,OAAO,GAAAC,OAAA,CAAAD,OAAA,GAAG,kBAAkB","ignoreList":[]}

package/dist/esm/alpha/index.js

@@ -1,2 +1,4 @@
-export const alpha = {};
+export * from '../components/Kanban';
+export * from '../hooks/useKanban';
+export * from '../state/KanbanState';
 //# sourceMappingURL=index.js.map

package/dist/esm/alpha/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/alpha/index.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,KAAK,GAAG,EAAE,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/alpha/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC"}

package/dist/esm/components/Collapse/Collapse.st.css.js

@@ -1,12 +1,12 @@
 // @ts-nocheck
 import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
-var _namespace_ = "Collapse2862573187";
+var _namespace_ = "Collapse3184086015";
 var _style_ = classesRuntime.bind(null, _namespace_);
 export var cssStates = statesRuntime.bind(null, _namespace_);
 export var style = _style_;
 export var st = _style_;
 export var namespace = _namespace_;
-export var classes = { "root": "Collapse2862573187__root", "exit": "Collapse2862573187__exit" };
+export var classes = { "root": "Collapse3184086015__root", "exit": "Collapse3184086015__exit" };
 export var keyframes = {};
 export var layers = {};
 export var containers = {};

package/dist/esm/components/CollectionPageNew/CollectionPage.st.css.js

@@ -1,12 +1,12 @@
 // @ts-nocheck
 import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
-var _namespace_ = "CollectionPage2234520680";
+var _namespace_ = "CollectionPage4021467891";
 var _style_ = classesRuntime.bind(null, _namespace_);
 export var cssStates = statesRuntime.bind(null, _namespace_);
 export var style = _style_;
 export var st = _style_;
 export var namespace = _namespace_;
-export var classes = { "root": "CollectionPage2234520680__root" };
+export var classes = { "root": "CollectionPage4021467891__root" };
 export var keyframes = {};
 export var layers = {};
 export var containers = {};

package/dist/esm/components/CollectionToolbar/CollectionToolbar.st.css.js

@@ -1,12 +1,12 @@
 // @ts-nocheck
 import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
-var _namespace_ = "CollectionToolbar3311516781";
+var _namespace_ = "CollectionToolbar2141847393";
 var _style_ = classesRuntime.bind(null, _namespace_);
 export var cssStates = statesRuntime.bind(null, _namespace_);
 export var style = _style_;
 export var st = _style_;
 export var namespace = _namespace_;
-export var classes = { "root": "CollectionToolbar3311516781__root", "left": "CollectionToolbar3311516781__left", "right": "CollectionToolbar3311516781__right", "fullWidth": "CollectionToolbar3311516781__fullWidth" };
+export var classes = { "root": "CollectionToolbar2141847393__root", "left": "CollectionToolbar2141847393__left", "right": "CollectionToolbar2141847393__right", "fullWidth": "CollectionToolbar2141847393__fullWidth" };
 export var keyframes = {};
 export var layers = {};
 export var containers = {};

package/dist/esm/components/CollectionToolbar/SearchOrCustomFilter.st.css.js

@@ -1,12 +1,12 @@
 // @ts-nocheck
 import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
-var _namespace_ = "SearchOrCustomFilter2384822968";
+var _namespace_ = "SearchOrCustomFilter3259780684";
 var _style_ = classesRuntime.bind(null, _namespace_);
 export var cssStates = statesRuntime.bind(null, _namespace_);
 export var style = _style_;
 export var st = _style_;
 export var namespace = _namespace_;
-export var classes = { "root": "SearchOrCustomFilter2384822968__root", "search": "SearchOrCustomFilter2384822968__search", "searchMobile": "SearchOrCustomFilter2384822968__searchMobile" };
+export var classes = { "root": "SearchOrCustomFilter3259780684__root", "search": "SearchOrCustomFilter3259780684__search", "searchMobile": "SearchOrCustomFilter3259780684__searchMobile" };
 export var keyframes = {};
 export var layers = {};
 export var containers = {};

package/dist/esm/components/CollectionViewsDropdown/AutoCompleteReadonly.st.css.js

@@ -1,12 +1,12 @@
 // @ts-nocheck
 import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
-var _namespace_ = "AutoCompleteReadonly1541048836";
+var _namespace_ = "AutoCompleteReadonly2343733065";
 var _style_ = classesRuntime.bind(null, _namespace_);
 export var cssStates = statesRuntime.bind(null, _namespace_);
 export var style = _style_;
 export var st = _style_;
 export var namespace = _namespace_;
-export var classes = { "root": "AutoCompleteReadonly1541048836__root" };
+export var classes = { "root": "AutoCompleteReadonly2343733065__root" };
 export var keyframes = {};
 export var layers = {};
 export var containers = {};

package/dist/esm/components/CollectionViewsDropdown/ViewsDropdown.st.css.js

@@ -1,12 +1,12 @@
 // @ts-nocheck
 import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
-var _namespace_ = "ViewsDropdown3898533690";
+var _namespace_ = "ViewsDropdown3662498980";
 var _style_ = classesRuntime.bind(null, _namespace_);
 export var cssStates = statesRuntime.bind(null, _namespace_);
 export var style = _style_;
 export var st = _style_;
 export var namespace = _namespace_;
-export var classes = { "root": "ViewsDropdown3898533690__root" };
+export var classes = { "root": "ViewsDropdown3662498980__root" };
 export var keyframes = {};
 export var layers = {};
 export var containers = {};

package/dist/esm/components/DragHandle/DragHandle.st.css.js

@@ -1,12 +1,12 @@
 // @ts-nocheck
 import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
-var _namespace_ = "DragHandle3363833134";
+var _namespace_ = "DragHandle2538640036";
 var _style_ = classesRuntime.bind(null, _namespace_);
 export var cssStates = statesRuntime.bind(null, _namespace_);
 export var style = _style_;
 export var st = _style_;
 export var namespace = _namespace_;
-export var classes = { "root": "DragHandle3363833134__root" };
+export var classes = { "root": "DragHandle2538640036__root" };
 export var keyframes = {};
 export var layers = {};
 export var containers = {};

package/dist/esm/components/EntityPage/EntityPagePlain.st.css.js

@@ -1,12 +1,12 @@
 // @ts-nocheck
 import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
-var _namespace_ = "EntityPagePlain1931780518";
+var _namespace_ = "EntityPagePlain3011613235";
 var _style_ = classesRuntime.bind(null, _namespace_);
 export var cssStates = statesRuntime.bind(null, _namespace_);
 export var style = _style_;
 export var st = _style_;
 export var namespace = _namespace_;
-export var classes = { "root": "EntityPagePlain1931780518__root" };
+export var classes = { "root": "EntityPagePlain3011613235__root" };
 export var keyframes = {};
 export var layers = {};
 export var containers = {};

package/dist/esm/components/Fade/Fade.st.css.js

@@ -1,12 +1,12 @@
 // @ts-nocheck
 import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
-var _namespace_ = "Fade4106482360";
+var _namespace_ = "Fade1720713043";
 var _style_ = classesRuntime.bind(null, _namespace_);
 export var cssStates = statesRuntime.bind(null, _namespace_);
 export var style = _style_;
 export var st = _style_;
 export var namespace = _namespace_;
-export var classes = { "root": "Fade4106482360__root" };
+export var classes = { "root": "Fade1720713043__root" };
 export var keyframes = {};
 export var layers = {};
 export var containers = {};

package/dist/esm/components/Heading/Heading.st.css.js

@@ -1,12 +1,12 @@
 // @ts-nocheck
 import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
-var _namespace_ = "Heading3870613627";
+var _namespace_ = "Heading711712968";
 var _style_ = classesRuntime.bind(null, _namespace_);
 export var cssStates = statesRuntime.bind(null, _namespace_);
 export var style = _style_;
 export var st = _style_;
 export var namespace = _namespace_;
-export var classes = { "root": "Heading3870613627__root" };
+export var classes = { "root": "Heading711712968__root" };
 export var keyframes = {};
 export var layers = {};
 export var containers = {};

package/dist/esm/components/Heading/Heading.st.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"Heading.st.css.js","sourceRoot":"","sources":["../../../../src/components/Heading/Heading.st.css.ts"],"names":[],"mappings":"AAAA,cAAc;AAGd,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAI9E,IAAI,WAAW,GAAG,mBAAmB,CAAC;AACtC,IAAI,OAAO,GAAG,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;AAErD,MAAM,CAAC,IAAI,SAAS,GAAG,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;AAC7D,MAAM,CAAC,IAAI,KAAK,GAAG,OAAO,CAAC;AAC3B,MAAM,CAAC,IAAI,EAAE,GAA2C,OAAO,CAAC;AAEhE,MAAM,CAAC,IAAI,SAAS,GAAG,WAAW,CAAC;AACnC,MAAM,CAAC,IAAI,OAAO,GAAG,EAAC,MAAM,EAAC,yBAAyB,EAAC,CAAC;AACxD,MAAM,CAAC,IAAI,SAAS,GAAG,EAAE,CAAC;AAC1B,MAAM,CAAC,IAAI,MAAM,GAAG,EAAE,CAAC;AACvB,MAAM,CAAC,IAAI,UAAU,GAAG,EAAE,CAAC;AAC3B,MAAM,CAAC,IAAI,MAAM,GAAG,EAAE,CAAC;AACvB,MAAM,CAAC,IAAI,IAAI,GAAG,EAAE,CAAC"}
+{"version":3,"file":"Heading.st.css.js","sourceRoot":"","sources":["../../../../src/components/Heading/Heading.st.css.ts"],"names":[],"mappings":"AAAA,cAAc;AAGd,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAI9E,IAAI,WAAW,GAAG,kBAAkB,CAAC;AACrC,IAAI,OAAO,GAAG,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;AAErD,MAAM,CAAC,IAAI,SAAS,GAAG,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;AAC7D,MAAM,CAAC,IAAI,KAAK,GAAG,OAAO,CAAC;AAC3B,MAAM,CAAC,IAAI,EAAE,GAA2C,OAAO,CAAC;AAEhE,MAAM,CAAC,IAAI,SAAS,GAAG,WAAW,CAAC;AACnC,MAAM,CAAC,IAAI,OAAO,GAAG,EAAC,MAAM,EAAC,wBAAwB,EAAC,CAAC;AACvD,MAAM,CAAC,IAAI,SAAS,GAAG,EAAE,CAAC;AAC1B,MAAM,CAAC,IAAI,MAAM,GAAG,EAAE,CAAC;AACvB,MAAM,CAAC,IAAI,UAAU,GAAG,EAAE,CAAC;AAC3B,MAAM,CAAC,IAAI,MAAM,GAAG,EAAE,CAAC;AACvB,MAAM,CAAC,IAAI,IAAI,GAAG,EAAE,CAAC"}

package/dist/esm/components/InputOverflow/InputOverflow.st.css.js

@@ -1,12 +1,12 @@
 // @ts-nocheck
 import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
-var _namespace_ = "InputOverflow4217286032";
+var _namespace_ = "InputOverflow741637010";
 var _style_ = classesRuntime.bind(null, _namespace_);
 export var cssStates = statesRuntime.bind(null, _namespace_);
 export var style = _style_;
 export var st = _style_;
 export var namespace = _namespace_;
-export var classes = { "root": "InputOverflow4217286032__root" };
+export var classes = { "root": "InputOverflow741637010__root" };
 export var keyframes = {};
 export var layers = {};
 export var containers = {};

package/dist/esm/components/InputOverflow/InputOverflow.st.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputOverflow.st.css.js","sourceRoot":"","sources":["../../../../src/components/InputOverflow/InputOverflow.st.css.ts"],"names":[],"mappings":"AAAA,cAAc;AAGd,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAI9E,IAAI,WAAW,GAAG,yBAAyB,CAAC;AAC5C,IAAI,OAAO,GAAG,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;AAErD,MAAM,CAAC,IAAI,SAAS,GAAG,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;AAC7D,MAAM,CAAC,IAAI,KAAK,GAAG,OAAO,CAAC;AAC3B,MAAM,CAAC,IAAI,EAAE,GAA2C,OAAO,CAAC;AAEhE,MAAM,CAAC,IAAI,SAAS,GAAG,WAAW,CAAC;AACnC,MAAM,CAAC,IAAI,OAAO,GAAG,EAAC,MAAM,EAAC,+BAA+B,EAAC,CAAC;AAC9D,MAAM,CAAC,IAAI,SAAS,GAAG,EAAE,CAAC;AAC1B,MAAM,CAAC,IAAI,MAAM,GAAG,EAAE,CAAC;AACvB,MAAM,CAAC,IAAI,UAAU,GAAG,EAAE,CAAC;AAC3B,MAAM,CAAC,IAAI,MAAM,GAAG,EAAE,CAAC;AACvB,MAAM,CAAC,IAAI,IAAI,GAAG,EAAE,CAAC"}
+{"version":3,"file":"InputOverflow.st.css.js","sourceRoot":"","sources":["../../../../src/components/InputOverflow/InputOverflow.st.css.ts"],"names":[],"mappings":"AAAA,cAAc;AAGd,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAI9E,IAAI,WAAW,GAAG,wBAAwB,CAAC;AAC3C,IAAI,OAAO,GAAG,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;AAErD,MAAM,CAAC,IAAI,SAAS,GAAG,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;AAC7D,MAAM,CAAC,IAAI,KAAK,GAAG,OAAO,CAAC;AAC3B,MAAM,CAAC,IAAI,EAAE,GAA2C,OAAO,CAAC;AAEhE,MAAM,CAAC,IAAI,SAAS,GAAG,WAAW,CAAC;AACnC,MAAM,CAAC,IAAI,OAAO,GAAG,EAAC,MAAM,EAAC,8BAA8B,EAAC,CAAC;AAC7D,MAAM,CAAC,IAAI,SAAS,GAAG,EAAE,CAAC;AAC1B,MAAM,CAAC,IAAI,MAAM,GAAG,EAAE,CAAC;AACvB,MAAM,CAAC,IAAI,UAAU,GAAG,EAAE,CAAC;AAC3B,MAAM,CAAC,IAAI,MAAM,GAAG,EAAE,CAAC;AACvB,MAAM,CAAC,IAAI,IAAI,GAAG,EAAE,CAAC"}

package/dist/esm/components/Kanban/Card.js

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { Box, Button, IconButton, Text, ClickableCard, } from '@wix/design-system';
+import { observer } from 'mobx-react-lite';
+import { MoreSmall } from '@wix/wix-ui-icons-common';
+function _CardComponent({ item, stageKey }) {
+    const { title, subtitle, additionalInfo, badge } = item;
+    return (React.createElement("div", { draggable: true, "data-hook": `kanban-card-container-${stageKey}-${item.key}` },
+        React.createElement(ClickableCard, { hasPadding: false },
+            React.createElement(Box, { padding: "12px", dataHook: `kanban-card-${stageKey}-${item.key}`, direction: "vertical" },
+                React.createElement(Box, { paddingBottom: "3px" },
+                    React.createElement(Text, { dataHook: `kanban-card-title-${stageKey}-${item.key}`, size: "small", weight: "normal" }, title)),
+                React.createElement(Box, { direction: "vertical" },
+                    React.createElement(Box, null, badge),
+                    React.createElement(Box, null, subtitle),
+                    React.createElement(Box, null, additionalInfo)),
+                React.createElement(Box, { align: "right", paddingTop: "3px" },
+                    React.createElement(Box, { gap: "SP2" },
+                        React.createElement(IconButton, { priority: "secondary", size: "tiny" },
+                            React.createElement(MoreSmall, null)),
+                        React.createElement(Button, { size: "tiny", priority: "secondary" }, "View Details")))))));
+}
+export const CardComponent = observer(_CardComponent);
+//# sourceMappingURL=Card.js.map

package/dist/esm/components/Kanban/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../../src/components/Kanban/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,GAAG,EACH,MAAM,EACN,UAAU,EACV,IAAI,EACJ,aAAa,GACd,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAE3C,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAsBrD,SAAS,cAAc,CAIrB,EAAE,IAAI,EAAE,QAAQ,EAA4B;IAC5C,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;IAExD,OAAO,CACL,6BACE,SAAS,qBAIE,yBAAyB,QAAQ,IAAI,IAAI,CAAC,GAAG,EAAE;QAE1D,oBAAC,aAAa,IAAC,UAAU,EAAE,KAAK;YAC9B,oBAAC,GAAG,IACF,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,eAAe,QAAQ,IAAI,IAAI,CAAC,GAAG,EAAE,EAC/C,SAAS,EAAC,UAAU;gBAEpB,oBAAC,GAAG,IAAC,aAAa,EAAC,KAAK;oBACtB,oBAAC,IAAI,IACH,QAAQ,EAAE,qBAAqB,QAAQ,IAAI,IAAI,CAAC,GAAG,EAAE,EACrD,IAAI,EAAC,OAAO,EACZ,MAAM,EAAC,QAAQ,IAEd,KAAK,CACD,CACH;gBACN,oBAAC,GAAG,IAAC,SAAS,EAAC,UAAU;oBACvB,oBAAC,GAAG,QAAE,KAAK,CAAO;oBAClB,oBAAC,GAAG,QAAE,QAAQ,CAAO;oBACrB,oBAAC,GAAG,QAAE,cAAc,CAAO,CACvB;gBACN,oBAAC,GAAG,IAAC,KAAK,EAAC,OAAO,EAAC,UAAU,EAAC,KAAK;oBACjC,oBAAC,GAAG,IAAC,GAAG,EAAC,KAAK;wBACZ,oBAAC,UAAU,IAAC,QAAQ,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM;4BAC1C,oBAAC,SAAS,OAAG,CACF;wBACb,oBAAC,MAAM,IAAC,IAAI,EAAC,MAAM,EAAC,QAAQ,EAAC,WAAW,mBAE/B,CACL,CACF,CACF,CACQ,CACZ,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,aAAa,GAAG,QAAQ,CAAC,cAAc,CAAC,CAAC"}

package/dist/esm/components/Kanban/Kanban.js

@@ -1,9 +1,25 @@
-import React from 'react';
+import React, { useEffect } from 'react';
+import { ToolbarCollection } from '../ToolbarCollection';
 import { observer } from 'mobx-react-lite';
+import { StageComponent } from './Stage';
+import { Box } from '@wix/design-system';
+import { CollectionCard } from '../CollectionCard';
 function _Kanban(props) {
-    return React.createElement("div", null,
-        "kanban ",
-        JSON.stringify(props));
+    const { state, dataHook } = props;
+    const { toolbar } = state;
+    // if (process.env.NODE_ENV !== 'production') {
+    //   minimalRequiredWdsRuntimeCheck({
+    //     required: '^1.64.1',
+    //     requiredBy: 'WixPatterns/Kanban',
+    //   });
+    // }
+    useEffect(() => {
+        props.state.init();
+    }, [props.state]);
+    return (React.createElement(CollectionCard, { errorState: false, state: toolbar, dataHook: dataHook },
+        React.createElement(ToolbarCollection, { search: true, sticky: true, state: toolbar },
+            React.createElement(Box, { dataHook: "kanban-test", margin: "24px", overflow: "auto", direction: "vertical" },
+                React.createElement(Box, { dataHook: "kanban-stages", direction: "vertical" }, props.state.isLoading() ? (React.createElement("div", null, "loading stages...")) : (React.createElement(Box, { direction: "horizontal", gap: "12px" }, props.state.stages().map((stage) => (React.createElement(StageComponent, { stageState: props.state.getStageState(stage), dataHook: `kanban-stage-${props.state.stageKey(stage)}`, key: props.state.stageKey(stage), ...props }))))))))));
 }
 export const Kanban = observer(_Kanban);
 //# sourceMappingURL=Kanban.js.map

package/dist/esm/components/Kanban/Kanban.js.map

@@ -1 +1 @@
-{"version":3,"file":"Kanban.js","sourceRoot":"","sources":["../../../../src/components/Kanban/Kanban.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAQ3C,SAAS,OAAO,CAA6B,KAA2B;IACtE,OAAO;;QAAa,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAO,CAAC;AACnD,CAAC;AAED,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC"}
+{"version":3,"file":"Kanban.js","sourceRoot":"","sources":["../../../../src/components/Kanban/Kanban.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAoB,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAC3E,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAG3C,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AACzC,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAOnD,SAAS,OAAO,CAA6B,KAA2B;IACtE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAElC,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IAE1B,+CAA+C;IAC/C,qCAAqC;IACrC,2BAA2B;IAC3B,wCAAwC;IACxC,QAAQ;IACR,IAAI;IACJ,SAAS,CAAC,GAAG,EAAE;QACb,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;IACrB,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IAElB,OAAO,CACL,oBAAC,cAAc,IAAC,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ;QACnE,oBAAC,iBAAiB,IAAC,MAAM,EAAE,IAAI,EAAE,MAAM,QAAC,KAAK,EAAE,OAAO;YACpD,oBAAC,GAAG,IACF,QAAQ,EAAC,aAAa,EACtB,MAAM,EAAC,MAAM,EACb,QAAQ,EAAC,MAAM,EACf,SAAS,EAAC,UAAU;gBAEpB,oBAAC,GAAG,IAAC,QAAQ,EAAC,eAAe,EAAC,SAAS,EAAC,UAAU,IAC/C,KAAK,CAAC,KAAK,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,CACzB,qDAA4B,CAC7B,CAAC,CAAC,CAAC,CACF,oBAAC,GAAG,IAAC,SAAS,EAAC,YAAY,EAAC,GAAG,EAAC,MAAM,IACnC,KAAK,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,KAAQ,EAAE,EAAE,CAAC,CACtC,oBAAC,cAAc,IACb,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,EAC5C,QAAQ,EAAE,gBAAgB,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,EACvD,GAAG,EAAE,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,KAC5B,KAAK,GACT,CACH,CAAC,CACE,CACP,CACG,CACF,CACY,CACL,CAClB,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC"}

package/dist/esm/components/Kanban/Kanban.uni.driver.js

@@ -1,11 +1,50 @@
 import { CollectionToolbarUniDriver } from '../CollectionToolbar/CollectionToolbar.uni.driver';
-import { baseUniDriverFactory } from '../../unidriver';
+import { baseUniDriverFactory } from '../../unidriver/baseUniDriverFactory';
 export function KanbanUniDriver(base, body) {
     const toolbarBase = () => base.$('[data-hook="collection-toolbar"]');
     const toolbar = () => CollectionToolbarUniDriver(toolbarBase(), body);
     return {
         ...baseUniDriverFactory(base),
         toolbar: () => toolbar(),
+        stages: {
+            count: () => base.$$('[data-hook^="kanban-stage-container"]').count(),
+            getTitleByStageKey: (stageKey) => base.$(`[data-hook^="kanban-stage-title-${stageKey}"]`).text(),
+            getTotalByStageKey: (stageKey) => base.$(`[data-hook^="kanban-stage-title-total-${stageKey}"]`).text(),
+            scrollToEndOfStageCardsContainer: async (stageKey) => {
+                const scrollableElementDataHook = `kanban-stage-cards-container-${stageKey}`;
+                const { page } = (await body
+                    .$(`[data-hook="${scrollableElementDataHook}"]`)
+                    .getNative());
+                // puppeteer
+                if (page?.evaluate) {
+                    await page.evaluate((_dataHook) => {
+                        const scrollableElement = document.querySelector(`[data-hook="${_dataHook}"]`);
+                        scrollableElement.scrollBy({
+                            behavior: 'smooth',
+                            top: scrollableElement.scrollHeight,
+                        });
+                    }, scrollableElementDataHook);
+                    await page.waitForTimeout(1000); // delay scroll resolve by 1 sec
+                }
+                // jsdom
+                else {
+                    const pageScrollContent = body.$(`[data-hook="${scrollableElementDataHook}"]`);
+                    if (await pageScrollContent.exists()) {
+                        // Scroll to the end of pageScrollContent by setting scrollTop to (scrollHeight - clientHeight)
+                        const nativeEl = await pageScrollContent.getNative();
+                        nativeEl.scrollTop = nativeEl.scrollHeight - nativeEl.clientHeight;
+                        await nativeEl.dispatchEvent(new Event('scroll'));
+                    }
+                }
+            },
+        },
+        cards: {
+            count: (stageKey) => base.$$(`[data-hook^="kanban-card-${stageKey}-"]`).count(),
+            getTitle: ({ stageKey, cardKey, }) => base
+                .$(`[data-hook="kanban-card-title-${stageKey}-${cardKey}"]`)
+                .text()
+                .then((text) => text.trim()),
+        },
     };
 }
 export default KanbanUniDriver;

package/dist/esm/components/Kanban/Kanban.uni.driver.js.map

@@ -1 +1 @@
-{"version":3,"file":"Kanban.uni.driver.js","sourceRoot":"","sources":["../../../../src/components/Kanban/Kanban.uni.driver.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,0BAA0B,EAAE,MAAM,mDAAmD,CAAC;AAC/F,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAEvD,MAAM,UAAU,eAAe,CAAC,IAAe,EAAE,IAAe;IAC9D,MAAM,WAAW,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,kCAAkC,CAAC,CAAC;IAErE,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,0BAA0B,CAAC,WAAW,EAAE,EAAE,IAAI,CAAC,CAAC;IAEtE,OAAO;QACL,GAAG,oBAAoB,CAAC,IAAI,CAAC;QAC7B,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,EAAE;KACzB,CAAC;AACJ,CAAC;AAED,eAAe,eAAe,CAAC"}
+{"version":3,"file":"Kanban.uni.driver.js","sourceRoot":"","sources":["../../../../src/components/Kanban/Kanban.uni.driver.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,0BAA0B,EAAE,MAAM,mDAAmD,CAAC;AAC/F,OAAO,EAAE,oBAAoB,EAAE,MAAM,sCAAsC,CAAC;AAG5E,MAAM,UAAU,eAAe,CAAC,IAAe,EAAE,IAAe;IAC9D,MAAM,WAAW,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,kCAAkC,CAAC,CAAC;IAErE,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,0BAA0B,CAAC,WAAW,EAAE,EAAE,IAAI,CAAC,CAAC;IAEtE,OAAO;QACL,GAAG,oBAAoB,CAAC,IAAI,CAAC;QAC7B,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,EAAE;QACxB,MAAM,EAAE;YACN,KAAK,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,uCAAuC,CAAC,CAAC,KAAK,EAAE;YACrE,kBAAkB,EAAE,CAAC,QAAgB,EAAE,EAAE,CACvC,IAAI,CAAC,CAAC,CAAC,mCAAmC,QAAQ,IAAI,CAAC,CAAC,IAAI,EAAE;YAChE,kBAAkB,EAAE,CAAC,QAAgB,EAAE,EAAE,CACvC,IAAI,CAAC,CAAC,CAAC,yCAAyC,QAAQ,IAAI,CAAC,CAAC,IAAI,EAAE;YACtE,gCAAgC,EAAE,KAAK,EAAE,QAAgB,EAAE,EAAE;gBAC3D,MAAM,yBAAyB,GAAG,gCAAgC,QAAQ,EAAE,CAAC;gBAE7E,MAAM,EAAE,IAAI,EAAE,GAAG,CAAC,MAAM,IAAI;qBACzB,CAAC,CAAC,eAAe,yBAAyB,IAAI,CAAC;qBAC/C,SAAS,EAAE,CAEb,CAAC;gBACF,YAAY;gBACZ,IAAI,IAAI,EAAE,QAAQ,EAAE;oBAClB,MAAM,IAAI,CAAC,QAAQ,CAAC,CAAC,SAAiB,EAAE,EAAE;wBACxC,MAAM,iBAAiB,GAAG,QAAQ,CAAC,aAAa,CAC9C,eAAe,SAAS,IAAI,CAC5B,CAAC;wBACH,iBAAiB,CAAC,QAAQ,CAAC;4BACzB,QAAQ,EAAE,QAAQ;4BAClB,GAAG,EAAE,iBAAiB,CAAC,YAAY;yBACpC,CAAC,CAAC;oBACL,CAAC,EAAE,yBAAyB,CAAC,CAAC;oBAC9B,MAAM,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,gCAAgC;iBAClE;gBACD,QAAQ;qBACH;oBACH,MAAM,iBAAiB,GAAG,IAAI,CAAC,CAAC,CAC9B,eAAe,yBAAyB,IAAI,CAC7C,CAAC;oBAEF,IAAI,MAAM,iBAAiB,CAAC,MAAM,EAAE,EAAE;wBACpC,+FAA+F;wBAC/F,MAAM,QAAQ,GAAG,MAAM,iBAAiB,CAAC,SAAS,EAAE,CAAC;wBACrD,QAAQ,CAAC,SAAS,GAAG,QAAQ,CAAC,YAAY,GAAG,QAAQ,CAAC,YAAY,CAAC;wBACnE,MAAM,QAAQ,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;qBACnD;iBACF;YACH,CAAC;SACF;QACD,KAAK,EAAE;YACL,KAAK,EAAE,CAAC,QAAgB,EAAE,EAAE,CAC1B,IAAI,CAAC,EAAE,CAAC,4BAA4B,QAAQ,KAAK,CAAC,CAAC,KAAK,EAAE;YAC5D,QAAQ,EAAE,CAAC,EACT,QAAQ,EACR,OAAO,GAIR,EAAE,EAAE,CACH,IAAI;iBACD,CAAC,CAAC,iCAAiC,QAAQ,IAAI,OAAO,IAAI,CAAC;iBAC3D,IAAI,EAAE;iBACN,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;SACjC;KACF,CAAC;AACJ,CAAC;AAED,eAAe,eAAe,CAAC"}

package/dist/esm/components/Kanban/Stage.js

@@ -0,0 +1,48 @@
+import * as React from 'react';
+import { AddItem, Box, CounterBadge, Text } from '@wix/design-system';
+import { observer } from 'mobx-react-lite';
+import { CardComponent } from './Card';
+function _StageComponent({ dataHook, stageState, stageSummary, ...props }) {
+    const handleScroll = (e) => {
+        const { scrollTop, scrollHeight, clientHeight } = e.currentTarget;
+        if (scrollHeight - scrollTop <= clientHeight + 10 &&
+            !stageState.itemsCollectionState.fetchedLastPage &&
+            !stageState.itemsCollectionState.result.status.isFetching) {
+            // stageState.fetchMore();
+        }
+    };
+    const items = React.useMemo(() => stageState.itemsCollectionState.result.keyedItems.map((item) => ({
+        item: {
+            ...props.renderItem?.({
+                stage: stageState.stage,
+                item: item.item,
+            }),
+            key: item.key,
+        },
+        stageKey: stageState.stageKey(),
+    })), [stageState.itemsCollectionState.result.keyedItems]);
+    return (React.createElement(Box, { width: "270px", dataHook: `kanban-stage-container-${stageState.stageKey()}`, backgroundColor: "#F4F7FF", borderRadius: "8px", paddingLeft: "12px", paddingRight: "12px", direction: "vertical" },
+        React.createElement(Box, { width: "246px", direction: "vertical" },
+            React.createElement("div", { "data-hook": dataHook },
+                React.createElement(Box, { paddingTop: "12px", direction: "vertical" },
+                    React.createElement(Box, { marginBottom: "24px", direction: "vertical", padding: "12px 6px 0 6px", borderRadius: "8px" },
+                        React.createElement(Box, { gap: "6px" },
+                            React.createElement(Text, { size: "small", weight: "bold", dataHook: `kanban-stage-title-${stageState.stageKey()}` }, stageState.stageName()),
+                            React.createElement(CounterBadge, { dataHook: `kanban-stage-title-total-${stageState.stageKey()}`, skin: "light", truncate: false }, stageState.totalItems())),
+                        React.createElement(Box, null, stageSummary?.({ stage: stageState.stage }))),
+                    React.createElement(Box, { paddingBottom: "12px" },
+                        React.createElement(AddItem, { size: "tiny", removePadding: true },
+                            React.createElement(Box, { paddingTop: "9px", paddingBottom: "9px" }, "Add Card")))),
+                stageState.isLoading() ? (React.createElement("div", null, "loading cards...")) : (React.createElement("div", { "data-hook": `kanban-stage-cards-container-${stageState.stageKey()}`, style: {
+                        overflow: 'auto',
+                        height: '100%',
+                        maxHeight: 'calc(100vh - 400px)',
+                        display: 'flex',
+                        flexDirection: 'column',
+                        gap: '12px',
+                    }, onScroll: handleScroll },
+                    items?.map((item, i) => (React.createElement(CardComponent, { key: i, item: item.item, stageKey: item.stageKey, actionCell: props.actionCell, dataExtension: props.dataExtension, tags: props.tags }))),
+                    stageState.itemsCollectionState.status.isLoading && (React.createElement("div", { className: "text-sm text-center text-gray-500" }, "Loading more..."))))))));
+}
+export const StageComponent = observer(_StageComponent);
+//# sourceMappingURL=Stage.js.map

package/dist/esm/components/Kanban/Stage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stage.js","sourceRoot":"","sources":["../../../../src/components/Kanban/Stage.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/LoadingRow/LoadingRow.st.css.js

@@ -1,13 +1,13 @@
 // @ts-nocheck
 import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
-var _namespace_ = "LoadingRow1904102831";
+var _namespace_ = "LoadingRow4276382591";
 var _style_ = classesRuntime.bind(null, _namespace_);
 export var cssStates = statesRuntime.bind(null, _namespace_);
 export var style = _style_;
 export var st = _style_;
 export var namespace = _namespace_;
-export var classes = { "root": "LoadingRow1904102831__root" };
-export var keyframes = { "gradientSwoosh": "LoadingRow1904102831__gradientSwoosh" };
+export var classes = { "root": "LoadingRow4276382591__root" };
+export var keyframes = { "gradientSwoosh": "LoadingRow4276382591__gradientSwoosh" };
 export var layers = {};
 export var containers = {};
 export var stVars = {};