@numl-react/organisms/dist/index.cjs.js

A simple and accessible component for React by numl design

"use strict";var e=Object.defineProperty,t=Object.prototype.hasOwnProperty,l=Object.getOwnPropertySymbols,n=Object.prototype.propertyIsEnumerable,a=(t,l,n)=>l in t?e(t,l,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[l]=n,r=(e,r)=>{for(var c in r||(r={}))t.call(r,c)&&a(e,c,r[c]);if(l)for(var c of l(r))n.call(r,c)&&a(e,c,r[c]);return e},c=(e,a)=>{var r={};for(var c in e)t.call(e,c)&&a.indexOf(c)<0&&(r[c]=e[c]);if(null!=e&&l)for(var c of l(e))a.indexOf(c)<0&&n.call(e,c)&&(r[c]=e[c]);return r};Object.defineProperty(exports,"__esModule",{value:!0}),exports[Symbol.toStringTag]="Module";var i=require("react"),u=require("@numl-react/elements"),o=require("@numl-react/atoms"),d=require("@numl-react/core");function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function m(e){if(e&&e.__esModule)return e;var t={__proto__:null,[Symbol.toStringTag]:"Module"};return e&&Object.keys(e).forEach((function(l){if("default"!==l){var n=Object.getOwnPropertyDescriptor(e,l);Object.defineProperty(t,l,n.get?n:{enumerable:!0,get:function(){return e[l]}})}})),t.default=e,Object.freeze(t)}var s=f(i),C=m(i),p=m(u);const g=e=>s.default.createElement("svg",{width:"143",height:"32",viewBox:"0 0 143 32",fill:"none",xmlns:"http://www.w3.org/2000/svg"},s.default.createElement("path",{d:"M26.8866 5.40977C20.809 -1.08549 10.433 -1.14756 4.28759 5.29127C0.361986 9.40512 -0.869353 15.1442 0.599217 20.2795C0.633107 20.4093 0.763019 20.4883 0.892931 20.4544C2.16381 20.1497 3.5533 20.4939 4.54741 21.4815C4.63214 21.5661 4.70556 21.6507 4.77899 21.7354C4.84112 21.8088 4.93715 21.8426 5.02752 21.82C5.87477 21.6225 6.77851 21.7072 7.57492 22.0853C7.70484 22.1473 7.85734 22.0853 7.90818 21.9498C8.11717 21.442 8.29791 20.9284 8.45607 20.4093C8.48996 20.302 8.44477 20.1892 8.34875 20.1271C7.17389 19.3878 5.88042 18.9251 4.54741 18.7332C6.06117 17.2209 8.20189 16.713 10.1336 17.2152C10.2579 17.2491 10.3934 17.1757 10.433 17.0516C10.8905 15.6577 11.6756 14.3485 12.7827 13.2425C14.9799 11.0473 17.9622 10.1274 20.8259 10.4717C20.9389 10.483 21.0293 10.5789 21.0462 10.6918C21.3964 13.5528 20.4701 16.5324 18.2729 18.7276C17.1658 19.8337 15.8554 20.6181 14.4603 21.0751C14.336 21.1147 14.2682 21.2444 14.2965 21.3742C14.7992 23.3042 14.2908 25.4429 12.7771 26.9553C12.5907 25.6292 12.1218 24.3312 11.3819 23.1575C11.3198 23.0615 11.2068 23.0164 11.0995 23.0503C10.5798 23.2026 10.0658 23.3888 9.55749 23.5976C9.42758 23.6541 9.36545 23.8008 9.42194 23.9306C9.80037 24.7319 9.8851 25.6292 9.68741 26.4756C9.66481 26.5659 9.6987 26.6619 9.77213 26.7239C9.86251 26.7973 9.94723 26.8763 10.0263 26.9553C11.0148 27.9429 11.3593 29.3367 11.0543 30.6064C11.0261 30.7362 11.1051 30.866 11.2294 30.8999C16.4767 32.4009 22.3623 31.0861 26.4969 26.9553C32.4502 21.0356 32.5802 11.4987 26.8866 5.40977Z",fill:"#BF6BCD"}),s.default.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M38.2162 8.25C38.0626 8.25 37.9382 8.37448 37.9382 8.52803V11.3083V13.185C37.9382 13.324 37.8339 13.463 37.6601 13.463H36.548C36.3945 13.463 36.27 13.5875 36.27 13.741V16.5213C36.27 16.6748 36.3945 16.7993 36.548 16.7993H37.6601C37.8339 16.7993 37.9382 16.9383 37.9382 17.0773V23.472C37.9382 23.6255 38.0626 23.75 38.2162 23.75H40.9965C41.15 23.75 41.2745 23.6255 41.2745 23.472V17.0773C41.2745 16.9383 41.3787 16.7993 41.5525 16.7993H43.7072C43.8608 16.7993 43.9852 16.6748 43.9852 16.5213V13.741C43.9852 13.5875 43.8608 13.463 43.7072 13.463H41.5525C41.3787 13.463 41.2745 13.324 41.2745 13.185V11.8643C41.2745 11.7253 41.3787 11.5863 41.5525 11.5863H43.7072C43.8608 11.5863 43.9852 11.4618 43.9852 11.3083V8.52803C43.9852 8.37448 43.8608 8.25 43.7072 8.25H40.9965H38.2162Z",fill:"#BF6BCD"}),s.default.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M51.3176 23.7499C54.7149 23.7499 57.469 20.9959 57.469 17.5986C57.469 14.2013 54.7149 11.4473 51.3176 11.4473C47.9204 11.4473 45.1663 14.2013 45.1663 17.5986C45.1663 20.9959 47.9204 23.7499 51.3176 23.7499ZM51.3176 20.8173C53.0953 20.8173 54.5364 19.3763 54.5364 17.5986C54.5364 15.8209 53.0953 14.3799 51.3176 14.3799C49.54 14.3799 48.0989 15.8209 48.0989 17.5986C48.0989 19.3763 49.54 20.8173 51.3176 20.8173Z",fill:"#BF6BCD"}),s.default.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M58.6501 12.0728C58.6501 12.0669 58.6503 12.0611 58.6506 12.0553C58.6526 12.0233 58.66 11.9928 58.6719 11.9646C58.6903 11.9211 58.7195 11.8833 58.756 11.8545C58.8033 11.8171 58.8631 11.7948 58.9281 11.7948H61.7084H64.4192C64.5727 11.7948 64.6972 11.9193 64.6972 12.0728V14.8531C64.6972 15.0066 64.5727 15.1311 64.4192 15.1311H62.2644C62.0907 15.1311 61.9864 15.2701 61.9864 15.4091V23.4719C61.9864 23.6255 61.8619 23.7499 61.7084 23.7499H58.9281C58.7746 23.7499 58.6501 23.6255 58.6501 23.4719V14.8531V12.0728Z",fill:"#BF6BCD"}),s.default.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M76.9298 23.472C76.9298 23.6255 76.8053 23.75 76.6518 23.75H73.8715C73.718 23.75 73.5935 23.6255 73.5935 23.472V21.9786V16.9383V16.6951C73.5935 15.4859 72.6132 14.5056 71.404 14.5056C70.1948 14.5056 69.2146 15.4859 69.2146 16.6951V16.9383V21.9786V23.472C69.2146 23.6255 69.0901 23.75 68.9365 23.75H66.1563C66.0027 23.75 65.8782 23.6255 65.8782 23.472V16.9383C65.8782 16.9362 65.8783 16.9341 65.8783 16.932C65.8783 16.9225 65.8782 16.9131 65.8782 16.9036C65.8782 13.8518 68.3522 11.3778 71.404 11.3778C74.4558 11.3778 76.9298 13.8518 76.9298 16.9036C76.9298 16.9131 76.9298 16.9225 76.9297 16.932C76.9298 16.9341 76.9298 16.9362 76.9298 16.9383V23.472Z",fill:"#BF6BCD"}),s.default.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M84.158 23.7499C84.1485 23.7499 84.1392 23.7495 84.13 23.7485C80.7938 23.6782 78.1109 20.9517 78.1109 17.5986C78.1109 14.2013 80.865 11.4473 84.2623 11.4473C86.9383 11.4473 90.6569 13.2197 90.3441 18.8845C90.3441 19.038 90.2196 19.1625 90.0661 19.1625H89.788H84.3665H84.0885C83.3207 19.1625 82.6984 18.5401 82.6984 17.7724C82.6984 17.0046 83.3207 16.3822 84.0885 16.3822H84.3665H87.2576C86.7771 15.2001 85.617 14.3665 84.2623 14.3665C82.4772 14.3665 81.0302 15.8136 81.0302 17.5986C81.0302 19.3802 82.4718 20.8252 84.2521 20.8307H90.0661C90.2196 20.8307 90.3441 20.9551 90.3441 21.1087V23.4719C90.3441 23.6255 90.2196 23.7499 90.0661 23.7499H84.2623H84.158Z",fill:"#BF6BCD"}),s.default.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M91.5437 11.6558C91.5437 11.5023 91.6682 11.3778 91.8217 11.3778H94.602C94.7555 11.3778 94.88 11.5023 94.88 11.6558V13.1492V18.1895V18.4327C94.88 19.6419 95.8603 20.6222 97.0695 20.6222C98.2787 20.6222 99.2589 19.6419 99.2589 18.4327V18.1895V13.1492V11.6558C99.2589 11.5023 99.3834 11.3778 99.537 11.3778H102.317C102.471 11.3778 102.595 11.5023 102.595 11.6558V18.1895C102.595 18.1916 102.595 18.1937 102.595 18.1958C102.595 18.2053 102.595 18.2147 102.595 18.2242C102.595 21.276 100.121 23.75 97.0695 23.75C94.0177 23.75 91.5437 21.276 91.5437 18.2242C91.5437 18.2147 91.5437 18.2053 91.5438 18.1958C91.5437 18.1937 91.5437 18.1916 91.5437 18.1895V11.6558Z",fill:"#BF6BCD"}),s.default.createElement("path",{d:"M123.189 12.9091L129.741 20.5554C129.847 20.6786 129.978 20.7774 130.125 20.8452C130.273 20.913 130.433 20.9481 130.595 20.9481C130.758 20.9481 130.918 20.913 131.065 20.8452C131.213 20.7774 131.344 20.6786 131.449 20.5554L138.002 12.9091C138.627 12.1793 138.108 11.0519 137.147 11.0519H124.041C123.08 11.0519 122.562 12.1793 123.189 12.9091Z",fill:"#BEBAC0"}));function E(e){const{items:t="center",content:l="space-between",padding:n="1.5x 2x",message:a,button:r}=e;return s.default.createElement(p.Flex,{gap:!0,items:t,content:l,padding:n},s.default.createElement(p.Block,{hide:"n|n|n|y"},s.default.createElement(g,null)),s.default.createElement(p.Flex,{items:"center",width:"70%|70%|70%|100%",content:"space-between",text:"bold",color:"#bg"},a,s.default.createElement(o.Button.Group,null,r)))}function x(e){const{children:t,fill:l="bg"}=e,n=c(e,["children","fill"]);return s.default.createElement(d.El.Menu,r({width:"min 15",fill:l},n),t)}function b(e){const{height:t="100%",children:l,footer:n}=e;return s.default.createElement(x,{flex:!0,height:t,flow:"column",content:"space-between",width:"min 256px"},s.default.createElement(p.Block,{overflow:"auto"},s.default.createElement(p.Grid,{content:"space-between stretch",xl:"1fr",lg:"1fr",md:"1fr",sm:"1fr",xs:"1fr"},l)),s.default.createElement(p.Footer,null,s.default.createElement(p.Block,{border:"top"},s.default.Children.toArray(n))))}E.displayName="ContextualSaveBar",x.Item=function(e){const t=i.useRef(),{children:l,fill:n="bg",icon:a,onClick:u}=e,o=c(e,["children","fill","icon","onClick"]);return i.useEffect((()=>{t.current&&u&&t.current.addEventListener("click",(e=>u(e)))}),[]),s.default.createElement(d.El.Menuitem,r({ref:t,fill:n},o),a?s.default.createElement(s.default.Fragment,null,a&&"string"==typeof a?s.default.createElement(d.El.Icon,{name:a}):a):null,l)},b.Item=e=>{const{label:t,icon:l,children:n,dropdown:a=!1}=e,i=c(e,["label","icon","children","dropdown"]);return s.default.createElement(p.Menuitem,r({gap:"2x",flex:!0,width:"100%",content:"space-between"},i),s.default.createElement(p.Flex,{gap:"2x"},l&&"string"==typeof l?s.default.createElement(p.Icon,{name:l}):l,s.default.createElement(p.BaseElement,null,t||n)),a||1==a?s.default.createElement(p.DropdownIcon,{theme:"default"}):null)};const h=function({item:e}){const[t,l]=s.default.useState(!0);return s.default.useEffect((()=>{}),[t]),s.default.createElement(s.default.Fragment,null,s.default.createElement(b.Item,{icon:e.icon,label:e.label,to:e.to,beforeClick:()=>(l(!t),e.beforeClick),dropdown:!!e.subNavigationItems,onClick:e.onClick}),e.subNavigationItems?s.default.createElement(p.Block,{padding:"left 2.5rem",hide:t?"y":"n"},s.default.Children.toArray(e.subNavigationItems.length>0&&e.subNavigationItems.map((e=>{const{icon:t}=e,l=c(e,["icon"]);return s.default.createElement(h,{item:l})})))):null)};function v(e){const{width:t="22",name:l,image:n,detail:a,price:i,color:u,currency:o,sizes:d,rating:f}=e,m=c(e,["width","name","image","detail","price","color","currency","sizes","rating"]);return s.default.createElement(p.Grid,r({columns:"auto",row:"auto",content:"start",width:t},m),s.default.createElement(p.Card,{padding:"20px",radius:"8px"},s.default.createElement(p.Image,{column:"1",width:"100%",src:n,fit:"fill"}),s.default.createElement(p.Block,null,s.default.createElement(H,{name:l,rating:f,image:n,detail:a,price:i,color:u,currency:o,sizes:d}))))}function w(e){const{rating:t}=e,l=c(e,["rating"]);let n=t.avgRating;return t?(t.avgRating>5&&(t.avgRating=5),t.avgRating<0&&(t.avgRating=0),s.default.createElement(p.Flex,r({gap:!0,content:"space-between",items:"center",padding:!0},l),s.default.createElement(p.Inline,null,[0,1,2,3,4].map((e=>n>0?(n-=1,s.default.createElement(p.Icon,{name:"star",key:e,color:"#special"})):s.default.createElement(p.Icon,{name:"star-outline",cursor:"pointer"}))),s.default.createElement(p.Inline,{padding:!0},"(",t.count,")")),s.default.createElement(p.Inline,{border:"bg",radius:"4x",padding:"5px 15px",size:"12px 16px"},"Neutral"))):null}function B(e){const{name:t,detail:l}=e;return s.default.createElement(s.default.Fragment,null,t?s.default.createElement(p.Block,{size:"16px 24px",text:"bold",cursor:"pointer"},t):"",l?s.default.createElement(p.Block,{size:"14px 20px",cursor:"pointer"},l):"")}function y(e){const{sizes:t}=e;return t?s.default.createElement(s.default.Fragment,null,s.default.createElement(p.Block,{text:"bold",size:"14px 20px",padding:"5px 0px"},"Sizes"),s.default.createElement(p.Block,null,t&&t.map((e=>s.default.createElement(p.Button,{toggle:!0,key:e,cursor:"pointer",text:"uppercase"},e))))):null}function V(e){const{price:t,currency:l}=e;return s.default.createElement(p.Flex,{gap:!0,content:"space-between",items:"center",padding:"0.75 0"},s.default.createElement(p.Inline,null,s.default.createElement(p.Button,{cursor:"pointer"},"Add To Cart")),s.default.createElement(p.Inline,{size:"1.25 1.5"},l,t))}b.Section=function({items:e,title:t=null}){return s.default.createElement(s.default.Fragment,null,t?s.default.createElement(p.BaseElement,{padding:"top 2x"},s.default.createElement(p.Label,{padding:"1x"},t)):null,s.default.Children.toArray(e&&e.map((e=>s.default.createElement(s.default.Fragment,null,s.default.createElement(h,{item:e}))))))},b.displayName="NavigationBar",v.Landscape=function(e){const{width:t="280px",name:l,image:n,detail:a,price:r,color:c,sizes:i,currency:u,rating:o}=e;return s.default.createElement(p.Flex,{gap:!0,content:"space-between",items:"center",padding:!0},s.default.createElement(p.Card,{padding:"20px",radius:"8px"},s.default.createElement(p.Grid,{columns:"auto",row:"auto",gap:"3x",content:"start"},s.default.createElement(p.Image,{column:"1",width:t,src:n,fit:"fill"}),s.default.createElement(p.Block,{column:"2"},s.default.createElement(H,{currency:u,name:l,rating:o,image:n,detail:a,price:r,color:c,sizes:i})))))};const H=e=>{const{name:t,detail:l,price:n,color:a,sizes:r,currency:c,rating:i}=e;return s.default.createElement(s.default.Fragment,null,s.default.createElement(w,{rating:i}),s.default.createElement(B,{name:t,detail:l}),s.default.createElement(y,{sizes:r}),s.default.createElement(V,{price:n,currency:c}))};exports.ContextualSaveBar=E,exports.NavigationBar=b,exports.ProductCard=v,exports.TopBar=e=>{const{placeholder:t,nuLinkAction:l,subtitle:n,menu:a,logo:r,username:c}=e;return C.createElement(p.Flex,{width:"100vw",fill:"bg",padding:"1x",items:"center",content:"space-between"},C.createElement(p.Block,{hide:"n|n|n|y",to:l},r),C.createElement(o.Button,{hide:"y|n|n|n",clear:!0},C.createElement(p.Icon,{size:"2",name:"menu-outline"})),C.createElement(o.TextInput,{width:"50%",placeholder:t,icon:"search-outline"}),C.createElement(o.Avatar,{padding:"0",username:c,subtitle:n,clear:!0,flex:!0,items:"center"},a))};