@bikdotai/bik-component-library 0.0.384-beta.25 → 0.0.384-beta.26

package/dist/cjs/components/product-picker-v2/rearrangeScreen.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),r=require("react"),s=require("react-beautiful-dnd"),i=require("../icon-button/IconButton.js"),c=require("../TypographyStyle.js"),n=require("./emptyState.js"),a=require("./helpers/ProductHelper.js"),o=require("./style.js"),l=require("./variantComponents.js");exports.RearrangeScreen=d=>{const{selectedCollections:u,selectedCollectionsDispatch:p,setScreen:j,rearrangeViewType:S,outOfStockAction:x}=d,[y,h]=r.useState(a.parseSelectedVariantsToArray(u));r.useEffect((()=>{h(a.parseSelectedVariantsToArray(u))}),[u]);return e.jsxs(s.DragDropContext,Object.assign({onDragEnd:e=>{if(!e.destination)return;const t=y,[r]=t.splice(e.source.index,1);t.splice(e.destination.index,0,r),t.forEach(((e,t)=>{e.displayOrder=t})),h(t)}},{children:[e.jsxs(o.SelectedScreenHeader,{children:[e.jsx(i.IconButton,{Icon:t.default,onClick:()=>{j("collections")}}),e.jsx(c.BodyCaption,{children:"All Products"})]}),Object.keys(u).length>0?"list"===S?e.jsx(l.VariantsList,{selectedVariants:y,setSelectedVariants:h,selectedCollectionsDispatch:p,outOfStockAction:x}):e.jsx(l.VariantsGrid,{selectedVariants:y,setSelectedVariants:h,selectedCollectionsDispatch:p}):e.jsx(n.EmptyState,{title:"No Products Selected",subtitle:"Selected products will appear here"})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),r=require("react"),s=require("react-beautiful-dnd"),c=require("../../constants/Theme.js"),n=require("../icon-button/IconButton.js"),i=require("../TypographyStyle.js"),o=require("./emptyState.js"),a=require("./helpers/ProductHelper.js"),l=require("./style.js"),d=require("./variantComponents.js");exports.RearrangeScreen=u=>{const{selectedCollections:p,selectedCollectionsDispatch:j,setScreen:S,rearrangeViewType:h,outOfStockAction:y}=u,[x,q]=r.useState(a.parseSelectedVariantsToArray(p));r.useEffect((()=>{q(a.parseSelectedVariantsToArray(p))}),[p]);return e.jsxs(s.DragDropContext,Object.assign({onDragEnd:e=>{if(!e.destination)return;const t=x,[r]=t.splice(e.source.index,1);t.splice(e.destination.index,0,r),t.forEach(((e,t)=>{e.displayOrder=t})),q(t)}},{children:[e.jsxs(l.SelectedScreenHeader,{children:[e.jsx(n.IconButton,{Icon:t.default,width:16,height:16,color:c.COLORS.content.secondary,onClick:()=>{S("collections")}}),e.jsx(i.BodyCaption,Object.assign({color:c.COLORS.content.secondary},{children:"All Products"}))]}),Object.keys(p).length>0?"list"===h?e.jsx(d.VariantsList,{selectedVariants:x,setSelectedVariants:q,selectedCollectionsDispatch:j,outOfStockAction:y}):e.jsx(d.VariantsGrid,{selectedVariants:x,setSelectedVariants:q,selectedCollectionsDispatch:j}):e.jsx(o.EmptyState,{title:"No Products Selected",subtitle:"Selected products will appear here"})]}))};

package/dist/cjs/components/product-picker-v2/variantComponents.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react-beautiful-dnd"),a=require("../../constants/Theme.js"),s=require("./variant.js");exports.VariantsGrid=a=>{let{selectedVariants:d}=a;return e.jsx(r.Droppable,Object.assign({droppableId:"droppable-horizontal"},{children:a=>e.jsxs("div",Object.assign({},a.droppableProps,{ref:a.innerRef,style:Object.assign(Object.assign({},a.droppableProps.style),{display:"flex",width:"500px"})},{children:[e.jsx(r.Droppable,Object.assign({droppableId:"droppable-vertical",direction:"horizontal"},{children:a=>e.jsxs("div",Object.assign({},a.droppableProps,{ref:a.innerRef,style:Object.assign(Object.assign({},a.droppableProps.style),{display:"flex",flexWrap:"wrap",flexDirection:"row"})},{children:[d.map(((a,d)=>e.jsx(r.Draggable,Object.assign({draggableId:`${a.productId}-${a.variantId}`,index:d},{children:(r,d)=>e.jsxs("div",Object.assign({ref:r.innerRef},r.draggableProps,r.dragHandleProps,{children:[e.jsx(s.VariantCardGridView,{data:a}),r.placeholder]}))}),`${a.productId}-${a.variantId}`))),a.placeholder]}))})),a.placeholder]}))}))},exports.VariantsList=d=>{let{selectedVariants:i,setSelectedVariants:t,selectedCollectionsDispatch:l,outOfStockAction:n}=d;return e.jsx(r.Droppable,Object.assign({droppableId:"droppable-list"},{children:(d,p)=>e.jsxs("div",Object.assign({},d.droppableProps,{ref:d.innerRef,style:Object.assign({backgroundColor:a.COLORS.surface.subdued,padding:"0.05px",height:i.length<8?"550px":"100%"},d.droppableProps.style)},{children:[i.map(((d,p)=>e.jsx("div",Object.assign({style:{background:a.COLORS.surface.hovered,margin:"5px"}},{children:e.jsx(r.Draggable,Object.assign({draggableId:`${d.productId}-${d.variantId}`,index:p},{children:(r,a)=>e.jsx("div",Object.assign({ref:r.innerRef},r.draggableProps,r.dragHandleProps,{children:e.jsx(s.VariantCardListView,{data:d,selectedCollectionsDispatch:l,onDelete:()=>{const e=i.slice();e[p].displayOrder=null,e.splice(p,1),t(e)},outOfStockAction:n},`${d.productId}-${d.variantId}`)}))}),`${d.productId}-${d.variantId}`)}),`${d.productId}-${d.variantId}`))),d.placeholder&&p.isDraggingOver?e.jsx("div",Object.assign({style:{background:a.COLORS.surface.hovered,margin:"5px"}},{children:d.placeholder})):null]}))}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),a=require("react-beautiful-dnd"),s=require("../../constants/Theme.js"),d=require("./variant.js");exports.VariantsGrid=r=>{let{selectedVariants:s}=r;return e.jsx(a.Droppable,Object.assign({droppableId:"droppable-horizontal"},{children:r=>e.jsxs("div",Object.assign({},r.droppableProps,{ref:r.innerRef,style:Object.assign(Object.assign({},r.droppableProps.style),{display:"flex",width:"500px"})},{children:[e.jsx(a.Droppable,Object.assign({droppableId:"droppable-vertical",direction:"horizontal"},{children:r=>e.jsxs("div",Object.assign({},r.droppableProps,{ref:r.innerRef,style:Object.assign(Object.assign({},r.droppableProps.style),{display:"flex",flexWrap:"wrap",flexDirection:"row"})},{children:[s.map(((r,s)=>e.jsx(a.Draggable,Object.assign({draggableId:`${r.productId}-${r.variantId}`,index:s},{children:(a,s)=>e.jsxs("div",Object.assign({ref:a.innerRef},a.draggableProps,a.dragHandleProps,{children:[e.jsx(d.VariantCardGridView,{data:r}),a.placeholder]}))}),`${r.productId}-${r.variantId}`))),r.placeholder]}))})),r.placeholder]}))}))},exports.VariantsList=i=>{let{selectedVariants:t,setSelectedVariants:n,selectedCollectionsDispatch:l,outOfStockAction:o}=i;const[p,c]=r.useState(-1);return e.jsx(a.Droppable,Object.assign({droppableId:"droppable-list"},{children:(r,i)=>e.jsxs("div",Object.assign({},r.droppableProps,{ref:r.innerRef,style:Object.assign({backgroundColor:s.COLORS.surface.subdued,padding:"0.05px",height:t.length<8?"550px":"100%"},r.droppableProps.style)},{children:[t.map(((r,i)=>e.jsx("div",Object.assign({style:{background:s.COLORS.surface.hovered,margin:"5px",boxShadow:i===p?"0px 4px 12px rgba(0, 0, 0, 0.12)":""},onMouseEnter:()=>c(i),onMouseLeave:()=>c(-1)},{children:e.jsx(a.Draggable,Object.assign({draggableId:`${r.productId}-${r.variantId}`,index:i},{children:(a,s)=>e.jsx("div",Object.assign({ref:a.innerRef},a.draggableProps,a.dragHandleProps,{children:e.jsx(d.VariantCardListView,{data:r,selectedCollectionsDispatch:l,onDelete:()=>{const e=t.slice();e[i].displayOrder=null,e.splice(i,1),n(e)},outOfStockAction:o},`${r.productId}-${r.variantId}`)}))}),`${r.productId}-${r.variantId}`)}),`${r.productId}-${r.variantId}`))),r.placeholder&&i.isDraggingOver?e.jsx("div",Object.assign({style:{background:s.COLORS.surface.hovered,margin:"5px"}},{children:r.placeholder})):null]}))}))};

package/dist/esm/components/product-picker-v2/rearrangeScreen.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import o from"../../assets/icons/arrow_left.svg.js";import{useState as r,useEffect as s}from"react";import{DragDropContext as i}from"react-beautiful-dnd";import{IconButton as c}from"../icon-button/IconButton.js";import{BodyCaption as n}from"../TypographyStyle.js";import{EmptyState as l}from"./emptyState.js";import{parseSelectedVariantsToArray as a}from"./helpers/ProductHelper.js";import{SelectedScreenHeader as p}from"./style.js";import{VariantsList as d,VariantsGrid as m}from"./variantComponents.js";const f=f=>{const{selectedCollections:u,selectedCollectionsDispatch:h,setScreen:j,rearrangeViewType:S,outOfStockAction:y}=f,[g,C]=r(a(u));s((()=>{C(a(u))}),[u]);return e(i,Object.assign({onDragEnd:e=>{if(!e.destination)return;const t=g,[o]=t.splice(e.source.index,1);t.splice(e.destination.index,0,o),t.forEach(((e,t)=>{e.displayOrder=t})),C(t)}},{children:[e(p,{children:[t(c,{Icon:o,onClick:()=>{j("collections")}}),t(n,{children:"All Products"})]}),Object.keys(u).length>0?"list"===S?t(d,{selectedVariants:g,setSelectedVariants:C,selectedCollectionsDispatch:h,outOfStockAction:y}):t(m,{selectedVariants:g,setSelectedVariants:C,selectedCollectionsDispatch:h}):t(l,{title:"No Products Selected",subtitle:"Selected products will appear here"})]}))};export{f as RearrangeScreen};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import o from"../../assets/icons/arrow_left.svg.js";import{useState as r,useEffect as s}from"react";import{DragDropContext as c}from"react-beautiful-dnd";import{COLORS as i}from"../../constants/Theme.js";import{IconButton as n}from"../icon-button/IconButton.js";import{BodyCaption as l}from"../TypographyStyle.js";import{EmptyState as a}from"./emptyState.js";import{parseSelectedVariantsToArray as d}from"./helpers/ProductHelper.js";import{SelectedScreenHeader as p}from"./style.js";import{VariantsList as m,VariantsGrid as f}from"./variantComponents.js";const h=h=>{const{selectedCollections:u,selectedCollectionsDispatch:j,setScreen:y,rearrangeViewType:S,outOfStockAction:g}=h,[b,C]=r(d(u));s((()=>{C(d(u))}),[u]);return e(c,Object.assign({onDragEnd:e=>{if(!e.destination)return;const t=b,[o]=t.splice(e.source.index,1);t.splice(e.destination.index,0,o),t.forEach(((e,t)=>{e.displayOrder=t})),C(t)}},{children:[e(p,{children:[t(n,{Icon:o,width:16,height:16,color:i.content.secondary,onClick:()=>{y("collections")}}),t(l,Object.assign({color:i.content.secondary},{children:"All Products"}))]}),Object.keys(u).length>0?"list"===S?t(m,{selectedVariants:b,setSelectedVariants:C,selectedCollectionsDispatch:j,outOfStockAction:g}):t(f,{selectedVariants:b,setSelectedVariants:C,selectedCollectionsDispatch:j}):t(a,{title:"No Products Selected",subtitle:"Selected products will appear here"})]}))};export{h as RearrangeScreen};

package/dist/esm/components/product-picker-v2/variantComponents.js

@@ -1 +1 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import{Droppable as a,Draggable as d}from"react-beautiful-dnd";import{COLORS as t}from"../../constants/Theme.js";import{VariantCardListView as i,VariantCardGridView as s}from"./variant.js";const l=s=>{let{selectedVariants:l,setSelectedVariants:n,selectedCollectionsDispatch:o,outOfStockAction:c}=s;return e(a,Object.assign({droppableId:"droppable-list"},{children:(a,s)=>r("div",Object.assign({},a.droppableProps,{ref:a.innerRef,style:Object.assign({backgroundColor:t.surface.subdued,padding:"0.05px",height:l.length<8?"550px":"100%"},a.droppableProps.style)},{children:[l.map(((r,a)=>e("div",Object.assign({style:{background:t.surface.hovered,margin:"5px"}},{children:e(d,Object.assign({draggableId:`${r.productId}-${r.variantId}`,index:a},{children:(d,t)=>e("div",Object.assign({ref:d.innerRef},d.draggableProps,d.dragHandleProps,{children:e(i,{data:r,selectedCollectionsDispatch:o,onDelete:()=>{const e=l.slice();e[a].displayOrder=null,e.splice(a,1),n(e)},outOfStockAction:c},`${r.productId}-${r.variantId}`)}))}),`${r.productId}-${r.variantId}`)}),`${r.productId}-${r.variantId}`))),a.placeholder&&s.isDraggingOver?e("div",Object.assign({style:{background:t.surface.hovered,margin:"5px"}},{children:a.placeholder})):null]}))}))},n=t=>{let{selectedVariants:i}=t;return e(a,Object.assign({droppableId:"droppable-horizontal"},{children:t=>r("div",Object.assign({},t.droppableProps,{ref:t.innerRef,style:Object.assign(Object.assign({},t.droppableProps.style),{display:"flex",width:"500px"})},{children:[e(a,Object.assign({droppableId:"droppable-vertical",direction:"horizontal"},{children:a=>r("div",Object.assign({},a.droppableProps,{ref:a.innerRef,style:Object.assign(Object.assign({},a.droppableProps.style),{display:"flex",flexWrap:"wrap",flexDirection:"row"})},{children:[i.map(((a,t)=>e(d,Object.assign({draggableId:`${a.productId}-${a.variantId}`,index:t},{children:(d,t)=>r("div",Object.assign({ref:d.innerRef},d.draggableProps,d.dragHandleProps,{children:[e(s,{data:a}),d.placeholder]}))}),`${a.productId}-${a.variantId}`))),a.placeholder]}))})),t.placeholder]}))}))};export{n as VariantsGrid,l as VariantsList};
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{useState as a}from"react";import{Droppable as d,Draggable as t}from"react-beautiful-dnd";import{COLORS as i}from"../../constants/Theme.js";import{VariantCardListView as s,VariantCardGridView as n}from"./variant.js";const l=n=>{let{selectedVariants:l,setSelectedVariants:o,selectedCollectionsDispatch:c,outOfStockAction:p}=n;const[b,g]=a(-1);return e(d,Object.assign({droppableId:"droppable-list"},{children:(a,d)=>r("div",Object.assign({},a.droppableProps,{ref:a.innerRef,style:Object.assign({backgroundColor:i.surface.subdued,padding:"0.05px",height:l.length<8?"550px":"100%"},a.droppableProps.style)},{children:[l.map(((r,a)=>e("div",Object.assign({style:{background:i.surface.hovered,margin:"5px",boxShadow:a===b?"0px 4px 12px rgba(0, 0, 0, 0.12)":""},onMouseEnter:()=>g(a),onMouseLeave:()=>g(-1)},{children:e(t,Object.assign({draggableId:`${r.productId}-${r.variantId}`,index:a},{children:(d,t)=>e("div",Object.assign({ref:d.innerRef},d.draggableProps,d.dragHandleProps,{children:e(s,{data:r,selectedCollectionsDispatch:c,onDelete:()=>{const e=l.slice();e[a].displayOrder=null,e.splice(a,1),o(e)},outOfStockAction:p},`${r.productId}-${r.variantId}`)}))}),`${r.productId}-${r.variantId}`)}),`${r.productId}-${r.variantId}`))),a.placeholder&&d.isDraggingOver?e("div",Object.assign({style:{background:i.surface.hovered,margin:"5px"}},{children:a.placeholder})):null]}))}))},o=a=>{let{selectedVariants:i}=a;return e(d,Object.assign({droppableId:"droppable-horizontal"},{children:a=>r("div",Object.assign({},a.droppableProps,{ref:a.innerRef,style:Object.assign(Object.assign({},a.droppableProps.style),{display:"flex",width:"500px"})},{children:[e(d,Object.assign({droppableId:"droppable-vertical",direction:"horizontal"},{children:a=>r("div",Object.assign({},a.droppableProps,{ref:a.innerRef,style:Object.assign(Object.assign({},a.droppableProps.style),{display:"flex",flexWrap:"wrap",flexDirection:"row"})},{children:[i.map(((a,d)=>e(t,Object.assign({draggableId:`${a.productId}-${a.variantId}`,index:d},{children:(d,t)=>r("div",Object.assign({ref:d.innerRef},d.draggableProps,d.dragHandleProps,{children:[e(n,{data:a}),d.placeholder]}))}),`${a.productId}-${a.variantId}`))),a.placeholder]}))})),a.placeholder]}))}))};export{o as VariantsGrid,l as VariantsList};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.384-beta.25",
+	"version": "0.0.384-beta.26",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",