intelicoreact 1.6.18 → 1.6.20

package/dist/Atomic/UI/WizardStepper/ui/StateIcon/StateIcon.js

@@ -1 +1,37 @@
-function r(r,t,e){return t in r?Object.defineProperty(r,t,{value:e,enumerable:!0,configurable:!0,writable:!0}):r[t]=e,r}import{jsx as t}from"react/jsx-runtime";import"react";import e from"classnames";import"./StateIcon.scss";import{WIZARD_STEP_VARIANTS as n}from"../../constructor";var i=function(){return t("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:t("circle",{cx:"8",cy:"8",r:"4"})})},o=function(){return t("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:t("path",{d:"M12.5 5L7 10.5L4 7.5",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})},c="state-icon",a=n.ACTIVE,s=n.DEFAULT,l=n.DONE;export var StateIcon=function(n){var u,m=n.variant,d=void 0===m?s:m,f=n.className,h=d===a||d===l?d:s,v=(r(u={},s,t(i,{})),r(u,a,t(i,{})),r(u,l,t(o,{})),u);return t("div",{className:e(c,"".concat(c,"--").concat(h),f),children:v[h]})};
+import React from 'react';
+import cn from 'classnames';
+
+import './StateIcon.scss';
+import { WIZARD_STEP_VARIANTS } from '../../constructor';
+
+const DefaultPoint = () => {
+  return (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none">
+      <circle cx="8" cy="8" r="4" />
+    </svg>
+  );
+};
+
+const DonePoint = () => {
+  return (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none">
+      <path d="M12.5 5L7 10.5L4 7.5" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+  );
+};
+
+const RC = 'state-icon';
+
+const { ACTIVE, DEFAULT, DONE } = WIZARD_STEP_VARIANTS;
+
+export const StateIcon = ({ variant = DEFAULT, className }) => {
+  const computedState = variant === ACTIVE || variant === DONE ? variant : DEFAULT;
+
+  const Inner = {
+    [DEFAULT]: <DefaultPoint />,
+    [ACTIVE]: <DefaultPoint />, // with styles bg
+    [DONE]: <DonePoint />,
+  };
+
+  return <div className={cn(RC, `${RC}--${computedState}`, className)}>{Inner[computedState]}</div>;
+};

package/dist/Atomic/UI/WizardStepper/ui/StateIcon/index.js

@@ -1 +1,3 @@
-import{StateIcon as t}from"./StateIcon";export default t;
+import {StateIcon} from './StateIcon';
+
+export default StateIcon;

package/dist/Atomic/UI/WizardStepper/ui/StepRow/StepRow.js

@@ -1 +1,61 @@
-import{jsx as t,jsxs as c}from"react/jsx-runtime";import"react";import a from"classnames";import e from"../StateIcon";import"./StepRow.scss";import{WIZARD_STEP_VARIANTS as n}from"../../constructor";import i from"../../../Status/Status";var o="step-row",s=n.DEFAULT,l=n.ACTIVE,r=n.DONE;export default function(n){var d=n.label,m=n.description,u=(n.className,n.isOptional),v=n.isFinished,_=n.isActive,p=n.titleSlot,f=n.contentSlot,h=n.customIcons,N=_?l:v?r:s,x=_?null==h?void 0:h.activeIcon:v?null==h?void 0:h.doneIcon:null==h?void 0:h.defaultIcon;return c("div",{className:a(o,"".concat(o,"--").concat(N)),children:[t("div",{className:a("".concat(o,"__state-point ").concat(o,"__state-point--").concat(N)),children:t(function(){var c,a;return!h||(null==(a=Object)||null==(c=a.values(h))?void 0:c.every(function(t){return!t}))?t(e,{variant:N}):x},{})}),c("div",{className:"".concat(o,"__content"),children:[c("div",{className:"".concat(o,"__title"),children:[c("div",{className:"".concat(o,"__title-left"),children:[t("div",{className:a("".concat(o,"__title-text"),{"text-muted":N===s}),children:d}),u&&t(i,{label:"Optional",status:"draft"})]}),p&&t("div",{className:"".concat(o,"__title-right"),children:p})]}),t("div",{className:"".concat(o,"__description"),children:m}),f&&t("div",{className:"".concat(o,"__body"),children:f})]})]})}
+import React from 'react';
+import cn from 'classnames';
+import StateIcon from '../StateIcon';
+
+import './StepRow.scss';
+// import Status from '../../../../../../Components/Atomic/Status/Status';
+import { WIZARD_STEP_VARIANTS } from '../../constructor';
+import Status from '../../../Status/Status';
+
+const RC = 'step-row';
+
+const {DEFAULT, ACTIVE, DONE} = WIZARD_STEP_VARIANTS;
+const StepRow = ({ label, description, className, isOptional, isFinished, isActive, titleSlot, contentSlot, customIcons }) => {
+  const title = label;
+
+  const rowVariant = (() => {
+    if (isActive) return ACTIVE;
+    if (isFinished) return DONE;
+
+    return DEFAULT;
+  })();
+
+  const alternaviteIconFromProps = (() => {
+    if (isActive) return customIcons?.activeIcon;
+    if (isFinished) return customIcons?.doneIcon;
+
+    return customIcons?.defaultIcon;
+  })();
+
+  const CorrectIcon = () => !customIcons || Object?.values(customIcons)?.every(icon => !icon) ? <StateIcon variant={rowVariant} /> : alternaviteIconFromProps;
+
+  return (
+    <div className={cn(RC, `${RC}--${rowVariant}`)}>
+      <div className={cn(`${RC}__state-point ${RC}__state-point--${rowVariant}`)}>
+        <CorrectIcon  />
+      </div>
+
+      <div className={`${RC}__content`}>
+
+        <div className={`${RC}__title`}>
+          <div className={`${RC}__title-left`}>
+          <div className={cn(`${RC}__title-text`, {'text-muted': rowVariant === DEFAULT})}>{title}</div>
+          {isOptional && <Status label={'Optional'} status="draft" />}
+
+          </div>
+
+        {titleSlot &&
+        <div className={`${RC}__title-right`}>
+        {titleSlot}
+        </div>
+        }
+        </div>
+
+        <div className={`${RC}__description`}>{description}</div>
+        {contentSlot && <div className={`${RC}__body`}>{contentSlot}</div>}
+      </div>
+    </div>
+  );
+};
+
+export default StepRow;

package/dist/Atomic/UI/WizardStepper/ui/StepRow/index.js

@@ -1 +1,3 @@
-import o from"./StepRow";export default o;
+import StepRow from './StepRow';
+
+export default StepRow;

package/dist/Atomic/UI/WizardStepper/ui/StepWrapper/StepWrapper.js

@@ -1 +1,39 @@
-function e(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},o=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(t).filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),o.forEach(function(r){var o;o=t[r],r in e?Object.defineProperty(e,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[r]=o})}return e}function r(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):(function(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t.push.apply(t,o)}return t})(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}),e}import{jsx as t,jsxs as o}from"react/jsx-runtime";import"react";import n from"../StepRow/StepRow";import"./StepWrapper.scss";import c from"classnames";import s from"../../../Box/Box";import{alternativeIconSet as p}from"../icons";export default function(i){var a=i.steps,u=i.customIcons,l=i.variant,m=i.className;if(!(null==a?void 0:a.length))throw Error("No steps provided");switch(void 0===l?"default":l){case"ghost":return o(s,{className:c("step-wrapper","step-wrapper-ghost",m),children:[null==a?void 0:a.map(function(o){return t(n,r(e({},o),{customIcons:p}),o.key)})," "]});case"cardActive":return t("div",{className:c("step-wrapper","step-wrapper-card-active",m),children:null==a?void 0:a.map(function(o){return t(n,r(e({},o),{customIcons:p}),o.key)})});default:return t("div",{className:c("step-wrapper",m),children:null==a?void 0:a.map(function(o){return t(n,r(e({},o),{customIcons:u}),o.key)})})}}
+import React from 'react'
+import StepRow from '../StepRow/StepRow'
+import './StepWrapper.scss'
+import classNames from 'classnames'
+import Box from '../../../Box/Box'
+import { alternativeIconSet, ghostIcons } from '../icons'
+
+const StepWrapper = ({
+  steps,
+  customIcons,
+  variant = 'default',
+  className
+}) => {
+  if (!steps?.length) throw new Error('No steps provided')
+
+
+  switch (variant) {
+    case 'ghost':
+      return <Box className={classNames('step-wrapper', 'step-wrapper-ghost', className)}>
+      {steps?.map((step) => (
+        <StepRow key={step.key} {...step} customIcons={alternativeIconSet} />
+      ))}{' '}
+    </Box>
+    case 'cardActive':
+      return <div className={classNames('step-wrapper', 'step-wrapper-card-active', className)}>
+      {steps?.map((step) => (
+        <StepRow key={step.key} {...step} customIcons={alternativeIconSet} />
+      ))}
+    </div>
+    default:
+      return <div className={classNames('step-wrapper', className)}>
+      {steps?.map((step) => (
+        <StepRow key={step.key} {...step} customIcons={customIcons} />
+      ))}
+    </div>
+  }
+}
+
+export default StepWrapper

package/dist/Atomic/UI/WizardStepper/ui/StepWrapper/index.js

@@ -1 +1,3 @@
-import p from"./StepWrapper";export default p;
+import StepWrapper from './StepWrapper';
+
+export default StepWrapper;

package/dist/Atomic/UI/WizardStepper/ui/icons.js

@@ -1 +1,49 @@
-import{jsx as i,jsxs as e}from"react/jsx-runtime";import"react";export var alternativeIconSet={defaultIcon:i(function(){return e("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[i("g",{clipPath:"url(#clip0_54394_4448)",children:i("circle",{cx:"10",cy:"10",r:"7",fill:"white",stroke:"#B3B8CB",strokeWidth:"2"})}),i("defs",{children:i("clipPath",{id:"clip0_54394_4448",children:i("rect",{width:"16",height:"16",fill:"white",transform:"translate(2 2)"})})})]})},{}),doneIcon:i(function(t){return e("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[i("rect",{width:"20",height:"20",rx:"10",fill:"#69A457"}),i("mask",{id:"mask0_54394_4001",style:{maskType:"alpha"},maskUnits:"userSpaceOnUse",x:"2",y:"2",width:"16",height:"16",children:i("path",{d:"M14.5 7L9 12.5L6 9.5",stroke:"black",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),i("g",{mask:"url(#mask0_54394_4001)",children:i("rect",{x:"2",y:"2",width:"16",height:"16",fill:"white"})})]})},{}),activeIcon:i(function(){return e("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[i("rect",{width:"20",height:"20",rx:"10",fill:"#E8F9E5"}),"ii",i("mask",{id:"mask0_54394_1459",style:{maskType:"alpha"},maskUnits:"userSpaceOnUse",x:"2",y:"2",width:"16",height:"16",children:i("circle",{cx:"10",cy:"10",r:"4",fill:"#171D33"})}),i("g",{mask:"url(#mask0_54394_1459)",children:i("rect",{x:"2",y:"2",width:"16",height:"16",fill:"#171D33"})})]})},{})};
+import React from 'react';
+
+const DoneIcon = (props) => <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="20" height="20" rx="10" fill="#69A457" />
+<mask id="mask0_54394_4001" style={{ maskType: 'alpha' }} maskUnits="userSpaceOnUse" x="2" y="2" width="16" height="16">
+  <path d="M14.5 7L9 12.5L6 9.5" stroke="black" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+</mask>
+<g mask="url(#mask0_54394_4001)">
+  <rect x="2" y="2" width="16" height="16" fill="white" />
+</g>
+</svg>
+
+const TodoIcon = () => {
+  return (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <g clipPath="url(#clip0_54394_4448)">
+        <circle cx="10" cy="10" r="7" fill="white" stroke="#B3B8CB" strokeWidth="2" />
+      </g>
+      <defs>
+        <clipPath id="clip0_54394_4448">
+          <rect width="16" height="16" fill="white" transform="translate(2 2)" />
+        </clipPath>
+      </defs>
+    </svg>
+
+  );
+};
+
+
+const ActiveIcon = () => {
+  return (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <rect width="20" height="20" rx="10" fill="#E8F9E5" />ii
+      <mask id="mask0_54394_1459" style={{maskType: 'alpha'}} maskUnits="userSpaceOnUse" x="2" y="2" width="16" height="16">
+        <circle cx="10" cy="10" r="4" fill="#171D33" />
+      </mask>
+      <g mask="url(#mask0_54394_1459)">
+        <rect x="2" y="2" width="16" height="16" fill="#171D33" />
+      </g>
+    </svg>
+
+  );
+};
+
+export const alternativeIconSet = {
+  defaultIcon: <TodoIcon />,
+  doneIcon: <DoneIcon />,
+  activeIcon: <ActiveIcon  />,
+}

package/dist/Atomic/UI/WizardStepper/ui/index.js

@@ -1 +1,3 @@
-import p from"./StepWrapper";export default p;
+import StepWrapper from './StepWrapper';
+
+export default StepWrapper;