@luminati-io/uikit 3.5.15 → 3.6.0

package/dist/umd/uikit.production.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"umd/uikit.production.min.js","mappings":";AAAA","sources":["webpack://uikit/webpack/universalModuleDefinition"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"react\"), require(\"prop-types\"), require(\"styled-components\"), require(\"react-virtualized\"), require(\"react-dom\"), require(\"react-table\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"react\", \"prop-types\", \"styled-components\", \"react-virtualized\", \"react-dom\", \"react-table\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"uikit\"] = factory(require(\"react\"), require(\"prop-types\"), require(\"styled-components\"), require(\"react-virtualized\"), require(\"react-dom\"), require(\"react-table\"));\n\telse\n\t\troot[\"uikit\"] = factory(root[\"react\"], root[\"prop-types\"], root[\"styled-components\"], root[\"react-virtualized\"], root[\"react-dom\"], root[\"react-table\"]);\n})(this, (__WEBPACK_EXTERNAL_MODULE__39155__, __WEBPACK_EXTERNAL_MODULE__81949__, __WEBPACK_EXTERNAL_MODULE__88694__, __WEBPACK_EXTERNAL_MODULE__22003__, __WEBPACK_EXTERNAL_MODULE__69514__, __WEBPACK_EXTERNAL_MODULE__95522__) => {\nreturn "],"names":[],"sourceRoot":""}
+{"version":3,"file":"umd/uikit.production.min.js","mappings":";AAAA;;;;;;;;ACSA;;;;;;;;AAQA;;;;;;;;AAQA;;;;;AAKA;;;;AAIA;;;;;;;AAOA;;;;;AAKA;;;;;;;;AAQA;;;;AAIA;;;;;;;AAOA;;;;;;AAMA;AACA;AACA;AACA;;;;;;;;AAQA;;;;;;;;;;;;;;AAcA;;;;;AAKA;;;;AAIA;;;;;;AAMA;;;;;;AAMA;;;;;;AAMA;;AAEA;;;;;;;AAOA;;;;;;;;AAQA;;;;;AAKA;;AAEA;;;;;;;;;;;;AAkBA;;;;;;;AAOA;;;;;AAKA","sources":["webpack://uikit/webpack/universalModuleDefinition","webpack://uikit/./node_modules/react-hot-toast/dist/index.mjs"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"react\"), require(\"prop-types\"), require(\"styled-components\"), require(\"react-virtualized\"), require(\"react-dom\"), require(\"react-table\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"react\", \"prop-types\", \"styled-components\", \"react-virtualized\", \"react-dom\", \"react-table\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"uikit\"] = factory(require(\"react\"), require(\"prop-types\"), require(\"styled-components\"), require(\"react-virtualized\"), require(\"react-dom\"), require(\"react-table\"));\n\telse\n\t\troot[\"uikit\"] = factory(root[\"react\"], root[\"prop-types\"], root[\"styled-components\"], root[\"react-virtualized\"], root[\"react-dom\"], root[\"react-table\"]);\n})(this, (__WEBPACK_EXTERNAL_MODULE__39155__, __WEBPACK_EXTERNAL_MODULE__81949__, __WEBPACK_EXTERNAL_MODULE__88694__, __WEBPACK_EXTERNAL_MODULE__22003__, __WEBPACK_EXTERNAL_MODULE__69514__, __WEBPACK_EXTERNAL_MODULE__95522__) => {\nreturn ","\"use client\";\nvar W=e=>typeof e==\"function\",T=(e,t)=>W(e)?e(t):e;var U=(()=>{let e=0;return()=>(++e).toString()})(),b=(()=>{let e;return()=>{if(e===void 0&&typeof window<\"u\"){let t=matchMedia(\"(prefers-reduced-motion: reduce)\");e=!t||t.matches}return e}})();import{useEffect as H,useState as j}from\"react\";var Q=20;var S=new Map,X=1e3,$=e=>{if(S.has(e))return;let t=setTimeout(()=>{S.delete(e),u({type:4,toastId:e})},X);S.set(e,t)},J=e=>{let t=S.get(e);t&&clearTimeout(t)},v=(e,t)=>{switch(t.type){case 0:return{...e,toasts:[t.toast,...e.toasts].slice(0,Q)};case 1:return t.toast.id&&J(t.toast.id),{...e,toasts:e.toasts.map(r=>r.id===t.toast.id?{...r,...t.toast}:r)};case 2:let{toast:o}=t;return e.toasts.find(r=>r.id===o.id)?v(e,{type:1,toast:o}):v(e,{type:0,toast:o});case 3:let{toastId:s}=t;return s?$(s):e.toasts.forEach(r=>{$(r.id)}),{...e,toasts:e.toasts.map(r=>r.id===s||s===void 0?{...r,visible:!1}:r)};case 4:return t.toastId===void 0?{...e,toasts:[]}:{...e,toasts:e.toasts.filter(r=>r.id!==t.toastId)};case 5:return{...e,pausedAt:t.time};case 6:let a=t.time-(e.pausedAt||0);return{...e,pausedAt:void 0,toasts:e.toasts.map(r=>({...r,pauseDuration:r.pauseDuration+a}))}}},A=[],P={toasts:[],pausedAt:void 0},u=e=>{P=v(P,e),A.forEach(t=>{t(P)})},Y={blank:4e3,error:4e3,success:2e3,loading:1/0,custom:4e3},I=(e={})=>{let[t,o]=j(P);H(()=>(A.push(o),()=>{let a=A.indexOf(o);a>-1&&A.splice(a,1)}),[t]);let s=t.toasts.map(a=>{var r,c;return{...e,...e[a.type],...a,duration:a.duration||((r=e[a.type])==null?void 0:r.duration)||(e==null?void 0:e.duration)||Y[a.type],style:{...e.style,...(c=e[a.type])==null?void 0:c.style,...a.style}}});return{...t,toasts:s}};var G=(e,t=\"blank\",o)=>({createdAt:Date.now(),visible:!0,type:t,ariaProps:{role:\"status\",\"aria-live\":\"polite\"},message:e,pauseDuration:0,...o,id:(o==null?void 0:o.id)||U()}),h=e=>(t,o)=>{let s=G(t,e,o);return u({type:2,toast:s}),s.id},n=(e,t)=>h(\"blank\")(e,t);n.error=h(\"error\");n.success=h(\"success\");n.loading=h(\"loading\");n.custom=h(\"custom\");n.dismiss=e=>{u({type:3,toastId:e})};n.remove=e=>u({type:4,toastId:e});n.promise=(e,t,o)=>{let s=n.loading(t.loading,{...o,...o==null?void 0:o.loading});return e.then(a=>(n.success(T(t.success,a),{id:s,...o,...o==null?void 0:o.success}),a)).catch(a=>{n.error(T(t.error,a),{id:s,...o,...o==null?void 0:o.error})}),e};import{useEffect as K,useCallback as L}from\"react\";var Z=(e,t)=>{u({type:1,toast:{id:e,height:t}})},ee=()=>{u({type:5,time:Date.now()})},D=e=>{let{toasts:t,pausedAt:o}=I(e);K(()=>{if(o)return;let r=Date.now(),c=t.map(i=>{if(i.duration===1/0)return;let d=(i.duration||0)+i.pauseDuration-(r-i.createdAt);if(d<0){i.visible&&n.dismiss(i.id);return}return setTimeout(()=>n.dismiss(i.id),d)});return()=>{c.forEach(i=>i&&clearTimeout(i))}},[t,o]);let s=L(()=>{o&&u({type:6,time:Date.now()})},[o]),a=L((r,c)=>{let{reverseOrder:i=!1,gutter:d=8,defaultPosition:p}=c||{},g=t.filter(m=>(m.position||p)===(r.position||p)&&m.height),E=g.findIndex(m=>m.id===r.id),x=g.filter((m,R)=>R<E&&m.visible).length;return g.filter(m=>m.visible).slice(...i?[x+1]:[0,x]).reduce((m,R)=>m+(R.height||0)+d,0)},[t]);return{toasts:t,handlers:{updateHeight:Z,startPause:ee,endPause:s,calculateOffset:a}}};import*as l from\"react\";import{styled as B,keyframes as z}from\"goober\";import*as y from\"react\";import{styled as C,keyframes as me}from\"goober\";import{styled as te,keyframes as k}from\"goober\";var oe=k`\nfrom {\n  transform: scale(0) rotate(45deg);\n\topacity: 0;\n}\nto {\n transform: scale(1) rotate(45deg);\n  opacity: 1;\n}`,re=k`\nfrom {\n  transform: scale(0);\n  opacity: 0;\n}\nto {\n  transform: scale(1);\n  opacity: 1;\n}`,se=k`\nfrom {\n  transform: scale(0) rotate(90deg);\n\topacity: 0;\n}\nto {\n  transform: scale(1) rotate(90deg);\n\topacity: 1;\n}`,_=te(\"div\")`\n  width: 20px;\n  opacity: 0;\n  height: 20px;\n  border-radius: 10px;\n  background: ${e=>e.primary||\"#ff4b4b\"};\n  position: relative;\n  transform: rotate(45deg);\n\n  animation: ${oe} 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275)\n    forwards;\n  animation-delay: 100ms;\n\n  &:after,\n  &:before {\n    content: '';\n    animation: ${re} 0.15s ease-out forwards;\n    animation-delay: 150ms;\n    position: absolute;\n    border-radius: 3px;\n    opacity: 0;\n    background: ${e=>e.secondary||\"#fff\"};\n    bottom: 9px;\n    left: 4px;\n    height: 2px;\n    width: 12px;\n  }\n\n  &:before {\n    animation: ${se} 0.15s ease-out forwards;\n    animation-delay: 180ms;\n    transform: rotate(90deg);\n  }\n`;import{styled as ae,keyframes as ie}from\"goober\";var ne=ie`\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n`,V=ae(\"div\")`\n  width: 12px;\n  height: 12px;\n  box-sizing: border-box;\n  border: 2px solid;\n  border-radius: 100%;\n  border-color: ${e=>e.secondary||\"#e0e0e0\"};\n  border-right-color: ${e=>e.primary||\"#616161\"};\n  animation: ${ne} 1s linear infinite;\n`;import{styled as ce,keyframes as N}from\"goober\";var pe=N`\nfrom {\n  transform: scale(0) rotate(45deg);\n\topacity: 0;\n}\nto {\n  transform: scale(1) rotate(45deg);\n\topacity: 1;\n}`,de=N`\n0% {\n\theight: 0;\n\twidth: 0;\n\topacity: 0;\n}\n40% {\n  height: 0;\n\twidth: 6px;\n\topacity: 1;\n}\n100% {\n  opacity: 1;\n  height: 10px;\n}`,w=ce(\"div\")`\n  width: 20px;\n  opacity: 0;\n  height: 20px;\n  border-radius: 10px;\n  background: ${e=>e.primary||\"#61d345\"};\n  position: relative;\n  transform: rotate(45deg);\n\n  animation: ${pe} 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275)\n    forwards;\n  animation-delay: 100ms;\n  &:after {\n    content: '';\n    box-sizing: border-box;\n    animation: ${de} 0.2s ease-out forwards;\n    opacity: 0;\n    animation-delay: 200ms;\n    position: absolute;\n    border-right: 2px solid;\n    border-bottom: 2px solid;\n    border-color: ${e=>e.secondary||\"#fff\"};\n    bottom: 6px;\n    left: 6px;\n    height: 10px;\n    width: 6px;\n  }\n`;var ue=C(\"div\")`\n  position: absolute;\n`,le=C(\"div\")`\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  min-width: 20px;\n  min-height: 20px;\n`,Te=me`\nfrom {\n  transform: scale(0.6);\n  opacity: 0.4;\n}\nto {\n  transform: scale(1);\n  opacity: 1;\n}`,fe=C(\"div\")`\n  position: relative;\n  transform: scale(0.6);\n  opacity: 0.4;\n  min-width: 20px;\n  animation: ${Te} 0.3s 0.12s cubic-bezier(0.175, 0.885, 0.32, 1.275)\n    forwards;\n`,M=({toast:e})=>{let{icon:t,type:o,iconTheme:s}=e;return t!==void 0?typeof t==\"string\"?y.createElement(fe,null,t):t:o===\"blank\"?null:y.createElement(le,null,y.createElement(V,{...s}),o!==\"loading\"&&y.createElement(ue,null,o===\"error\"?y.createElement(_,{...s}):y.createElement(w,{...s})))};var ye=e=>`\n0% {transform: translate3d(0,${e*-200}%,0) scale(.6); opacity:.5;}\n100% {transform: translate3d(0,0,0) scale(1); opacity:1;}\n`,ge=e=>`\n0% {transform: translate3d(0,0,-1px) scale(1); opacity:1;}\n100% {transform: translate3d(0,${e*-150}%,-1px) scale(.6); opacity:0;}\n`,he=\"0%{opacity:0;} 100%{opacity:1;}\",xe=\"0%{opacity:1;} 100%{opacity:0;}\",be=B(\"div\")`\n  display: flex;\n  align-items: center;\n  background: #fff;\n  color: #363636;\n  line-height: 1.3;\n  will-change: transform;\n  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1), 0 3px 3px rgba(0, 0, 0, 0.05);\n  max-width: 350px;\n  pointer-events: auto;\n  padding: 8px 10px;\n  border-radius: 8px;\n`,Se=B(\"div\")`\n  display: flex;\n  justify-content: center;\n  margin: 4px 10px;\n  color: inherit;\n  flex: 1 1 auto;\n  white-space: pre-line;\n`,Ae=(e,t)=>{let s=e.includes(\"top\")?1:-1,[a,r]=b()?[he,xe]:[ye(s),ge(s)];return{animation:t?`${z(a)} 0.35s cubic-bezier(.21,1.02,.73,1) forwards`:`${z(r)} 0.4s forwards cubic-bezier(.06,.71,.55,1)`}},F=l.memo(({toast:e,position:t,style:o,children:s})=>{let a=e.height?Ae(e.position||t||\"top-center\",e.visible):{opacity:0},r=l.createElement(M,{toast:e}),c=l.createElement(Se,{...e.ariaProps},T(e.message,e));return l.createElement(be,{className:e.className,style:{...a,...o,...e.style}},typeof s==\"function\"?s({icon:r,message:c}):l.createElement(l.Fragment,null,r,c))});import{css as Pe,setup as Oe}from\"goober\";import*as f from\"react\";Oe(f.createElement);var Ee=({id:e,className:t,style:o,onHeightUpdate:s,children:a})=>{let r=f.useCallback(c=>{if(c){let i=()=>{let d=c.getBoundingClientRect().height;s(e,d)};i(),new MutationObserver(i).observe(c,{subtree:!0,childList:!0,characterData:!0})}},[e,s]);return f.createElement(\"div\",{ref:r,className:t,style:o},a)},Re=(e,t)=>{let o=e.includes(\"top\"),s=o?{top:0}:{bottom:0},a=e.includes(\"center\")?{justifyContent:\"center\"}:e.includes(\"right\")?{justifyContent:\"flex-end\"}:{};return{left:0,right:0,display:\"flex\",position:\"absolute\",transition:b()?void 0:\"all 230ms cubic-bezier(.21,1.02,.73,1)\",transform:`translateY(${t*(o?1:-1)}px)`,...s,...a}},ve=Pe`\n  z-index: 9999;\n  > * {\n    pointer-events: auto;\n  }\n`,O=16,Ie=({reverseOrder:e,position:t=\"top-center\",toastOptions:o,gutter:s,children:a,containerStyle:r,containerClassName:c})=>{let{toasts:i,handlers:d}=D(o);return f.createElement(\"div\",{style:{position:\"fixed\",zIndex:9999,top:O,left:O,right:O,bottom:O,pointerEvents:\"none\",...r},className:c,onMouseEnter:d.startPause,onMouseLeave:d.endPause},i.map(p=>{let g=p.position||t,E=d.calculateOffset(p,{reverseOrder:e,gutter:s,defaultPosition:t}),x=Re(g,E);return f.createElement(Ee,{id:p.id,key:p.id,onHeightUpdate:d.updateHeight,className:p.visible?ve:\"\",style:x},p.type===\"custom\"?T(p.message,p):a?a(p):f.createElement(F,{toast:p,position:g}))}))};var _t=n;export{w as CheckmarkIcon,_ as ErrorIcon,V as LoaderIcon,F as ToastBar,M as ToastIcon,Ie as Toaster,_t as default,T as resolveValue,n as toast,D as useToaster,I as useToasterStore};\n//# sourceMappingURL=index.mjs.map"],"names":[],"sourceRoot":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luminati-io/uikit",
-  "version": "3.5.15",
+  "version": "3.6.0",
   "author": "Bright Data (http://brightdata.com)",
   "license": "ISC",
   "description": "brightdata's design system",
@@ -23,6 +23,7 @@
     "prismjs": "^1.29.0",
     "react-beautiful-dnd": "^13.1.1",
     "react-day-picker": "^8.10.0",
+    "react-hot-toast": "^2.4.1",
     "react-popper": "^2.3.0",
     "react-select": "^5.8.0"
   },
@@ -43,19 +44,17 @@
     "@rollup/plugin-commonjs": "^25.0.7",
     "@rollup/plugin-node-resolve": "^15.2.3",
     "@rollup/plugin-replace": "^5.0.5",
-    "@storybook/addon-a11y": "^6.5.16",
-    "@storybook/addon-actions": "^6.5.16",
-    "@storybook/addon-essentials": "^6.5.16",
-    "@storybook/addon-interactions": "^6.5.16",
-    "@storybook/addon-links": "^6.5.16",
-    "@storybook/builder-webpack4": "^6.5.16",
-    "@storybook/builder-webpack5": "^6.5.16",
-    "@storybook/jest": "0.0.10",
-    "@storybook/manager-webpack4": "^6.5.16",
-    "@storybook/manager-webpack5": "^6.5.16",
-    "@storybook/react": "^6.5.16",
-    "@storybook/test-runner": "^0.9.4",
-    "@storybook/testing-library": "0.0.13",
+    "@storybook/addon-a11y": "^8.0.6",
+    "@storybook/addon-actions": "^8.0.6",
+    "@storybook/addon-essentials": "^8.0.6",
+    "@storybook/addon-interactions": "^8.0.6",
+    "@storybook/addon-links": "^8.0.6",
+    "@storybook/addon-webpack5-compiler-babel": "^3.0.3",
+    "@storybook/react": "^8.0.6",
+    "@storybook/react-webpack5": "^8.0.6",
+    "@storybook/test": "^8.0.6",
+    "@storybook/test-runner": "^0.17.0",
+    "@storybook/theming": "^8.0.6",
     "babel-loader": "9.1.3",
     "babel-plugin-lodash": "^3.3.4",
     "babel-plugin-prismjs": "^2.1.0",
@@ -69,6 +68,7 @@
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-svg-sprites": "^1.2.5",
     "rollup-plugin-terser": "^7.0.2",
+    "storybook": "^8.0.6",
     "styled-components": "^6.1.8",
     "svg-sprite-loader": "^6.0.11",
     "svgo": "^3.2.0",
@@ -77,8 +77,8 @@
     "webpack-merge": "^5.10.0"
   },
   "scripts": {
-    "storybook": "start-storybook -p 6006 -c storybook_config",
-    "build-storybook": "build-storybook -c storybook_config",
+    "storybook": "storybook dev -p 6006 -c storybook_config",
+    "build-storybook": "storybook build -c storybook_config",
     "test": "test-storybook --verbose -c storybook_config",
     "build-rollup": "rollup -c",
     "build-webpack": "webpack",