@elliemae/ds-wizard 3.22.0-next.3 → 3.22.0-next.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (15) hide show
  1. package/dist/cjs/WizardStep.js.map +1 -1
  2. package/dist/cjs/WizardSteps.js.map +1 -1
  3. package/dist/cjs/index.js.map +1 -1
  4. package/dist/cjs/react-desc-prop-types.js.map +1 -1
  5. package/dist/cjs/styled.js +2 -2
  6. package/dist/cjs/styled.js.map +2 -2
  7. package/dist/cjs/useWizard.js.map +1 -1
  8. package/dist/esm/WizardStep.js.map +1 -1
  9. package/dist/esm/WizardSteps.js.map +1 -1
  10. package/dist/esm/index.js.map +1 -1
  11. package/dist/esm/react-desc-prop-types.js.map +1 -1
  12. package/dist/esm/styled.js +2 -2
  13. package/dist/esm/styled.js.map +2 -2
  14. package/dist/esm/useWizard.js.map +1 -1
  15. package/package.json +18 -13
package/dist/cjs/WizardStep.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/WizardStep.tsx", "../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../src/WizardStep.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import React, { cloneElement, useMemo, isValidElement } from 'react';\nimport { describe, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { DSWizardStepPropsTypesSchema, defaultStepProps, type DSWizardT } from './react-desc-prop-types.js';\nimport { StyledBullet, StyledBulletWrapper, StyledItem, StyledLabel, StyledWrapper } from './styled.js';\n\nconst WizardStep = (props: DSWizardT.StepProps) => {\n const { label, icon, iconCompleted, iconActive, active, completed, index } = useMemoMergePropsWithDefault(\n props,\n defaultStepProps,\n );\n\n const currentIcon = useMemo(() => {\n if (active && iconActive) return iconActive;\n if (completed && iconCompleted) return iconCompleted;\n return icon;\n }, [active, completed, icon, iconActive, iconCompleted]);\n\n const iconWithOptions = useMemo(\n () =>\n isValidElement<{ color: [string, string] }>(currentIcon)\n ? cloneElement(currentIcon, {\n color: ((currentIcon?.props as Record<string, unknown>)?.color as [string, string]) ?? [\n 'brand-primary',\n completed ? '600' : '500',\n ],\n })\n : currentIcon || index + 1,\n [completed, currentIcon, index],\n );\n\n const itemClassName = useMemo(() => {\n let className = 'em-ds-wizard-steps-indicator-step em-ds-wizard-steps-indicator-step--default';\n if (active) className += ' em-ds-wizard-steps-indicator-step--active';\n if (completed) className += ' em-ds-wizard-steps-indicator-step--completed';\n return className;\n }, [active, completed]);\n\n return (\n <StyledItem className={itemClassName} active={active} completed={completed}>\n <StyledWrapper className=\"em-ds-wizard-steps-indicator-step-wrapper\">\n <StyledBulletWrapper className=\"em-ds-wizard-steps-indicator-step__bullet-wrapper\">\n <StyledBullet className=\"em-ds-wizard-steps-indicator-step__bullet\">{iconWithOptions}</StyledBullet>\n </StyledBulletWrapper>\n <StyledLabel className=\"em-ds-wizard-steps-indicator-step__label\">{label}</StyledLabel>\n </StyledWrapper>\n </StyledItem>\n );\n};\n\nWizardStep.displayName = 'WizardStep';\nconst WizzardStepWithSchema = describe(WizardStep);\nWizzardStepWithSchema.propTypes = DSWizardStepPropsTypesSchema;\n\nexport { WizzardStepWithSchema };\nexport default WizardStep;\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuCjB;AAvCN,mBAA6D;AAC7D,8BAAuD;AACvD,mCAA+E;AAC/E,oBAA0F;AAE1F,MAAM,aAAa,CAAC,UAA+B;AACjD,QAAM,EAAE,OAAO,MAAM,eAAe,YAAY,QAAQ,WAAW,MAAM,QAAI;AAAA,IAC3E;AAAA,IACA;AAAA,EACF;AAEA,QAAM,kBAAc,sBAAQ,MAAM;AAChC,QAAI,UAAU;AAAY,aAAO;AACjC,QAAI,aAAa;AAAe,aAAO;AACvC,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,WAAW,MAAM,YAAY,aAAa,CAAC;AAEvD,QAAM,sBAAkB;AAAA,IACtB,UACE,6BAA4C,WAAW,QACnD,2BAAa,aAAa;AAAA,MACxB,OAAS,aAAa,OAAmC,SAA8B;AAAA,QACrF;AAAA,QACA,YAAY,QAAQ;AAAA,MACtB;AAAA,IACF,CAAC,IACD,eAAe,QAAQ;AAAA,IAC7B,CAAC,WAAW,aAAa,KAAK;AAAA,EAChC;AAEA,QAAM,oBAAgB,sBAAQ,MAAM;AAClC,QAAI,YAAY;AAChB,QAAI;AAAQ,mBAAa;AACzB,QAAI;AAAW,mBAAa;AAC5B,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,SAAS,CAAC;AAEtB,SACE,4CAAC,4BAAW,WAAW,eAAe,QAAgB,WACpD,uDAAC,+BAAc,WAAU,6CACvB;AAAA,gDAAC,qCAAoB,WAAU,qDAC7B,sDAAC,8BAAa,WAAU,6CAA6C,2BAAgB,GACvF;AAAA,IACA,4CAAC,6BAAY,WAAU,4CAA4C,iBAAM;AAAA,KAC3E,GACF;AAEJ;AAEA,WAAW,cAAc;AACzB,MAAM,4BAAwB,kCAAS,UAAU;AACjD,sBAAsB,YAAY;AAGlC,IAAO,qBAAQ;",
6
6
  "names": []
package/dist/cjs/WizardSteps.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/WizardSteps.tsx", "../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../src/WizardSteps.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import React, { cloneElement, useMemo } from 'react';\nimport {\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n} from '@elliemae/ds-props-helpers';\nimport WizardStep from './WizardStep.js';\nimport { DSWizardPropTypesSchema, defaultProps, type DSWizardT } from './react-desc-prop-types.js';\nimport { StyledStepsWrapper } from './styled.js';\n\nconst WizardSteps = (props: DSWizardT.Props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSWizardT.InternalProps>(props, defaultProps);\n\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n\n const globalAttributes = useGetGlobalAttributes(propsWithDefault);\n\n const { children, steps, current } = propsWithDefault;\n\n const items = useMemo(() => {\n const mergeStepProps = (index: number) => ({\n index,\n active: current === index,\n completed: index < current,\n });\n\n return steps\n ? steps.map((step, index) => <WizardStep key={index} {...step} {...mergeStepProps(index)} />)\n : React.Children.map(children, (item, index) => {\n if (item === undefined) return null;\n return cloneElement(item, mergeStepProps(index));\n });\n }, [current, children, steps]);\n\n return (\n <StyledStepsWrapper className=\"em-ds-wizard-steps-indicator\" {...xstyledProps} {...globalAttributes}>\n {items}\n </StyledStepsWrapper>\n );\n};\n\nWizardSteps.Item = WizardStep;\n\nWizardSteps.displayName = 'WizardSteps';\nconst WizzardWithSchema = describe(WizardSteps);\nWizzardWithSchema.propTypes = DSWizardPropTypesSchema;\n\nexport { WizzardWithSchema };\nexport default WizardSteps;\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4BY;AA5BnC,mBAA6C;AAC7C,8BAKO;AACP,wBAAuB;AACvB,mCAAsE;AACtE,oBAAmC;AAEnC,MAAM,cAAc,CAAC,UAA2B;AAC9C,QAAM,uBAAmB,sDAAsD,OAAO,yCAAY;AAElG,QAAM,mBAAe,4CAAmB,gBAAgB;AAExD,QAAM,uBAAmB,gDAAuB,gBAAgB;AAEhE,QAAM,EAAE,UAAU,OAAO,QAAQ,IAAI;AAErC,QAAM,YAAQ,sBAAQ,MAAM;AAC1B,UAAM,iBAAiB,CAAC,WAAmB;AAAA,MACzC;AAAA,MACA,QAAQ,YAAY;AAAA,MACpB,WAAW,QAAQ;AAAA,IACrB;AAEA,WAAO,QACH,MAAM,IAAI,CAAC,MAAM,UAAU,4CAAC,kBAAAA,SAAA,EAAwB,GAAG,MAAO,GAAG,eAAe,KAAK,KAAzC,KAA4C,CAAE,IAC1F,aAAAC,QAAM,SAAS,IAAI,UAAU,CAAC,MAAM,UAAU;AAC5C,UAAI,SAAS;AAAW,eAAO;AAC/B,iBAAO,2BAAa,MAAM,eAAe,KAAK,CAAC;AAAA,IACjD,CAAC;AAAA,EACP,GAAG,CAAC,SAAS,UAAU,KAAK,CAAC;AAE7B,SACE,4CAAC,oCAAmB,WAAU,gCAAgC,GAAG,cAAe,GAAG,kBAChF,iBACH;AAEJ;AAEA,YAAY,OAAO,kBAAAD;AAEnB,YAAY,cAAc;AAC1B,MAAM,wBAAoB,kCAAS,WAAW;AAC9C,kBAAkB,YAAY;AAG9B,IAAO,sBAAQ;",
6
6
  "names": ["WizardStep", "React"]
package/dist/cjs/index.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../src/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import WizardStepsIndicator, { WizzardWithSchema } from './WizardSteps.js';\nimport WizardStep, { WizzardStepWithSchema } from './WizardStep.js';\nimport useWizard from './useWizard.js';\n\nexport { useWizard, WizardStepsIndicator, WizardStep, WizzardWithSchema, WizzardStepWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,sCAAAA;AAAA,EAAA,+CAAAC;AAAA,EAAA;AAAA;AAAA,oCAAAC;AAAA;AAAA;ACAA,YAAuB;ADAvB,yBAAwD;AACxD,wBAAkD;AAClD,uBAAsB;",
6
6
  "names": ["WizardStep", "WizardStepsIndicator", "useWizard"]
package/dist/cjs/react-desc-prop-types.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/react-desc-prop-types.tsx", "../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../src/react-desc-prop-types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["/* eslint-disable @typescript-eslint/no-empty-interface */\nimport React from 'react';\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport type { WeakValidationMap } from 'react';\n\nexport declare namespace DSWizardT {\n export interface WizardStep {\n content: React.ComponentType;\n }\n\n export interface RequiredProps {}\n\n export interface DefaultProps {\n current: number;\n }\n\n export interface OptionalProps {\n steps?: WizardStep[];\n children?: React.ReactElement[];\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLDivElement>,\n keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | keyof XstyledProps\n >,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLDivElement>,\n keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | keyof XstyledProps\n >,\n XstyledProps,\n RequiredProps {}\n\n export interface StepProps {\n label?: string;\n icon?: React.ReactNode;\n iconCompleted?: React.ReactNode;\n iconActive?: React.ReactNode;\n active?: boolean;\n completed?: boolean;\n index?: number;\n }\n}\n\nexport const defaultProps: DSWizardT.DefaultProps = {\n current: 0,\n};\n\nexport const defaultStepProps: Required<DSWizardT.StepProps> = {\n label: '',\n icon: null,\n iconCompleted: <Checkmark />,\n iconActive: null,\n active: false,\n completed: false,\n index: 0,\n};\n\nexport const DSWizardPropTypes: DSPropTypesSchema<DSWizardT.Props> = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n current: PropTypes.number.description('Current active state index').defaultValue(0),\n steps: PropTypes.arrayOf(PropTypes.shape({})).description('Array of steps objects'),\n children: PropTypes.arrayOf(PropTypes.node).description('List of WizardStep components'),\n};\n\nexport const DSWizardPropTypesSchema = DSWizardPropTypes as unknown as WeakValidationMap<DSWizardT.Props>;\n\nexport const DSWizardStepPropsTypes = {\n label: PropTypes.string.description('Step label'),\n icon: PropTypes.oneOfType([PropTypes.element, PropTypes.string]).description('Default icon or number'),\n iconCompleted: PropTypes.element.description('Icon when the step is completed').defaultValue('Checkmark'),\n iconActive: PropTypes.element.description('Icon when the step is active'),\n active: PropTypes.bool.description('Whether the step is active or not').defaultValue(false),\n completed: PropTypes.bool.description('Whether the step is completed or not').defaultValue(false),\n index: PropTypes.number.description('Current item index'),\n};\n\nexport const DSWizardStepPropsTypesSchema = DSWizardStepPropsTypes as unknown as WeakValidationMap<DSWizardT.StepProps>;\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6DN;AA1DjB,8BAAuE;AACvE,sBAA0B;AAkDnB,MAAM,eAAuC;AAAA,EAClD,SAAS;AACX;AAEO,MAAM,mBAAkD;AAAA,EAC7D,OAAO;AAAA,EACP,MAAM;AAAA,EACN,eAAe,4CAAC,6BAAU;AAAA,EAC1B,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,OAAO;AACT;AAEO,MAAM,oBAAwD;AAAA,EACnE,GAAG;AAAA,EACH,GAAG;AAAA,EACH,SAAS,kCAAU,OAAO,YAAY,4BAA4B,EAAE,aAAa,CAAC;AAAA,EAClF,OAAO,kCAAU,QAAQ,kCAAU,MAAM,CAAC,CAAC,CAAC,EAAE,YAAY,wBAAwB;AAAA,EAClF,UAAU,kCAAU,QAAQ,kCAAU,IAAI,EAAE,YAAY,+BAA+B;AACzF;AAEO,MAAM,0BAA0B;AAEhC,MAAM,yBAAyB;AAAA,EACpC,OAAO,kCAAU,OAAO,YAAY,YAAY;AAAA,EAChD,MAAM,kCAAU,UAAU,CAAC,kCAAU,SAAS,kCAAU,MAAM,CAAC,EAAE,YAAY,wBAAwB;AAAA,EACrG,eAAe,kCAAU,QAAQ,YAAY,iCAAiC,EAAE,aAAa,WAAW;AAAA,EACxG,YAAY,kCAAU,QAAQ,YAAY,8BAA8B;AAAA,EACxE,QAAQ,kCAAU,KAAK,YAAY,mCAAmC,EAAE,aAAa,KAAK;AAAA,EAC1F,WAAW,kCAAU,KAAK,YAAY,sCAAsC,EAAE,aAAa,KAAK;AAAA,EAChG,OAAO,kCAAU,OAAO,YAAY,oBAAoB;AAC1D;AAEO,MAAM,+BAA+B;",
6
6
  "names": []
package/dist/cjs/styled.js CHANGED
@@ -61,11 +61,11 @@ const StyledBulletWrapper = import_ds_system.styled.div`
61
61
  width: 100%;
62
62
  `;
63
63
  const StyledBullet = import_ds_system.styled.div`
64
- margin: space(xs);
64
+ margin: 8px;
65
+ font-size: 1.2307rem;
65
66
  width: 2.46154rem;
66
67
  height: 2.46154rem;
67
68
  border-radius: 50%;
68
- font-size: font-size(600);
69
69
  border: 1px solid #cbcfd7;
70
70
  color: brand-600;
71
71
  position: relative;
package/dist/cjs/styled.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/styled.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { styled, th, xStyledCommonProps } from '@elliemae/ds-system';\n\nexport const StyledWrapper = styled.div`\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n`;\nexport const StyledLabel = styled.span`\n font-size: 1.0769rem;\n line-height: normal;\n font-weight: 400;\n color: neutral-500;\n transition: all 200ms cubic-bezier(0.36, 0, 1, 1);\n text-align: center;\n width: 100%;\n max-height: 36px;\n`;\nexport const StyledBulletWrapper = styled.div`\n display: flex;\n justify-content: center;\n position: relative;\n width: 100%;\n`;\nexport const StyledBullet = styled.div`\n margin: space(xs);\n width: 2.46154rem;\n height: 2.46154rem;\n border-radius: 50%;\n font-size: font-size(600);\n border: 1px solid #cbcfd7;\n color: brand-600;\n position: relative;\n transition: all 200ms cubic-bezier(0.36, 0, 1, 1);\n display: flex;\n justify-content: center;\n align-items: center;\n`;\nexport const StyledItem = styled.div<{ active: boolean; completed: boolean }>`\n display: flex;\n justify-content: center;\n flex: 1 1 0px;\n min-width: 96px;\n max-width: 144px;\n margin: 0 8px;\n\n &:not(:last-child) {\n ${StyledBulletWrapper}::after {\n margin: 0 5px;\n position: absolute;\n top: 50%;\n left: calc(62%);\n display: block;\n width: 80%;\n content: '';\n transition: all 300ms cubic-bezier(0.36, 0, 1, 1);\n height: 1px;\n background-image: linear-gradient(to right, #cbcfd7 40%, rgba(255, 255, 255, 0) 0%);\n background-position: top;\n background-size: 3px 1px;\n background-repeat: repeat-x;\n }\n }\n\n ${({ active, theme }) => {\n if (!active) return '';\n return `\n ${StyledBullet} {\n border-color: ${th.color('brand-700')({ theme })};\n color: ${th.color('brand-700')({ theme })};\n font-weight: bold;\n border-width: 1.5px;\n }\n ${StyledLabel} {\n color: ${th.color('brand-700')({ theme })};\n font-weight: bold;\n }\n `;\n }}\n\n ${({ completed, theme }) => {\n if (!completed) return '';\n return `\n ${StyledBullet} {\n border-color: ${th.color('brand-600')({ theme })};\n }\n ${StyledLabel} {\n color: ${th.color('neutral-800')({ theme })};\n }\n &:not(:last-child) {\n ${StyledBulletWrapper}::after {\n background: ${th.color('brand-700')({ theme })};\n background-size: initial;\n }\n }\n `;\n }}\n`;\n\nexport const StyledStepsWrapper = styled.div`\n display: flex;\n justify-content: center;\n overflow: hidden;\n ${xStyledCommonProps}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
3
+ "sources": ["../../src/styled.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import { styled, th, xStyledCommonProps } from '@elliemae/ds-system';\n\nexport const StyledWrapper = styled.div`\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n`;\nexport const StyledLabel = styled.span`\n font-size: 1.0769rem;\n line-height: normal;\n font-weight: 400;\n color: neutral-500;\n transition: all 200ms cubic-bezier(0.36, 0, 1, 1);\n text-align: center;\n width: 100%;\n max-height: 36px;\n`;\nexport const StyledBulletWrapper = styled.div`\n display: flex;\n justify-content: center;\n position: relative;\n width: 100%;\n`;\nexport const StyledBullet = styled.div`\n margin: 8px;\n font-size: 1.2307rem;\n width: 2.46154rem;\n height: 2.46154rem;\n border-radius: 50%;\n border: 1px solid #cbcfd7;\n color: brand-600;\n position: relative;\n transition: all 200ms cubic-bezier(0.36, 0, 1, 1);\n display: flex;\n justify-content: center;\n align-items: center;\n`;\nexport const StyledItem = styled.div<{ active: boolean; completed: boolean }>`\n display: flex;\n justify-content: center;\n flex: 1 1 0px;\n min-width: 96px;\n max-width: 144px;\n margin: 0 8px;\n\n &:not(:last-child) {\n ${StyledBulletWrapper}::after {\n margin: 0 5px;\n position: absolute;\n top: 50%;\n left: calc(62%);\n display: block;\n width: 80%;\n content: '';\n transition: all 300ms cubic-bezier(0.36, 0, 1, 1);\n height: 1px;\n background-image: linear-gradient(to right, #cbcfd7 40%, rgba(255, 255, 255, 0) 0%);\n background-position: top;\n background-size: 3px 1px;\n background-repeat: repeat-x;\n }\n }\n\n ${({ active, theme }) => {\n if (!active) return '';\n return `\n ${StyledBullet} {\n border-color: ${th.color('brand-700')({ theme })};\n color: ${th.color('brand-700')({ theme })};\n font-weight: bold;\n border-width: 1.5px;\n }\n ${StyledLabel} {\n color: ${th.color('brand-700')({ theme })};\n font-weight: bold;\n }\n `;\n }}\n\n ${({ completed, theme }) => {\n if (!completed) return '';\n return `\n ${StyledBullet} {\n border-color: ${th.color('brand-600')({ theme })};\n }\n ${StyledLabel} {\n color: ${th.color('neutral-800')({ theme })};\n }\n &:not(:last-child) {\n ${StyledBulletWrapper}::after {\n background: ${th.color('brand-700')({ theme })};\n background-size: initial;\n }\n }\n `;\n }}\n`;\n\nexport const StyledStepsWrapper = styled.div`\n display: flex;\n justify-content: center;\n overflow: hidden;\n ${xStyledCommonProps}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAA+C;AAExC,MAAM,gBAAgB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAM7B,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAU3B,MAAM,sBAAsB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAMnC,MAAM,eAAe,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAc5B,MAAM,aAAa,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAS3B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAiBF,CAAC,EAAE,QAAQ,MAAM,MAAM;AACvB,MAAI,CAAC;AAAQ,WAAO;AACpB,SAAO;AAAA,MACL;AAAA,sBACgB,oBAAG,MAAM,WAAW,EAAE,EAAE,MAAM,CAAC;AAAA,eACtC,oBAAG,MAAM,WAAW,EAAE,EAAE,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA,MAIxC;AAAA,eACS,oBAAG,MAAM,WAAW,EAAE,EAAE,MAAM,CAAC;AAAA;AAAA;AAAA;AAI5C;AAAA;AAAA,IAEE,CAAC,EAAE,WAAW,MAAM,MAAM;AAC1B,MAAI,CAAC;AAAW,WAAO;AACvB,SAAO;AAAA,QACH;AAAA,wBACgB,oBAAG,MAAM,WAAW,EAAE,EAAE,MAAM,CAAC;AAAA;AAAA,QAE/C;AAAA,iBACS,oBAAG,MAAM,aAAa,EAAE,EAAE,MAAM,CAAC;AAAA;AAAA;AAAA,UAGxC;AAAA,wBACc,oBAAG,MAAM,WAAW,EAAE,EAAE,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAKrD;AAAA;AAGK,MAAM,qBAAqB,wBAAO;AAAA;AAAA;AAAA;AAAA,IAIrC;AAAA;",
6
6
  "names": []
7
7
  }
package/dist/cjs/useWizard.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/useWizard.tsx", "../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../src/useWizard.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import { useEffect, useCallback, useState } from 'react';\nimport type { DSWizardT } from './react-desc-prop-types.js';\n\nconst checkCanNext = (prevIndex: number, array: DSWizardT.WizardStep[]): boolean => array.length > prevIndex + 1;\nconst checkCanPrevious = (prevIndex: number): boolean => prevIndex - 1 >= 0;\n\nconst noop = () => null;\n\ninterface WizardConfig<T extends DSWizardT.WizardStep> {\n steps: T[];\n current?: number;\n onNext?: (currentStep: number) => void;\n onPrevious?: (currentStep: number) => void;\n initial?: number;\n}\n\nexport default function useWizard<T extends DSWizardT.WizardStep>({\n steps: wizardSteps,\n current,\n onNext = noop,\n onPrevious = noop,\n initial = 0,\n}: WizardConfig<T>) {\n const [currentStep, setCurrentStep] = useState(initial);\n\n useEffect(() => {\n if (typeof current !== 'undefined') setCurrentStep(current);\n }, [current]);\n\n const handleNext = useCallback(() => {\n if (checkCanNext(currentStep, wizardSteps)) {\n onNext(currentStep);\n setCurrentStep(currentStep + 1);\n }\n }, [currentStep, wizardSteps, onNext]);\n\n const handlePrevious = useCallback(() => {\n if (checkCanPrevious(currentStep)) {\n onPrevious(currentStep);\n setCurrentStep(currentStep - 1);\n }\n }, [currentStep, onPrevious]);\n\n return {\n current: currentStep,\n next: handleNext,\n previous: handlePrevious,\n canNext: checkCanNext(currentStep, wizardSteps),\n canPrevious: checkCanPrevious(currentStep),\n WizardCurrentContent: wizardSteps[currentStep]?.content,\n };\n}\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAiD;AAGjD,MAAM,eAAe,CAAC,WAAmB,UAA2C,MAAM,SAAS,YAAY;AAC/G,MAAM,mBAAmB,CAAC,cAA+B,YAAY,KAAK;AAE1E,MAAM,OAAO,MAAM;AAUJ,SAAR,UAA2D;AAAA,EAChE,OAAO;AAAA,EACP;AAAA,EACA,SAAS;AAAA,EACT,aAAa;AAAA,EACb,UAAU;AACZ,GAAoB;AAClB,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,OAAO;AAEtD,8BAAU,MAAM;AACd,QAAI,OAAO,YAAY;AAAa,qBAAe,OAAO;AAAA,EAC5D,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,iBAAa,0BAAY,MAAM;AACnC,QAAI,aAAa,aAAa,WAAW,GAAG;AAC1C,aAAO,WAAW;AAClB,qBAAe,cAAc,CAAC;AAAA,IAChC;AAAA,EACF,GAAG,CAAC,aAAa,aAAa,MAAM,CAAC;AAErC,QAAM,qBAAiB,0BAAY,MAAM;AACvC,QAAI,iBAAiB,WAAW,GAAG;AACjC,iBAAW,WAAW;AACtB,qBAAe,cAAc,CAAC;AAAA,IAChC;AAAA,EACF,GAAG,CAAC,aAAa,UAAU,CAAC;AAE5B,SAAO;AAAA,IACL,SAAS;AAAA,IACT,MAAM;AAAA,IACN,UAAU;AAAA,IACV,SAAS,aAAa,aAAa,WAAW;AAAA,IAC9C,aAAa,iBAAiB,WAAW;AAAA,IACzC,sBAAsB,YAAY,WAAW,GAAG;AAAA,EAClD;AACF;",
6
6
  "names": []
package/dist/esm/WizardStep.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/WizardStep.tsx"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/WizardStep.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { cloneElement, useMemo, isValidElement } from 'react';\nimport { describe, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { DSWizardStepPropsTypesSchema, defaultStepProps, type DSWizardT } from './react-desc-prop-types.js';\nimport { StyledBullet, StyledBulletWrapper, StyledItem, StyledLabel, StyledWrapper } from './styled.js';\n\nconst WizardStep = (props: DSWizardT.StepProps) => {\n const { label, icon, iconCompleted, iconActive, active, completed, index } = useMemoMergePropsWithDefault(\n props,\n defaultStepProps,\n );\n\n const currentIcon = useMemo(() => {\n if (active && iconActive) return iconActive;\n if (completed && iconCompleted) return iconCompleted;\n return icon;\n }, [active, completed, icon, iconActive, iconCompleted]);\n\n const iconWithOptions = useMemo(\n () =>\n isValidElement<{ color: [string, string] }>(currentIcon)\n ? cloneElement(currentIcon, {\n color: ((currentIcon?.props as Record<string, unknown>)?.color as [string, string]) ?? [\n 'brand-primary',\n completed ? '600' : '500',\n ],\n })\n : currentIcon || index + 1,\n [completed, currentIcon, index],\n );\n\n const itemClassName = useMemo(() => {\n let className = 'em-ds-wizard-steps-indicator-step em-ds-wizard-steps-indicator-step--default';\n if (active) className += ' em-ds-wizard-steps-indicator-step--active';\n if (completed) className += ' em-ds-wizard-steps-indicator-step--completed';\n return className;\n }, [active, completed]);\n\n return (\n <StyledItem className={itemClassName} active={active} completed={completed}>\n <StyledWrapper className=\"em-ds-wizard-steps-indicator-step-wrapper\">\n <StyledBulletWrapper className=\"em-ds-wizard-steps-indicator-step__bullet-wrapper\">\n <StyledBullet className=\"em-ds-wizard-steps-indicator-step__bullet\">{iconWithOptions}</StyledBullet>\n </StyledBulletWrapper>\n <StyledLabel className=\"em-ds-wizard-steps-indicator-step__label\">{label}</StyledLabel>\n </StyledWrapper>\n </StyledItem>\n );\n};\n\nWizardStep.displayName = 'WizardStep';\nconst WizzardStepWithSchema = describe(WizardStep);\nWizzardStepWithSchema.propTypes = DSWizardStepPropsTypesSchema;\n\nexport { WizzardStepWithSchema };\nexport default WizardStep;\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACuCjB,SAEI,KAFJ;AAvCN,SAAgB,cAAc,SAAS,sBAAsB;AAC7D,SAAS,UAAU,oCAAoC;AACvD,SAAS,8BAA8B,wBAAwC;AAC/E,SAAS,cAAc,qBAAqB,YAAY,aAAa,qBAAqB;AAE1F,MAAM,aAAa,CAAC,UAA+B;AACjD,QAAM,EAAE,OAAO,MAAM,eAAe,YAAY,QAAQ,WAAW,MAAM,IAAI;AAAA,IAC3E;AAAA,IACA;AAAA,EACF;AAEA,QAAM,cAAc,QAAQ,MAAM;AAChC,QAAI,UAAU;AAAY,aAAO;AACjC,QAAI,aAAa;AAAe,aAAO;AACvC,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,WAAW,MAAM,YAAY,aAAa,CAAC;AAEvD,QAAM,kBAAkB;AAAA,IACtB,MACE,eAA4C,WAAW,IACnD,aAAa,aAAa;AAAA,MACxB,OAAS,aAAa,OAAmC,SAA8B;AAAA,QACrF;AAAA,QACA,YAAY,QAAQ;AAAA,MACtB;AAAA,IACF,CAAC,IACD,eAAe,QAAQ;AAAA,IAC7B,CAAC,WAAW,aAAa,KAAK;AAAA,EAChC;AAEA,QAAM,gBAAgB,QAAQ,MAAM;AAClC,QAAI,YAAY;AAChB,QAAI;AAAQ,mBAAa;AACzB,QAAI;AAAW,mBAAa;AAC5B,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,SAAS,CAAC;AAEtB,SACE,oBAAC,cAAW,WAAW,eAAe,QAAgB,WACpD,+BAAC,iBAAc,WAAU,6CACvB;AAAA,wBAAC,uBAAoB,WAAU,qDAC7B,8BAAC,gBAAa,WAAU,6CAA6C,2BAAgB,GACvF;AAAA,IACA,oBAAC,eAAY,WAAU,4CAA4C,iBAAM;AAAA,KAC3E,GACF;AAEJ;AAEA,WAAW,cAAc;AACzB,MAAM,wBAAwB,SAAS,UAAU;AACjD,sBAAsB,YAAY;AAGlC,IAAO,qBAAQ;",
6
6
  "names": []
package/dist/esm/WizardSteps.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/WizardSteps.tsx"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/WizardSteps.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { cloneElement, useMemo } from 'react';\nimport {\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n} from '@elliemae/ds-props-helpers';\nimport WizardStep from './WizardStep.js';\nimport { DSWizardPropTypesSchema, defaultProps, type DSWizardT } from './react-desc-prop-types.js';\nimport { StyledStepsWrapper } from './styled.js';\n\nconst WizardSteps = (props: DSWizardT.Props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSWizardT.InternalProps>(props, defaultProps);\n\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n\n const globalAttributes = useGetGlobalAttributes(propsWithDefault);\n\n const { children, steps, current } = propsWithDefault;\n\n const items = useMemo(() => {\n const mergeStepProps = (index: number) => ({\n index,\n active: current === index,\n completed: index < current,\n });\n\n return steps\n ? steps.map((step, index) => <WizardStep key={index} {...step} {...mergeStepProps(index)} />)\n : React.Children.map(children, (item, index) => {\n if (item === undefined) return null;\n return cloneElement(item, mergeStepProps(index));\n });\n }, [current, children, steps]);\n\n return (\n <StyledStepsWrapper className=\"em-ds-wizard-steps-indicator\" {...xstyledProps} {...globalAttributes}>\n {items}\n </StyledStepsWrapper>\n );\n};\n\nWizardSteps.Item = WizardStep;\n\nWizardSteps.displayName = 'WizardSteps';\nconst WizzardWithSchema = describe(WizardSteps);\nWizzardWithSchema.propTypes = DSWizardPropTypesSchema;\n\nexport { WizzardWithSchema };\nexport default WizardSteps;\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;AC4BY;AA5BnC,OAAOA,UAAS,cAAc,eAAe;AAC7C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,OAAO,gBAAgB;AACvB,SAAS,yBAAyB,oBAAoC;AACtE,SAAS,0BAA0B;AAEnC,MAAM,cAAc,CAAC,UAA2B;AAC9C,QAAM,mBAAmB,6BAAsD,OAAO,YAAY;AAElG,QAAM,eAAe,mBAAmB,gBAAgB;AAExD,QAAM,mBAAmB,uBAAuB,gBAAgB;AAEhE,QAAM,EAAE,UAAU,OAAO,QAAQ,IAAI;AAErC,QAAM,QAAQ,QAAQ,MAAM;AAC1B,UAAM,iBAAiB,CAAC,WAAmB;AAAA,MACzC;AAAA,MACA,QAAQ,YAAY;AAAA,MACpB,WAAW,QAAQ;AAAA,IACrB;AAEA,WAAO,QACH,MAAM,IAAI,CAAC,MAAM,UAAU,oBAAC,cAAwB,GAAG,MAAO,GAAG,eAAe,KAAK,KAAzC,KAA4C,CAAE,IAC1FA,OAAM,SAAS,IAAI,UAAU,CAAC,MAAM,UAAU;AAC5C,UAAI,SAAS;AAAW,eAAO;AAC/B,aAAO,aAAa,MAAM,eAAe,KAAK,CAAC;AAAA,IACjD,CAAC;AAAA,EACP,GAAG,CAAC,SAAS,UAAU,KAAK,CAAC;AAE7B,SACE,oBAAC,sBAAmB,WAAU,gCAAgC,GAAG,cAAe,GAAG,kBAChF,iBACH;AAEJ;AAEA,YAAY,OAAO;AAEnB,YAAY,cAAc;AAC1B,MAAM,oBAAoB,SAAS,WAAW;AAC9C,kBAAkB,YAAY;AAG9B,IAAO,sBAAQ;",
6
6
  "names": ["React"]
package/dist/esm/index.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import WizardStepsIndicator, { WizzardWithSchema } from './WizardSteps.js';\nimport WizardStep, { WizzardStepWithSchema } from './WizardStep.js';\nimport useWizard from './useWizard.js';\n\nexport { useWizard, WizardStepsIndicator, WizardStep, WizzardWithSchema, WizzardStepWithSchema };\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAO,wBAAwB,yBAAyB;AACxD,OAAO,cAAc,6BAA6B;AAClD,OAAO,eAAe;",
6
6
  "names": []
package/dist/esm/react-desc-prop-types.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-empty-interface */\nimport React from 'react';\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport type { WeakValidationMap } from 'react';\n\nexport declare namespace DSWizardT {\n export interface WizardStep {\n content: React.ComponentType;\n }\n\n export interface RequiredProps {}\n\n export interface DefaultProps {\n current: number;\n }\n\n export interface OptionalProps {\n steps?: WizardStep[];\n children?: React.ReactElement[];\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLDivElement>,\n keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | keyof XstyledProps\n >,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLDivElement>,\n keyof DefaultProps | keyof OptionalProps | keyof RequiredProps | keyof XstyledProps\n >,\n XstyledProps,\n RequiredProps {}\n\n export interface StepProps {\n label?: string;\n icon?: React.ReactNode;\n iconCompleted?: React.ReactNode;\n iconActive?: React.ReactNode;\n active?: boolean;\n completed?: boolean;\n index?: number;\n }\n}\n\nexport const defaultProps: DSWizardT.DefaultProps = {\n current: 0,\n};\n\nexport const defaultStepProps: Required<DSWizardT.StepProps> = {\n label: '',\n icon: null,\n iconCompleted: <Checkmark />,\n iconActive: null,\n active: false,\n completed: false,\n index: 0,\n};\n\nexport const DSWizardPropTypes: DSPropTypesSchema<DSWizardT.Props> = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n current: PropTypes.number.description('Current active state index').defaultValue(0),\n steps: PropTypes.arrayOf(PropTypes.shape({})).description('Array of steps objects'),\n children: PropTypes.arrayOf(PropTypes.node).description('List of WizardStep components'),\n};\n\nexport const DSWizardPropTypesSchema = DSWizardPropTypes as unknown as WeakValidationMap<DSWizardT.Props>;\n\nexport const DSWizardStepPropsTypes = {\n label: PropTypes.string.description('Step label'),\n icon: PropTypes.oneOfType([PropTypes.element, PropTypes.string]).description('Default icon or number'),\n iconCompleted: PropTypes.element.description('Icon when the step is completed').defaultValue('Checkmark'),\n iconActive: PropTypes.element.description('Icon when the step is active'),\n active: PropTypes.bool.description('Whether the step is active or not').defaultValue(false),\n completed: PropTypes.bool.description('Whether the step is completed or not').defaultValue(false),\n index: PropTypes.number.description('Current item index'),\n};\n\nexport const DSWizardStepPropsTypesSchema = DSWizardStepPropsTypes as unknown as WeakValidationMap<DSWizardT.StepProps>;\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;AC6DN;AA1DjB,SAAS,WAAW,2BAA2B,wBAAwB;AACvE,SAAS,iBAAiB;AAkDnB,MAAM,eAAuC;AAAA,EAClD,SAAS;AACX;AAEO,MAAM,mBAAkD;AAAA,EAC7D,OAAO;AAAA,EACP,MAAM;AAAA,EACN,eAAe,oBAAC,aAAU;AAAA,EAC1B,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,OAAO;AACT;AAEO,MAAM,oBAAwD;AAAA,EACnE,GAAG;AAAA,EACH,GAAG;AAAA,EACH,SAAS,UAAU,OAAO,YAAY,4BAA4B,EAAE,aAAa,CAAC;AAAA,EAClF,OAAO,UAAU,QAAQ,UAAU,MAAM,CAAC,CAAC,CAAC,EAAE,YAAY,wBAAwB;AAAA,EAClF,UAAU,UAAU,QAAQ,UAAU,IAAI,EAAE,YAAY,+BAA+B;AACzF;AAEO,MAAM,0BAA0B;AAEhC,MAAM,yBAAyB;AAAA,EACpC,OAAO,UAAU,OAAO,YAAY,YAAY;AAAA,EAChD,MAAM,UAAU,UAAU,CAAC,UAAU,SAAS,UAAU,MAAM,CAAC,EAAE,YAAY,wBAAwB;AAAA,EACrG,eAAe,UAAU,QAAQ,YAAY,iCAAiC,EAAE,aAAa,WAAW;AAAA,EACxG,YAAY,UAAU,QAAQ,YAAY,8BAA8B;AAAA,EACxE,QAAQ,UAAU,KAAK,YAAY,mCAAmC,EAAE,aAAa,KAAK;AAAA,EAC1F,WAAW,UAAU,KAAK,YAAY,sCAAsC,EAAE,aAAa,KAAK;AAAA,EAChG,OAAO,UAAU,OAAO,YAAY,oBAAoB;AAC1D;AAEO,MAAM,+BAA+B;",
6
6
  "names": []
package/dist/esm/styled.js CHANGED
@@ -23,11 +23,11 @@ const StyledBulletWrapper = styled.div`
23
23
  width: 100%;
24
24
  `;
25
25
  const StyledBullet = styled.div`
26
- margin: space(xs);
26
+ margin: 8px;
27
+ font-size: 1.2307rem;
27
28
  width: 2.46154rem;
28
29
  height: 2.46154rem;
29
30
  border-radius: 50%;
30
- font-size: font-size(600);
31
31
  border: 1px solid #cbcfd7;
32
32
  color: brand-600;
33
33
  position: relative;
package/dist/esm/styled.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styled.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, th, xStyledCommonProps } from '@elliemae/ds-system';\n\nexport const StyledWrapper = styled.div`\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n`;\nexport const StyledLabel = styled.span`\n font-size: 1.0769rem;\n line-height: normal;\n font-weight: 400;\n color: neutral-500;\n transition: all 200ms cubic-bezier(0.36, 0, 1, 1);\n text-align: center;\n width: 100%;\n max-height: 36px;\n`;\nexport const StyledBulletWrapper = styled.div`\n display: flex;\n justify-content: center;\n position: relative;\n width: 100%;\n`;\nexport const StyledBullet = styled.div`\n margin: space(xs);\n width: 2.46154rem;\n height: 2.46154rem;\n border-radius: 50%;\n font-size: font-size(600);\n border: 1px solid #cbcfd7;\n color: brand-600;\n position: relative;\n transition: all 200ms cubic-bezier(0.36, 0, 1, 1);\n display: flex;\n justify-content: center;\n align-items: center;\n`;\nexport const StyledItem = styled.div<{ active: boolean; completed: boolean }>`\n display: flex;\n justify-content: center;\n flex: 1 1 0px;\n min-width: 96px;\n max-width: 144px;\n margin: 0 8px;\n\n &:not(:last-child) {\n ${StyledBulletWrapper}::after {\n margin: 0 5px;\n position: absolute;\n top: 50%;\n left: calc(62%);\n display: block;\n width: 80%;\n content: '';\n transition: all 300ms cubic-bezier(0.36, 0, 1, 1);\n height: 1px;\n background-image: linear-gradient(to right, #cbcfd7 40%, rgba(255, 255, 255, 0) 0%);\n background-position: top;\n background-size: 3px 1px;\n background-repeat: repeat-x;\n }\n }\n\n ${({ active, theme }) => {\n if (!active) return '';\n return `\n ${StyledBullet} {\n border-color: ${th.color('brand-700')({ theme })};\n color: ${th.color('brand-700')({ theme })};\n font-weight: bold;\n border-width: 1.5px;\n }\n ${StyledLabel} {\n color: ${th.color('brand-700')({ theme })};\n font-weight: bold;\n }\n `;\n }}\n\n ${({ completed, theme }) => {\n if (!completed) return '';\n return `\n ${StyledBullet} {\n border-color: ${th.color('brand-600')({ theme })};\n }\n ${StyledLabel} {\n color: ${th.color('neutral-800')({ theme })};\n }\n &:not(:last-child) {\n ${StyledBulletWrapper}::after {\n background: ${th.color('brand-700')({ theme })};\n background-size: initial;\n }\n }\n `;\n }}\n`;\n\nexport const StyledStepsWrapper = styled.div`\n display: flex;\n justify-content: center;\n overflow: hidden;\n ${xStyledCommonProps}\n`;\n"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/styled.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, th, xStyledCommonProps } from '@elliemae/ds-system';\n\nexport const StyledWrapper = styled.div`\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n`;\nexport const StyledLabel = styled.span`\n font-size: 1.0769rem;\n line-height: normal;\n font-weight: 400;\n color: neutral-500;\n transition: all 200ms cubic-bezier(0.36, 0, 1, 1);\n text-align: center;\n width: 100%;\n max-height: 36px;\n`;\nexport const StyledBulletWrapper = styled.div`\n display: flex;\n justify-content: center;\n position: relative;\n width: 100%;\n`;\nexport const StyledBullet = styled.div`\n margin: 8px;\n font-size: 1.2307rem;\n width: 2.46154rem;\n height: 2.46154rem;\n border-radius: 50%;\n border: 1px solid #cbcfd7;\n color: brand-600;\n position: relative;\n transition: all 200ms cubic-bezier(0.36, 0, 1, 1);\n display: flex;\n justify-content: center;\n align-items: center;\n`;\nexport const StyledItem = styled.div<{ active: boolean; completed: boolean }>`\n display: flex;\n justify-content: center;\n flex: 1 1 0px;\n min-width: 96px;\n max-width: 144px;\n margin: 0 8px;\n\n &:not(:last-child) {\n ${StyledBulletWrapper}::after {\n margin: 0 5px;\n position: absolute;\n top: 50%;\n left: calc(62%);\n display: block;\n width: 80%;\n content: '';\n transition: all 300ms cubic-bezier(0.36, 0, 1, 1);\n height: 1px;\n background-image: linear-gradient(to right, #cbcfd7 40%, rgba(255, 255, 255, 0) 0%);\n background-position: top;\n background-size: 3px 1px;\n background-repeat: repeat-x;\n }\n }\n\n ${({ active, theme }) => {\n if (!active) return '';\n return `\n ${StyledBullet} {\n border-color: ${th.color('brand-700')({ theme })};\n color: ${th.color('brand-700')({ theme })};\n font-weight: bold;\n border-width: 1.5px;\n }\n ${StyledLabel} {\n color: ${th.color('brand-700')({ theme })};\n font-weight: bold;\n }\n `;\n }}\n\n ${({ completed, theme }) => {\n if (!completed) return '';\n return `\n ${StyledBullet} {\n border-color: ${th.color('brand-600')({ theme })};\n }\n ${StyledLabel} {\n color: ${th.color('neutral-800')({ theme })};\n }\n &:not(:last-child) {\n ${StyledBulletWrapper}::after {\n background: ${th.color('brand-700')({ theme })};\n background-size: initial;\n }\n }\n `;\n }}\n`;\n\nexport const StyledStepsWrapper = styled.div`\n display: flex;\n justify-content: center;\n overflow: hidden;\n ${xStyledCommonProps}\n`;\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,QAAQ,IAAI,0BAA0B;AAExC,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAM7B,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAU3B,MAAM,sBAAsB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAMnC,MAAM,eAAe,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAc5B,MAAM,aAAa,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAS3B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAiBF,CAAC,EAAE,QAAQ,MAAM,MAAM;AACvB,MAAI,CAAC;AAAQ,WAAO;AACpB,SAAO;AAAA,MACL;AAAA,sBACgB,GAAG,MAAM,WAAW,EAAE,EAAE,MAAM,CAAC;AAAA,eACtC,GAAG,MAAM,WAAW,EAAE,EAAE,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA,MAIxC;AAAA,eACS,GAAG,MAAM,WAAW,EAAE,EAAE,MAAM,CAAC;AAAA;AAAA;AAAA;AAI5C;AAAA;AAAA,IAEE,CAAC,EAAE,WAAW,MAAM,MAAM;AAC1B,MAAI,CAAC;AAAW,WAAO;AACvB,SAAO;AAAA,QACH;AAAA,wBACgB,GAAG,MAAM,WAAW,EAAE,EAAE,MAAM,CAAC;AAAA;AAAA,QAE/C;AAAA,iBACS,GAAG,MAAM,aAAa,EAAE,EAAE,MAAM,CAAC;AAAA;AAAA;AAAA,UAGxC;AAAA,wBACc,GAAG,MAAM,WAAW,EAAE,EAAE,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAKrD;AAAA;AAGK,MAAM,qBAAqB,OAAO;AAAA;AAAA;AAAA;AAAA,IAIrC;AAAA;",
6
6
  "names": []
7
7
  }
package/dist/esm/useWizard.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/useWizard.tsx"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/useWizard.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useEffect, useCallback, useState } from 'react';\nimport type { DSWizardT } from './react-desc-prop-types.js';\n\nconst checkCanNext = (prevIndex: number, array: DSWizardT.WizardStep[]): boolean => array.length > prevIndex + 1;\nconst checkCanPrevious = (prevIndex: number): boolean => prevIndex - 1 >= 0;\n\nconst noop = () => null;\n\ninterface WizardConfig<T extends DSWizardT.WizardStep> {\n steps: T[];\n current?: number;\n onNext?: (currentStep: number) => void;\n onPrevious?: (currentStep: number) => void;\n initial?: number;\n}\n\nexport default function useWizard<T extends DSWizardT.WizardStep>({\n steps: wizardSteps,\n current,\n onNext = noop,\n onPrevious = noop,\n initial = 0,\n}: WizardConfig<T>) {\n const [currentStep, setCurrentStep] = useState(initial);\n\n useEffect(() => {\n if (typeof current !== 'undefined') setCurrentStep(current);\n }, [current]);\n\n const handleNext = useCallback(() => {\n if (checkCanNext(currentStep, wizardSteps)) {\n onNext(currentStep);\n setCurrentStep(currentStep + 1);\n }\n }, [currentStep, wizardSteps, onNext]);\n\n const handlePrevious = useCallback(() => {\n if (checkCanPrevious(currentStep)) {\n onPrevious(currentStep);\n setCurrentStep(currentStep - 1);\n }\n }, [currentStep, onPrevious]);\n\n return {\n current: currentStep,\n next: handleNext,\n previous: handlePrevious,\n canNext: checkCanNext(currentStep, wizardSteps),\n canPrevious: checkCanPrevious(currentStep),\n WizardCurrentContent: wizardSteps[currentStep]?.content,\n };\n}\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,WAAW,aAAa,gBAAgB;AAGjD,MAAM,eAAe,CAAC,WAAmB,UAA2C,MAAM,SAAS,YAAY;AAC/G,MAAM,mBAAmB,CAAC,cAA+B,YAAY,KAAK;AAE1E,MAAM,OAAO,MAAM;AAUJ,SAAR,UAA2D;AAAA,EAChE,OAAO;AAAA,EACP;AAAA,EACA,SAAS;AAAA,EACT,aAAa;AAAA,EACb,UAAU;AACZ,GAAoB;AAClB,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,OAAO;AAEtD,YAAU,MAAM;AACd,QAAI,OAAO,YAAY;AAAa,qBAAe,OAAO;AAAA,EAC5D,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,aAAa,YAAY,MAAM;AACnC,QAAI,aAAa,aAAa,WAAW,GAAG;AAC1C,aAAO,WAAW;AAClB,qBAAe,cAAc,CAAC;AAAA,IAChC;AAAA,EACF,GAAG,CAAC,aAAa,aAAa,MAAM,CAAC;AAErC,QAAM,iBAAiB,YAAY,MAAM;AACvC,QAAI,iBAAiB,WAAW,GAAG;AACjC,iBAAW,WAAW;AACtB,qBAAe,cAAc,CAAC;AAAA,IAChC;AAAA,EACF,GAAG,CAAC,aAAa,UAAU,CAAC;AAE5B,SAAO;AAAA,IACL,SAAS;AAAA,IACT,MAAM;AAAA,IACN,UAAU;AAAA,IACV,SAAS,aAAa,aAAa,WAAW;AAAA,IAC9C,aAAa,iBAAiB,WAAW;AAAA,IACzC,sBAAsB,YAAY,WAAW,GAAG;AAAA,EAClD;AACF;",
6
6
  "names": []
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-wizard",
3
- "version": "3.22.0-next.3",
3
+ "version": "3.22.0-next.30",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Wizard",
6
6
  "files": [
@@ -55,14 +55,19 @@
55
55
  "indent": 4
56
56
  },
57
57
  "dependencies": {
58
- "@elliemae/ds-classnames": "3.22.0-next.3",
59
- "@elliemae/ds-icons": "3.22.0-next.3",
60
- "@elliemae/ds-props-helpers": "3.22.0-next.3",
61
- "@elliemae/ds-utilities": "3.22.0-next.3"
58
+ "@elliemae/ds-classnames": "3.22.0-next.30",
59
+ "@elliemae/ds-system": "3.22.0-next.30",
60
+ "@elliemae/ds-props-helpers": "3.22.0-next.30",
61
+ "@elliemae/ds-icons": "3.22.0-next.30",
62
+ "@elliemae/ds-utilities": "3.22.0-next.30"
62
63
  },
63
64
  "devDependencies": {
64
- "@elliemae/pui-cli": "~9.0.0-next.17",
65
- "@elliemae/ds-monorepo-devops": "3.22.0-next.3"
65
+ "@elliemae/pui-cli": "~9.0.0-next.22",
66
+ "@testing-library/jest-dom": "~5.16.5",
67
+ "@testing-library/react": "~12.1.3",
68
+ "@testing-library/user-event": "~13.5.0",
69
+ "jest-axe": "^7.0.1",
70
+ "@elliemae/ds-monorepo-devops": "3.22.0-next.30"
66
71
  },
67
72
  "peerDependencies": {
68
73
  "lodash": "^4.17.21",
@@ -74,14 +79,14 @@
74
79
  "typeSafety": false
75
80
  },
76
81
  "scripts": {
77
- "dev": "cross-env NODE_ENV=development node ../../scripts/build/build.mjs --watch",
82
+ "dev": "cross-env NODE_ENV=development node ../../../scripts/build/build.mjs --watch",
78
83
  "test": "pui-cli test --passWithNoTests",
79
- "lint": "node ../../scripts/lint.mjs",
80
- "eslint:fix": "eslint --ext='.js,.jsx,.test.js,.ts,.tsx' --fix --config='../../.eslintrc.js' src/",
81
- "dts": "node ../../scripts/dts.mjs",
82
- "build": "cross-env NODE_ENV=production node ../../scripts/build/build.mjs",
84
+ "lint": "node ../../../scripts/lint.mjs",
85
+ "eslint:fix": "eslint --ext='.js,.jsx,.test.js,.ts,.tsx' --fix --config='../../../.eslintrc.js' src/",
86
+ "dts": "node ../../../scripts/dts.mjs",
87
+ "build": "cross-env NODE_ENV=production node ../../../scripts/build/build.mjs",
83
88
  "dev:build": "pnpm --filter {.}... build",
84
89
  "dev:install": "pnpm --filter {.}... i --no-lockfile && pnpm run dev:build",
85
- "checkDeps": "npm exec ../ds-codemods -- check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
90
+ "checkDeps": "npm exec ../../util/ds-codemods -- check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
86
91
  }
87
92
  }