@transferwise/components 46.50.0 → 46.51.0

package/build/dateLookup/dateHeader/DateHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateHeader.js","sources":["../../../src/dateLookup/dateHeader/DateHeader.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useIntl } from 'react-intl';\n\nimport Chevron from '../../chevron';\nimport { Position, Size, Typography } from '../../common';\nimport { useLayout } from '../../common/hooks';\nimport Title from '../../title';\nimport messages from '../DateLookup.messages';\n\nconst buttonClasses = 'btn-link p-a-0 text-no-decoration np-text-body-large-bold rounded-sm';\n\ninterface DateHeaderProps {\n  label?: string;\n  onLabelClick?: () => void;\n  onPreviousClick: () => void;\n  onNextClick: () => void;\n  dateMode: string;\n}\n\nconst DateHeader: React.FC<DateHeaderProps> = ({\n  label,\n  onLabelClick,\n  onPreviousClick,\n  onNextClick,\n  dateMode,\n}) => {\n  const intl = useIntl();\n  const { isMobile } = useLayout();\n  return (\n    <div className={classNames('text-xs-center', !isMobile && ['clearfix', 'p-y-1'])}>\n      <div className=\"pull-left-single-direction\">\n        <button\n          type=\"button\"\n          className={`d-inline-flex ${buttonClasses}`}\n          aria-label={`${intl.formatMessage(messages.previous)} ${dateMode}`}\n          onClick={onPreviousClick}\n        >\n          <Chevron\n            orientation={Position.LEFT}\n            className=\"left-single-direction\"\n            size={Size.MEDIUM}\n          />\n        </button>\n      </div>\n      {label && (\n        <Title type={Typography.TITLE_BODY} className=\"tw-date-lookup-header-current-container\">\n          <button\n            type=\"button\"\n            className={`tw-date-lookup-header-current ${buttonClasses}`}\n            aria-label={intl.formatMessage(messages.goTo20YearView)}\n            onClick={onLabelClick}\n          >\n            {label}\n          </button>\n        </Title>\n      )}\n      <div className=\"pull-right-single-direction\">\n        <button\n          type=\"button\"\n          className={`d-inline-flex ${buttonClasses}`}\n          aria-label={`${useIntl().formatMessage(messages.next)} ${dateMode}`}\n          onClick={onNextClick}\n        >\n          <Chevron\n            orientation={Position.RIGHT}\n            className=\"right-single-direction\"\n            size={Size.MEDIUM}\n          />\n        </button>\n      </div>\n    </div>\n  );\n};\n\nexport default DateHeader;\n"],"names":["buttonClasses","DateHeader","label","onLabelClick","onPreviousClick","onNextClick","dateMode","intl","useIntl","isMobile","useLayout","_jsxs","className","classNames","children","_jsx","type","formatMessage","messages","previous","onClick","Chevron","orientation","Position","LEFT","size","Size","MEDIUM","Title","Typography","TITLE_BODY","goTo20YearView","next","RIGHT"],"mappings":";;;;;;;;;;;;;;;;;AASA,MAAMA,aAAa,GAAG,sEAAsE,CAAA;AAUtFC,MAAAA,UAAU,GAA8BA,CAAC;EAC7CC,KAAK;EACLC,YAAY;EACZC,eAAe;EACfC,WAAW;AACXC,EAAAA,QAAAA;AAAQ,CACT,KAAI;AACH,EAAA,MAAMC,IAAI,GAAGC,iBAAO,EAAE,CAAA;EACtB,MAAM;AAAEC,IAAAA,QAAAA;GAAU,GAAGC,mBAAS,EAAE,CAAA;AAChC,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAEC,2BAAU,CAAC,gBAAgB,EAAE,CAACJ,QAAQ,IAAI,CAAC,UAAU,EAAE,OAAO,CAAC,CAAE;AAAAK,IAAAA,QAAA,gBAC/EC,cAAA,CAAA,KAAA,EAAA;AAAKH,MAAAA,SAAS,EAAC,4BAA4B;AAAAE,MAAAA,QAAA,eACzCC,cAAA,CAAA,QAAA,EAAA;AACEC,QAAAA,IAAI,EAAC,QAAQ;QACbJ,SAAS,EAAE,CAAiBZ,cAAAA,EAAAA,aAAa,CAAG,CAAA;QAC5C,YAAY,EAAA,CAAA,EAAGO,IAAI,CAACU,aAAa,CAACC,mBAAQ,CAACC,QAAQ,CAAC,CAAIb,CAAAA,EAAAA,QAAQ,CAAG,CAAA;AACnEc,QAAAA,OAAO,EAAEhB,eAAgB;QAAAU,QAAA,eAEzBC,cAAA,CAACM,OAAO,EAAA;UACNC,WAAW,EAAEC,iBAAQ,CAACC,IAAK;AAC3BZ,UAAAA,SAAS,EAAC,uBAAuB;UACjCa,IAAI,EAAEC,SAAI,CAACC,MAAAA;SAEf,CAAA;OAAQ,CAAA;AACV,KAAK,CACL,EAACzB,KAAK,iBACJa,cAAA,CAACa,KAAK,EAAA;MAACZ,IAAI,EAAEa,qBAAU,CAACC,UAAW;AAAClB,MAAAA,SAAS,EAAC,yCAAyC;AAAAE,MAAAA,QAAA,eACrFC,cAAA,CAAA,QAAA,EAAA;AACEC,QAAAA,IAAI,EAAC,QAAQ;QACbJ,SAAS,EAAE,CAAiCZ,8BAAAA,EAAAA,aAAa,CAAG,CAAA;AAC5D,QAAA,YAAA,EAAYO,IAAI,CAACU,aAAa,CAACC,mBAAQ,CAACa,cAAc,CAAE;AACxDX,QAAAA,OAAO,EAAEjB,YAAa;AAAAW,QAAAA,QAAA,EAErBZ,KAAAA;OACK,CAAA;KACH,CACR,eACDa,cAAA,CAAA,KAAA,EAAA;AAAKH,MAAAA,SAAS,EAAC,6BAA6B;AAAAE,MAAAA,QAAA,eAC1CC,cAAA,CAAA,QAAA,EAAA;AACEC,QAAAA,IAAI,EAAC,QAAQ;QACbJ,SAAS,EAAE,CAAiBZ,cAAAA,EAAAA,aAAa,CAAG,CAAA;AAC5C,QAAA,YAAA,EAAY,CAAGQ,EAAAA,iBAAO,EAAE,CAACS,aAAa,CAACC,mBAAQ,CAACc,IAAI,CAAC,CAAA,CAAA,EAAI1B,QAAQ,CAAG,CAAA;AACpEc,QAAAA,OAAO,EAAEf,WAAY;QAAAS,QAAA,eAErBC,cAAA,CAACM,OAAO,EAAA;UACNC,WAAW,EAAEC,iBAAQ,CAACU,KAAM;AAC5BrB,UAAAA,SAAS,EAAC,wBAAwB;UAClCa,IAAI,EAAEC,SAAI,CAACC,MAAAA;SAEf,CAAA;OAAQ,CAAA;AACV,KAAK,CACP,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV;;;;"}
+{"version":3,"file":"DateHeader.js","sources":["../../../src/dateLookup/dateHeader/DateHeader.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useIntl } from 'react-intl';\n\nimport Chevron from '../../chevron';\nimport { Position, Size, Typography } from '../../common';\nimport { useLayout } from '../../common/hooks';\nimport Title from '../../title';\nimport messages from '../DateLookup.messages';\n\nconst buttonClasses = 'btn-link p-a-0 text-no-decoration np-text-body-large-bold rounded-sm';\n\ninterface DateHeaderProps {\n  label?: string;\n  onLabelClick?: () => void;\n  onPreviousClick: () => void;\n  onNextClick: () => void;\n  dateMode: string;\n}\n\nconst DateHeader: React.FC<DateHeaderProps> = ({\n  label,\n  onLabelClick,\n  onPreviousClick,\n  onNextClick,\n  dateMode,\n}) => {\n  const intl = useIntl();\n  const { isMobile } = useLayout();\n  return (\n    <div className={clsx('text-xs-center', !isMobile && ['clearfix', 'p-y-1'])}>\n      <div className=\"pull-left-single-direction\">\n        <button\n          type=\"button\"\n          className={`d-inline-flex ${buttonClasses}`}\n          aria-label={`${intl.formatMessage(messages.previous)} ${dateMode}`}\n          onClick={onPreviousClick}\n        >\n          <Chevron\n            orientation={Position.LEFT}\n            className=\"left-single-direction\"\n            size={Size.MEDIUM}\n          />\n        </button>\n      </div>\n      {label && (\n        <Title type={Typography.TITLE_BODY} className=\"tw-date-lookup-header-current-container\">\n          <button\n            type=\"button\"\n            className={`tw-date-lookup-header-current ${buttonClasses}`}\n            aria-label={intl.formatMessage(messages.goTo20YearView)}\n            onClick={onLabelClick}\n          >\n            {label}\n          </button>\n        </Title>\n      )}\n      <div className=\"pull-right-single-direction\">\n        <button\n          type=\"button\"\n          className={`d-inline-flex ${buttonClasses}`}\n          aria-label={`${useIntl().formatMessage(messages.next)} ${dateMode}`}\n          onClick={onNextClick}\n        >\n          <Chevron\n            orientation={Position.RIGHT}\n            className=\"right-single-direction\"\n            size={Size.MEDIUM}\n          />\n        </button>\n      </div>\n    </div>\n  );\n};\n\nexport default DateHeader;\n"],"names":["buttonClasses","DateHeader","label","onLabelClick","onPreviousClick","onNextClick","dateMode","intl","useIntl","isMobile","useLayout","_jsxs","className","clsx","children","_jsx","type","formatMessage","messages","previous","onClick","Chevron","orientation","Position","LEFT","size","Size","MEDIUM","Title","Typography","TITLE_BODY","goTo20YearView","next","RIGHT"],"mappings":";;;;;;;;;;;;;AASA,MAAMA,aAAa,GAAG,sEAAsE,CAAA;AAUtFC,MAAAA,UAAU,GAA8BA,CAAC;EAC7CC,KAAK;EACLC,YAAY;EACZC,eAAe;EACfC,WAAW;AACXC,EAAAA,QAAAA;AAAQ,CACT,KAAI;AACH,EAAA,MAAMC,IAAI,GAAGC,iBAAO,EAAE,CAAA;EACtB,MAAM;AAAEC,IAAAA,QAAAA;GAAU,GAAGC,mBAAS,EAAE,CAAA;AAChC,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAEC,SAAI,CAAC,gBAAgB,EAAE,CAACJ,QAAQ,IAAI,CAAC,UAAU,EAAE,OAAO,CAAC,CAAE;AAAAK,IAAAA,QAAA,gBACzEC,cAAA,CAAA,KAAA,EAAA;AAAKH,MAAAA,SAAS,EAAC,4BAA4B;AAAAE,MAAAA,QAAA,eACzCC,cAAA,CAAA,QAAA,EAAA;AACEC,QAAAA,IAAI,EAAC,QAAQ;QACbJ,SAAS,EAAE,CAAiBZ,cAAAA,EAAAA,aAAa,CAAG,CAAA;QAC5C,YAAY,EAAA,CAAA,EAAGO,IAAI,CAACU,aAAa,CAACC,mBAAQ,CAACC,QAAQ,CAAC,CAAIb,CAAAA,EAAAA,QAAQ,CAAG,CAAA;AACnEc,QAAAA,OAAO,EAAEhB,eAAgB;QAAAU,QAAA,eAEzBC,cAAA,CAACM,OAAO,EAAA;UACNC,WAAW,EAAEC,iBAAQ,CAACC,IAAK;AAC3BZ,UAAAA,SAAS,EAAC,uBAAuB;UACjCa,IAAI,EAAEC,SAAI,CAACC,MAAAA;SAEf,CAAA;OAAQ,CAAA;AACV,KAAK,CACL,EAACzB,KAAK,iBACJa,cAAA,CAACa,KAAK,EAAA;MAACZ,IAAI,EAAEa,qBAAU,CAACC,UAAW;AAAClB,MAAAA,SAAS,EAAC,yCAAyC;AAAAE,MAAAA,QAAA,eACrFC,cAAA,CAAA,QAAA,EAAA;AACEC,QAAAA,IAAI,EAAC,QAAQ;QACbJ,SAAS,EAAE,CAAiCZ,8BAAAA,EAAAA,aAAa,CAAG,CAAA;AAC5D,QAAA,YAAA,EAAYO,IAAI,CAACU,aAAa,CAACC,mBAAQ,CAACa,cAAc,CAAE;AACxDX,QAAAA,OAAO,EAAEjB,YAAa;AAAAW,QAAAA,QAAA,EAErBZ,KAAAA;OACK,CAAA;KACH,CACR,eACDa,cAAA,CAAA,KAAA,EAAA;AAAKH,MAAAA,SAAS,EAAC,6BAA6B;AAAAE,MAAAA,QAAA,eAC1CC,cAAA,CAAA,QAAA,EAAA;AACEC,QAAAA,IAAI,EAAC,QAAQ;QACbJ,SAAS,EAAE,CAAiBZ,cAAAA,EAAAA,aAAa,CAAG,CAAA;AAC5C,QAAA,YAAA,EAAY,CAAGQ,EAAAA,iBAAO,EAAE,CAACS,aAAa,CAACC,mBAAQ,CAACc,IAAI,CAAC,CAAA,CAAA,EAAI1B,QAAQ,CAAG,CAAA;AACpEc,QAAAA,OAAO,EAAEf,WAAY;QAAAS,QAAA,eAErBC,cAAA,CAACM,OAAO,EAAA;UACNC,WAAW,EAAEC,iBAAQ,CAACU,KAAM;AAC5BrB,UAAAA,SAAS,EAAC,wBAAwB;UAClCa,IAAI,EAAEC,SAAI,CAACC,MAAAA;SAEf,CAAA;OAAQ,CAAA;AACV,KAAK,CACP,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV;;;;"}

package/build/dateLookup/dateHeader/DateHeader.mjs

@@ -1,4 +1,4 @@
-import classNames from 'classnames';
+import { clsx } from 'clsx';
 import { useIntl } from 'react-intl';
 import Chevron from '../../chevron/Chevron.mjs';
 import Title from '../../title/Title.mjs';
@@ -22,7 +22,7 @@ const DateHeader = ({
     isMobile
   } = useLayout();
   return /*#__PURE__*/jsxs("div", {
-    className: classNames('text-xs-center', !isMobile && ['clearfix', 'p-y-1']),
+    className: clsx('text-xs-center', !isMobile && ['clearfix', 'p-y-1']),
     children: [/*#__PURE__*/jsx("div", {
       className: "pull-left-single-direction",
       children: /*#__PURE__*/jsx("button", {

package/build/dateLookup/dateHeader/DateHeader.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DateHeader.mjs","sources":["../../../src/dateLookup/dateHeader/DateHeader.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useIntl } from 'react-intl';\n\nimport Chevron from '../../chevron';\nimport { Position, Size, Typography } from '../../common';\nimport { useLayout } from '../../common/hooks';\nimport Title from '../../title';\nimport messages from '../DateLookup.messages';\n\nconst buttonClasses = 'btn-link p-a-0 text-no-decoration np-text-body-large-bold rounded-sm';\n\ninterface DateHeaderProps {\n  label?: string;\n  onLabelClick?: () => void;\n  onPreviousClick: () => void;\n  onNextClick: () => void;\n  dateMode: string;\n}\n\nconst DateHeader: React.FC<DateHeaderProps> = ({\n  label,\n  onLabelClick,\n  onPreviousClick,\n  onNextClick,\n  dateMode,\n}) => {\n  const intl = useIntl();\n  const { isMobile } = useLayout();\n  return (\n    <div className={classNames('text-xs-center', !isMobile && ['clearfix', 'p-y-1'])}>\n      <div className=\"pull-left-single-direction\">\n        <button\n          type=\"button\"\n          className={`d-inline-flex ${buttonClasses}`}\n          aria-label={`${intl.formatMessage(messages.previous)} ${dateMode}`}\n          onClick={onPreviousClick}\n        >\n          <Chevron\n            orientation={Position.LEFT}\n            className=\"left-single-direction\"\n            size={Size.MEDIUM}\n          />\n        </button>\n      </div>\n      {label && (\n        <Title type={Typography.TITLE_BODY} className=\"tw-date-lookup-header-current-container\">\n          <button\n            type=\"button\"\n            className={`tw-date-lookup-header-current ${buttonClasses}`}\n            aria-label={intl.formatMessage(messages.goTo20YearView)}\n            onClick={onLabelClick}\n          >\n            {label}\n          </button>\n        </Title>\n      )}\n      <div className=\"pull-right-single-direction\">\n        <button\n          type=\"button\"\n          className={`d-inline-flex ${buttonClasses}`}\n          aria-label={`${useIntl().formatMessage(messages.next)} ${dateMode}`}\n          onClick={onNextClick}\n        >\n          <Chevron\n            orientation={Position.RIGHT}\n            className=\"right-single-direction\"\n            size={Size.MEDIUM}\n          />\n        </button>\n      </div>\n    </div>\n  );\n};\n\nexport default DateHeader;\n"],"names":["buttonClasses","DateHeader","label","onLabelClick","onPreviousClick","onNextClick","dateMode","intl","useIntl","isMobile","useLayout","_jsxs","className","classNames","children","_jsx","type","formatMessage","messages","previous","onClick","Chevron","orientation","Position","LEFT","size","Size","MEDIUM","Title","Typography","TITLE_BODY","goTo20YearView","next","RIGHT"],"mappings":";;;;;;;;;;;AASA,MAAMA,aAAa,GAAG,sEAAsE,CAAA;AAUtFC,MAAAA,UAAU,GAA8BA,CAAC;EAC7CC,KAAK;EACLC,YAAY;EACZC,eAAe;EACfC,WAAW;AACXC,EAAAA,QAAAA;AAAQ,CACT,KAAI;AACH,EAAA,MAAMC,IAAI,GAAGC,OAAO,EAAE,CAAA;EACtB,MAAM;AAAEC,IAAAA,QAAAA;GAAU,GAAGC,SAAS,EAAE,CAAA;AAChC,EAAA,oBACEC,IAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAEC,UAAU,CAAC,gBAAgB,EAAE,CAACJ,QAAQ,IAAI,CAAC,UAAU,EAAE,OAAO,CAAC,CAAE;AAAAK,IAAAA,QAAA,gBAC/EC,GAAA,CAAA,KAAA,EAAA;AAAKH,MAAAA,SAAS,EAAC,4BAA4B;AAAAE,MAAAA,QAAA,eACzCC,GAAA,CAAA,QAAA,EAAA;AACEC,QAAAA,IAAI,EAAC,QAAQ;QACbJ,SAAS,EAAE,CAAiBZ,cAAAA,EAAAA,aAAa,CAAG,CAAA;QAC5C,YAAY,EAAA,CAAA,EAAGO,IAAI,CAACU,aAAa,CAACC,QAAQ,CAACC,QAAQ,CAAC,CAAIb,CAAAA,EAAAA,QAAQ,CAAG,CAAA;AACnEc,QAAAA,OAAO,EAAEhB,eAAgB;QAAAU,QAAA,eAEzBC,GAAA,CAACM,OAAO,EAAA;UACNC,WAAW,EAAEC,QAAQ,CAACC,IAAK;AAC3BZ,UAAAA,SAAS,EAAC,uBAAuB;UACjCa,IAAI,EAAEC,IAAI,CAACC,MAAAA;SAEf,CAAA;OAAQ,CAAA;AACV,KAAK,CACL,EAACzB,KAAK,iBACJa,GAAA,CAACa,KAAK,EAAA;MAACZ,IAAI,EAAEa,UAAU,CAACC,UAAW;AAAClB,MAAAA,SAAS,EAAC,yCAAyC;AAAAE,MAAAA,QAAA,eACrFC,GAAA,CAAA,QAAA,EAAA;AACEC,QAAAA,IAAI,EAAC,QAAQ;QACbJ,SAAS,EAAE,CAAiCZ,8BAAAA,EAAAA,aAAa,CAAG,CAAA;AAC5D,QAAA,YAAA,EAAYO,IAAI,CAACU,aAAa,CAACC,QAAQ,CAACa,cAAc,CAAE;AACxDX,QAAAA,OAAO,EAAEjB,YAAa;AAAAW,QAAAA,QAAA,EAErBZ,KAAAA;OACK,CAAA;KACH,CACR,eACDa,GAAA,CAAA,KAAA,EAAA;AAAKH,MAAAA,SAAS,EAAC,6BAA6B;AAAAE,MAAAA,QAAA,eAC1CC,GAAA,CAAA,QAAA,EAAA;AACEC,QAAAA,IAAI,EAAC,QAAQ;QACbJ,SAAS,EAAE,CAAiBZ,cAAAA,EAAAA,aAAa,CAAG,CAAA;AAC5C,QAAA,YAAA,EAAY,CAAGQ,EAAAA,OAAO,EAAE,CAACS,aAAa,CAACC,QAAQ,CAACc,IAAI,CAAC,CAAA,CAAA,EAAI1B,QAAQ,CAAG,CAAA;AACpEc,QAAAA,OAAO,EAAEf,WAAY;QAAAS,QAAA,eAErBC,GAAA,CAACM,OAAO,EAAA;UACNC,WAAW,EAAEC,QAAQ,CAACU,KAAM;AAC5BrB,UAAAA,SAAS,EAAC,wBAAwB;UAClCa,IAAI,EAAEC,IAAI,CAACC,MAAAA;SAEf,CAAA;OAAQ,CAAA;AACV,KAAK,CACP,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV;;;;"}
+{"version":3,"file":"DateHeader.mjs","sources":["../../../src/dateLookup/dateHeader/DateHeader.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useIntl } from 'react-intl';\n\nimport Chevron from '../../chevron';\nimport { Position, Size, Typography } from '../../common';\nimport { useLayout } from '../../common/hooks';\nimport Title from '../../title';\nimport messages from '../DateLookup.messages';\n\nconst buttonClasses = 'btn-link p-a-0 text-no-decoration np-text-body-large-bold rounded-sm';\n\ninterface DateHeaderProps {\n  label?: string;\n  onLabelClick?: () => void;\n  onPreviousClick: () => void;\n  onNextClick: () => void;\n  dateMode: string;\n}\n\nconst DateHeader: React.FC<DateHeaderProps> = ({\n  label,\n  onLabelClick,\n  onPreviousClick,\n  onNextClick,\n  dateMode,\n}) => {\n  const intl = useIntl();\n  const { isMobile } = useLayout();\n  return (\n    <div className={clsx('text-xs-center', !isMobile && ['clearfix', 'p-y-1'])}>\n      <div className=\"pull-left-single-direction\">\n        <button\n          type=\"button\"\n          className={`d-inline-flex ${buttonClasses}`}\n          aria-label={`${intl.formatMessage(messages.previous)} ${dateMode}`}\n          onClick={onPreviousClick}\n        >\n          <Chevron\n            orientation={Position.LEFT}\n            className=\"left-single-direction\"\n            size={Size.MEDIUM}\n          />\n        </button>\n      </div>\n      {label && (\n        <Title type={Typography.TITLE_BODY} className=\"tw-date-lookup-header-current-container\">\n          <button\n            type=\"button\"\n            className={`tw-date-lookup-header-current ${buttonClasses}`}\n            aria-label={intl.formatMessage(messages.goTo20YearView)}\n            onClick={onLabelClick}\n          >\n            {label}\n          </button>\n        </Title>\n      )}\n      <div className=\"pull-right-single-direction\">\n        <button\n          type=\"button\"\n          className={`d-inline-flex ${buttonClasses}`}\n          aria-label={`${useIntl().formatMessage(messages.next)} ${dateMode}`}\n          onClick={onNextClick}\n        >\n          <Chevron\n            orientation={Position.RIGHT}\n            className=\"right-single-direction\"\n            size={Size.MEDIUM}\n          />\n        </button>\n      </div>\n    </div>\n  );\n};\n\nexport default DateHeader;\n"],"names":["buttonClasses","DateHeader","label","onLabelClick","onPreviousClick","onNextClick","dateMode","intl","useIntl","isMobile","useLayout","_jsxs","className","clsx","children","_jsx","type","formatMessage","messages","previous","onClick","Chevron","orientation","Position","LEFT","size","Size","MEDIUM","Title","Typography","TITLE_BODY","goTo20YearView","next","RIGHT"],"mappings":";;;;;;;;;;;AASA,MAAMA,aAAa,GAAG,sEAAsE,CAAA;AAUtFC,MAAAA,UAAU,GAA8BA,CAAC;EAC7CC,KAAK;EACLC,YAAY;EACZC,eAAe;EACfC,WAAW;AACXC,EAAAA,QAAAA;AAAQ,CACT,KAAI;AACH,EAAA,MAAMC,IAAI,GAAGC,OAAO,EAAE,CAAA;EACtB,MAAM;AAAEC,IAAAA,QAAAA;GAAU,GAAGC,SAAS,EAAE,CAAA;AAChC,EAAA,oBACEC,IAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAEC,IAAI,CAAC,gBAAgB,EAAE,CAACJ,QAAQ,IAAI,CAAC,UAAU,EAAE,OAAO,CAAC,CAAE;AAAAK,IAAAA,QAAA,gBACzEC,GAAA,CAAA,KAAA,EAAA;AAAKH,MAAAA,SAAS,EAAC,4BAA4B;AAAAE,MAAAA,QAAA,eACzCC,GAAA,CAAA,QAAA,EAAA;AACEC,QAAAA,IAAI,EAAC,QAAQ;QACbJ,SAAS,EAAE,CAAiBZ,cAAAA,EAAAA,aAAa,CAAG,CAAA;QAC5C,YAAY,EAAA,CAAA,EAAGO,IAAI,CAACU,aAAa,CAACC,QAAQ,CAACC,QAAQ,CAAC,CAAIb,CAAAA,EAAAA,QAAQ,CAAG,CAAA;AACnEc,QAAAA,OAAO,EAAEhB,eAAgB;QAAAU,QAAA,eAEzBC,GAAA,CAACM,OAAO,EAAA;UACNC,WAAW,EAAEC,QAAQ,CAACC,IAAK;AAC3BZ,UAAAA,SAAS,EAAC,uBAAuB;UACjCa,IAAI,EAAEC,IAAI,CAACC,MAAAA;SAEf,CAAA;OAAQ,CAAA;AACV,KAAK,CACL,EAACzB,KAAK,iBACJa,GAAA,CAACa,KAAK,EAAA;MAACZ,IAAI,EAAEa,UAAU,CAACC,UAAW;AAAClB,MAAAA,SAAS,EAAC,yCAAyC;AAAAE,MAAAA,QAAA,eACrFC,GAAA,CAAA,QAAA,EAAA;AACEC,QAAAA,IAAI,EAAC,QAAQ;QACbJ,SAAS,EAAE,CAAiCZ,8BAAAA,EAAAA,aAAa,CAAG,CAAA;AAC5D,QAAA,YAAA,EAAYO,IAAI,CAACU,aAAa,CAACC,QAAQ,CAACa,cAAc,CAAE;AACxDX,QAAAA,OAAO,EAAEjB,YAAa;AAAAW,QAAAA,QAAA,EAErBZ,KAAAA;OACK,CAAA;KACH,CACR,eACDa,GAAA,CAAA,KAAA,EAAA;AAAKH,MAAAA,SAAS,EAAC,6BAA6B;AAAAE,MAAAA,QAAA,eAC1CC,GAAA,CAAA,QAAA,EAAA;AACEC,QAAAA,IAAI,EAAC,QAAQ;QACbJ,SAAS,EAAE,CAAiBZ,cAAAA,EAAAA,aAAa,CAAG,CAAA;AAC5C,QAAA,YAAA,EAAY,CAAGQ,EAAAA,OAAO,EAAE,CAACS,aAAa,CAACC,QAAQ,CAACc,IAAI,CAAC,CAAA,CAAA,EAAI1B,QAAQ,CAAG,CAAA;AACpEc,QAAAA,OAAO,EAAEf,WAAY;QAAAS,QAAA,eAErBC,GAAA,CAACM,OAAO,EAAA;UACNC,WAAW,EAAEC,QAAQ,CAACU,KAAM;AAC5BrB,UAAAA,SAAS,EAAC,wBAAwB;UAClCa,IAAI,EAAEC,IAAI,CAACC,MAAAA;SAEf,CAAA;OAAQ,CAAA;AACV,KAAK,CACP,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV;;;;"}

package/build/dateLookup/tableLink/TableLink.js

@@ -1,15 +1,11 @@
 'use strict';
 
-var classNames = require('classnames');
+var clsx = require('clsx');
 var React = require('react');
 var reactIntl = require('react-intl');
 var DateLookup_messages = require('../DateLookup.messages.js');
 var jsxRuntime = require('react/jsx-runtime');
 
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var classNames__default = /*#__PURE__*/_interopDefault(classNames);
-
 const TableLink = ({
   item,
   type,
@@ -42,22 +38,20 @@ const TableLink = ({
     }
     return longTitle || title;
   };
-  return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
-    children: /*#__PURE__*/jsxRuntime.jsx("button", {
-      ref: buttonRef,
-      type: "button",
-      className: classNames__default.default(`tw-date-lookup-${type}-option np-text-body-default-bold`, {
-        active: !!active
-      }, {
-        today: !!today
-      }),
-      disabled: disabled,
-      tabIndex: autofocus ? 0 : -1,
-      "aria-label": calculateAriaLabel(),
-      "aria-pressed": active,
-      onClick: onCalendarClick,
-      children: title || item
-    })
+  return /*#__PURE__*/jsxRuntime.jsx("button", {
+    ref: buttonRef,
+    type: "button",
+    className: clsx.clsx(`tw-date-lookup-${type}-option np-text-body-default-bold`, {
+      active: !!active
+    }, {
+      today: !!today
+    }),
+    disabled: disabled,
+    tabIndex: autofocus ? 0 : -1,
+    "aria-label": calculateAriaLabel(),
+    "aria-pressed": active,
+    onClick: onCalendarClick,
+    children: title || item
   });
 };
 

package/build/dateLookup/tableLink/TableLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableLink.js","sources":["../../../src/dateLookup/tableLink/TableLink.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useEffect, useRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport messages from '../DateLookup.messages';\n\ninterface TableLinkProps {\n  item: number;\n  type: 'day' | 'month' | 'year';\n  title?: string;\n  longTitle?: string;\n  active: boolean;\n  disabled: boolean;\n  today: boolean;\n  autofocus?: boolean;\n  onClick: (item: number) => void;\n}\n\nconst TableLink = ({\n  item,\n  type,\n  title,\n  longTitle,\n  active,\n  disabled,\n  today,\n  autofocus,\n  onClick,\n}: TableLinkProps) => {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const intl = useIntl();\n\n  useEffect(() => {\n    if (autofocus) {\n      setTimeout(() => {\n        buttonRef.current?.focus();\n      }, 0);\n    }\n  }, [autofocus]);\n\n  const onCalendarClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    event.preventDefault();\n    if (!disabled) {\n      onClick(item);\n    }\n  };\n\n  const calculateAriaLabel = () => {\n    if (active) {\n      return `${longTitle || title || ''}, ${intl.formatMessage(\n        messages.selected,\n      )} ${intl.formatMessage(messages[type])}`;\n    }\n    return longTitle || title;\n  };\n\n  return (\n    <>\n      <button\n        ref={buttonRef}\n        type=\"button\"\n        className={classNames(\n          `tw-date-lookup-${type}-option np-text-body-default-bold`,\n          { active: !!active },\n          { today: !!today },\n        )}\n        disabled={disabled}\n        tabIndex={autofocus ? 0 : -1}\n        aria-label={calculateAriaLabel()}\n        aria-pressed={active}\n        onClick={onCalendarClick}\n      >\n        {title || item}\n      </button>\n    </>\n  );\n};\n\nexport default TableLink;\n"],"names":["TableLink","item","type","title","longTitle","active","disabled","today","autofocus","onClick","buttonRef","useRef","intl","useIntl","useEffect","setTimeout","current","focus","onCalendarClick","event","preventDefault","calculateAriaLabel","formatMessage","messages","selected","_jsx","_Fragment","children","ref","className","classNames","tabIndex"],"mappings":";;;;;;;;;;;;AAkBMA,MAAAA,SAAS,GAAGA,CAAC;EACjBC,IAAI;EACJC,IAAI;EACJC,KAAK;EACLC,SAAS;EACTC,MAAM;EACNC,QAAQ;EACRC,KAAK;EACLC,SAAS;AACTC,EAAAA,OAAAA;AACe,CAAA,KAAI;AACnB,EAAA,MAAMC,SAAS,GAAGC,YAAM,CAAoB,IAAI,CAAC,CAAA;AACjD,EAAA,MAAMC,IAAI,GAAGC,iBAAO,EAAE,CAAA;AAEtBC,EAAAA,eAAS,CAAC,MAAK;AACb,IAAA,IAAIN,SAAS,EAAE;AACbO,MAAAA,UAAU,CAAC,MAAK;AACdL,QAAAA,SAAS,CAACM,OAAO,EAAEC,KAAK,EAAE,CAAA;OAC3B,EAAE,CAAC,CAAC,CAAA;AACP,KAAA;AACF,GAAC,EAAE,CAACT,SAAS,CAAC,CAAC,CAAA;EAEf,MAAMU,eAAe,GAAIC,KAA0C,IAAI;IACrEA,KAAK,CAACC,cAAc,EAAE,CAAA;IACtB,IAAI,CAACd,QAAQ,EAAE;MACbG,OAAO,CAACR,IAAI,CAAC,CAAA;AACf,KAAA;GACD,CAAA;EAED,MAAMoB,kBAAkB,GAAGA,MAAK;AAC9B,IAAA,IAAIhB,MAAM,EAAE;MACV,OAAO,CAAA,EAAGD,SAAS,IAAID,KAAK,IAAI,EAAE,CAAKS,EAAAA,EAAAA,IAAI,CAACU,aAAa,CACvDC,mBAAQ,CAACC,QAAQ,CAClB,CAAIZ,CAAAA,EAAAA,IAAI,CAACU,aAAa,CAACC,mBAAQ,CAACrB,IAAI,CAAC,CAAC,CAAE,CAAA,CAAA;AAC3C,KAAA;IACA,OAAOE,SAAS,IAAID,KAAK,CAAA;GAC1B,CAAA;EAED,oBACEsB,cAAA,CAAAC,mBAAA,EAAA;AAAAC,IAAAA,QAAA,eACEF,cAAA,CAAA,QAAA,EAAA;AACEG,MAAAA,GAAG,EAAElB,SAAU;AACfR,MAAAA,IAAI,EAAC,QAAQ;AACb2B,MAAAA,SAAS,EAAEC,2BAAU,CACnB,CAAkB5B,eAAAA,EAAAA,IAAI,mCAAmC,EACzD;QAAEG,MAAM,EAAE,CAAC,CAACA,MAAAA;AAAM,OAAE,EACpB;QAAEE,KAAK,EAAE,CAAC,CAACA,KAAAA;AAAK,OAAE,CAClB;AACFD,MAAAA,QAAQ,EAAEA,QAAS;AACnByB,MAAAA,QAAQ,EAAEvB,SAAS,GAAG,CAAC,GAAG,CAAC,CAAE;MAC7B,YAAYa,EAAAA,kBAAkB,EAAG;AACjC,MAAA,cAAA,EAAchB,MAAO;AACrBI,MAAAA,OAAO,EAAES,eAAgB;MAAAS,QAAA,EAExBxB,KAAK,IAAIF,IAAAA;KACJ,CAAA;AACV,GAAA,CAAG,CAAA;AAEP;;;;"}
+{"version":3,"file":"TableLink.js","sources":["../../../src/dateLookup/tableLink/TableLink.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useEffect, useRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport messages from '../DateLookup.messages';\n\ninterface TableLinkProps {\n  item: number;\n  type: 'day' | 'month' | 'year';\n  title?: string;\n  longTitle?: string;\n  active: boolean;\n  disabled: boolean;\n  today: boolean;\n  autofocus?: boolean;\n  onClick: (item: number) => void;\n}\n\nconst TableLink = ({\n  item,\n  type,\n  title,\n  longTitle,\n  active,\n  disabled,\n  today,\n  autofocus,\n  onClick,\n}: TableLinkProps) => {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const intl = useIntl();\n\n  useEffect(() => {\n    if (autofocus) {\n      setTimeout(() => {\n        buttonRef.current?.focus();\n      }, 0);\n    }\n  }, [autofocus]);\n\n  const onCalendarClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    event.preventDefault();\n    if (!disabled) {\n      onClick(item);\n    }\n  };\n\n  const calculateAriaLabel = () => {\n    if (active) {\n      return `${longTitle || title || ''}, ${intl.formatMessage(\n        messages.selected,\n      )} ${intl.formatMessage(messages[type])}`;\n    }\n    return longTitle || title;\n  };\n\n  return (\n    <button\n        ref={buttonRef}\n        type=\"button\"\n        className={clsx(\n          `tw-date-lookup-${type}-option np-text-body-default-bold`,\n          { active: !!active },\n          { today: !!today },\n        )}\n        disabled={disabled}\n        tabIndex={autofocus ? 0 : -1}\n        aria-label={calculateAriaLabel()}\n        aria-pressed={active}\n        onClick={onCalendarClick}\n      >\n        {title || item}\n      </button>\n  );\n};\n\nexport default TableLink;\n"],"names":["TableLink","item","type","title","longTitle","active","disabled","today","autofocus","onClick","buttonRef","useRef","intl","useIntl","useEffect","setTimeout","current","focus","onCalendarClick","event","preventDefault","calculateAriaLabel","formatMessage","messages","selected","_jsx","ref","className","clsx","tabIndex","children"],"mappings":";;;;;;;;AAkBMA,MAAAA,SAAS,GAAGA,CAAC;EACjBC,IAAI;EACJC,IAAI;EACJC,KAAK;EACLC,SAAS;EACTC,MAAM;EACNC,QAAQ;EACRC,KAAK;EACLC,SAAS;AACTC,EAAAA,OAAAA;AACe,CAAA,KAAI;AACnB,EAAA,MAAMC,SAAS,GAAGC,YAAM,CAAoB,IAAI,CAAC,CAAA;AACjD,EAAA,MAAMC,IAAI,GAAGC,iBAAO,EAAE,CAAA;AAEtBC,EAAAA,eAAS,CAAC,MAAK;AACb,IAAA,IAAIN,SAAS,EAAE;AACbO,MAAAA,UAAU,CAAC,MAAK;AACdL,QAAAA,SAAS,CAACM,OAAO,EAAEC,KAAK,EAAE,CAAA;OAC3B,EAAE,CAAC,CAAC,CAAA;AACP,KAAA;AACF,GAAC,EAAE,CAACT,SAAS,CAAC,CAAC,CAAA;EAEf,MAAMU,eAAe,GAAIC,KAA0C,IAAI;IACrEA,KAAK,CAACC,cAAc,EAAE,CAAA;IACtB,IAAI,CAACd,QAAQ,EAAE;MACbG,OAAO,CAACR,IAAI,CAAC,CAAA;AACf,KAAA;GACD,CAAA;EAED,MAAMoB,kBAAkB,GAAGA,MAAK;AAC9B,IAAA,IAAIhB,MAAM,EAAE;MACV,OAAO,CAAA,EAAGD,SAAS,IAAID,KAAK,IAAI,EAAE,CAAKS,EAAAA,EAAAA,IAAI,CAACU,aAAa,CACvDC,mBAAQ,CAACC,QAAQ,CAClB,CAAIZ,CAAAA,EAAAA,IAAI,CAACU,aAAa,CAACC,mBAAQ,CAACrB,IAAI,CAAC,CAAC,CAAE,CAAA,CAAA;AAC3C,KAAA;IACA,OAAOE,SAAS,IAAID,KAAK,CAAA;GAC1B,CAAA;AAED,EAAA,oBACEsB,cAAA,CAAA,QAAA,EAAA;AACIC,IAAAA,GAAG,EAAEhB,SAAU;AACfR,IAAAA,IAAI,EAAC,QAAQ;AACbyB,IAAAA,SAAS,EAAEC,SAAI,CACb,CAAkB1B,eAAAA,EAAAA,IAAI,mCAAmC,EACzD;MAAEG,MAAM,EAAE,CAAC,CAACA,MAAAA;AAAQ,KAAA,EACpB;MAAEE,KAAK,EAAE,CAAC,CAACA,KAAAA;KAAO,CAClB;AACFD,IAAAA,QAAQ,EAAEA,QAAS;AACnBuB,IAAAA,QAAQ,EAAErB,SAAS,GAAG,CAAC,GAAG,CAAC,CAAE;IAC7B,YAAYa,EAAAA,kBAAkB,EAAG;AACjC,IAAA,cAAA,EAAchB,MAAO;AACrBI,IAAAA,OAAO,EAAES,eAAgB;IAAAY,QAAA,EAExB3B,KAAK,IAAIF,IAAAA;AAAI,GACR,CAAC,CAAA;AAEf;;;;"}

package/build/dateLookup/tableLink/TableLink.mjs

@@ -1,8 +1,8 @@
-import classNames from 'classnames';
+import { clsx } from 'clsx';
 import { useRef, useEffect } from 'react';
 import { useIntl } from 'react-intl';
 import messages from '../DateLookup.messages.mjs';
-import { jsx, Fragment } from 'react/jsx-runtime';
+import { jsx } from 'react/jsx-runtime';
 
 const TableLink = ({
   item,
@@ -36,22 +36,20 @@ const TableLink = ({
     }
     return longTitle || title;
   };
-  return /*#__PURE__*/jsx(Fragment, {
-    children: /*#__PURE__*/jsx("button", {
-      ref: buttonRef,
-      type: "button",
-      className: classNames(`tw-date-lookup-${type}-option np-text-body-default-bold`, {
-        active: !!active
-      }, {
-        today: !!today
-      }),
-      disabled: disabled,
-      tabIndex: autofocus ? 0 : -1,
-      "aria-label": calculateAriaLabel(),
-      "aria-pressed": active,
-      onClick: onCalendarClick,
-      children: title || item
-    })
+  return /*#__PURE__*/jsx("button", {
+    ref: buttonRef,
+    type: "button",
+    className: clsx(`tw-date-lookup-${type}-option np-text-body-default-bold`, {
+      active: !!active
+    }, {
+      today: !!today
+    }),
+    disabled: disabled,
+    tabIndex: autofocus ? 0 : -1,
+    "aria-label": calculateAriaLabel(),
+    "aria-pressed": active,
+    onClick: onCalendarClick,
+    children: title || item
   });
 };
 

package/build/dateLookup/tableLink/TableLink.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableLink.mjs","sources":["../../../src/dateLookup/tableLink/TableLink.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useEffect, useRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport messages from '../DateLookup.messages';\n\ninterface TableLinkProps {\n  item: number;\n  type: 'day' | 'month' | 'year';\n  title?: string;\n  longTitle?: string;\n  active: boolean;\n  disabled: boolean;\n  today: boolean;\n  autofocus?: boolean;\n  onClick: (item: number) => void;\n}\n\nconst TableLink = ({\n  item,\n  type,\n  title,\n  longTitle,\n  active,\n  disabled,\n  today,\n  autofocus,\n  onClick,\n}: TableLinkProps) => {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const intl = useIntl();\n\n  useEffect(() => {\n    if (autofocus) {\n      setTimeout(() => {\n        buttonRef.current?.focus();\n      }, 0);\n    }\n  }, [autofocus]);\n\n  const onCalendarClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    event.preventDefault();\n    if (!disabled) {\n      onClick(item);\n    }\n  };\n\n  const calculateAriaLabel = () => {\n    if (active) {\n      return `${longTitle || title || ''}, ${intl.formatMessage(\n        messages.selected,\n      )} ${intl.formatMessage(messages[type])}`;\n    }\n    return longTitle || title;\n  };\n\n  return (\n    <>\n      <button\n        ref={buttonRef}\n        type=\"button\"\n        className={classNames(\n          `tw-date-lookup-${type}-option np-text-body-default-bold`,\n          { active: !!active },\n          { today: !!today },\n        )}\n        disabled={disabled}\n        tabIndex={autofocus ? 0 : -1}\n        aria-label={calculateAriaLabel()}\n        aria-pressed={active}\n        onClick={onCalendarClick}\n      >\n        {title || item}\n      </button>\n    </>\n  );\n};\n\nexport default TableLink;\n"],"names":["TableLink","item","type","title","longTitle","active","disabled","today","autofocus","onClick","buttonRef","useRef","intl","useIntl","useEffect","setTimeout","current","focus","onCalendarClick","event","preventDefault","calculateAriaLabel","formatMessage","messages","selected","_jsx","_Fragment","children","ref","className","classNames","tabIndex"],"mappings":";;;;;;AAkBMA,MAAAA,SAAS,GAAGA,CAAC;EACjBC,IAAI;EACJC,IAAI;EACJC,KAAK;EACLC,SAAS;EACTC,MAAM;EACNC,QAAQ;EACRC,KAAK;EACLC,SAAS;AACTC,EAAAA,OAAAA;AACe,CAAA,KAAI;AACnB,EAAA,MAAMC,SAAS,GAAGC,MAAM,CAAoB,IAAI,CAAC,CAAA;AACjD,EAAA,MAAMC,IAAI,GAAGC,OAAO,EAAE,CAAA;AAEtBC,EAAAA,SAAS,CAAC,MAAK;AACb,IAAA,IAAIN,SAAS,EAAE;AACbO,MAAAA,UAAU,CAAC,MAAK;AACdL,QAAAA,SAAS,CAACM,OAAO,EAAEC,KAAK,EAAE,CAAA;OAC3B,EAAE,CAAC,CAAC,CAAA;AACP,KAAA;AACF,GAAC,EAAE,CAACT,SAAS,CAAC,CAAC,CAAA;EAEf,MAAMU,eAAe,GAAIC,KAA0C,IAAI;IACrEA,KAAK,CAACC,cAAc,EAAE,CAAA;IACtB,IAAI,CAACd,QAAQ,EAAE;MACbG,OAAO,CAACR,IAAI,CAAC,CAAA;AACf,KAAA;GACD,CAAA;EAED,MAAMoB,kBAAkB,GAAGA,MAAK;AAC9B,IAAA,IAAIhB,MAAM,EAAE;MACV,OAAO,CAAA,EAAGD,SAAS,IAAID,KAAK,IAAI,EAAE,CAAKS,EAAAA,EAAAA,IAAI,CAACU,aAAa,CACvDC,QAAQ,CAACC,QAAQ,CAClB,CAAIZ,CAAAA,EAAAA,IAAI,CAACU,aAAa,CAACC,QAAQ,CAACrB,IAAI,CAAC,CAAC,CAAE,CAAA,CAAA;AAC3C,KAAA;IACA,OAAOE,SAAS,IAAID,KAAK,CAAA;GAC1B,CAAA;EAED,oBACEsB,GAAA,CAAAC,QAAA,EAAA;AAAAC,IAAAA,QAAA,eACEF,GAAA,CAAA,QAAA,EAAA;AACEG,MAAAA,GAAG,EAAElB,SAAU;AACfR,MAAAA,IAAI,EAAC,QAAQ;AACb2B,MAAAA,SAAS,EAAEC,UAAU,CACnB,CAAkB5B,eAAAA,EAAAA,IAAI,mCAAmC,EACzD;QAAEG,MAAM,EAAE,CAAC,CAACA,MAAAA;AAAM,OAAE,EACpB;QAAEE,KAAK,EAAE,CAAC,CAACA,KAAAA;AAAK,OAAE,CAClB;AACFD,MAAAA,QAAQ,EAAEA,QAAS;AACnByB,MAAAA,QAAQ,EAAEvB,SAAS,GAAG,CAAC,GAAG,CAAC,CAAE;MAC7B,YAAYa,EAAAA,kBAAkB,EAAG;AACjC,MAAA,cAAA,EAAchB,MAAO;AACrBI,MAAAA,OAAO,EAAES,eAAgB;MAAAS,QAAA,EAExBxB,KAAK,IAAIF,IAAAA;KACJ,CAAA;AACV,GAAA,CAAG,CAAA;AAEP;;;;"}
+{"version":3,"file":"TableLink.mjs","sources":["../../../src/dateLookup/tableLink/TableLink.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useEffect, useRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport messages from '../DateLookup.messages';\n\ninterface TableLinkProps {\n  item: number;\n  type: 'day' | 'month' | 'year';\n  title?: string;\n  longTitle?: string;\n  active: boolean;\n  disabled: boolean;\n  today: boolean;\n  autofocus?: boolean;\n  onClick: (item: number) => void;\n}\n\nconst TableLink = ({\n  item,\n  type,\n  title,\n  longTitle,\n  active,\n  disabled,\n  today,\n  autofocus,\n  onClick,\n}: TableLinkProps) => {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const intl = useIntl();\n\n  useEffect(() => {\n    if (autofocus) {\n      setTimeout(() => {\n        buttonRef.current?.focus();\n      }, 0);\n    }\n  }, [autofocus]);\n\n  const onCalendarClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    event.preventDefault();\n    if (!disabled) {\n      onClick(item);\n    }\n  };\n\n  const calculateAriaLabel = () => {\n    if (active) {\n      return `${longTitle || title || ''}, ${intl.formatMessage(\n        messages.selected,\n      )} ${intl.formatMessage(messages[type])}`;\n    }\n    return longTitle || title;\n  };\n\n  return (\n    <button\n        ref={buttonRef}\n        type=\"button\"\n        className={clsx(\n          `tw-date-lookup-${type}-option np-text-body-default-bold`,\n          { active: !!active },\n          { today: !!today },\n        )}\n        disabled={disabled}\n        tabIndex={autofocus ? 0 : -1}\n        aria-label={calculateAriaLabel()}\n        aria-pressed={active}\n        onClick={onCalendarClick}\n      >\n        {title || item}\n      </button>\n  );\n};\n\nexport default TableLink;\n"],"names":["TableLink","item","type","title","longTitle","active","disabled","today","autofocus","onClick","buttonRef","useRef","intl","useIntl","useEffect","setTimeout","current","focus","onCalendarClick","event","preventDefault","calculateAriaLabel","formatMessage","messages","selected","_jsx","ref","className","clsx","tabIndex","children"],"mappings":";;;;;;AAkBMA,MAAAA,SAAS,GAAGA,CAAC;EACjBC,IAAI;EACJC,IAAI;EACJC,KAAK;EACLC,SAAS;EACTC,MAAM;EACNC,QAAQ;EACRC,KAAK;EACLC,SAAS;AACTC,EAAAA,OAAAA;AACe,CAAA,KAAI;AACnB,EAAA,MAAMC,SAAS,GAAGC,MAAM,CAAoB,IAAI,CAAC,CAAA;AACjD,EAAA,MAAMC,IAAI,GAAGC,OAAO,EAAE,CAAA;AAEtBC,EAAAA,SAAS,CAAC,MAAK;AACb,IAAA,IAAIN,SAAS,EAAE;AACbO,MAAAA,UAAU,CAAC,MAAK;AACdL,QAAAA,SAAS,CAACM,OAAO,EAAEC,KAAK,EAAE,CAAA;OAC3B,EAAE,CAAC,CAAC,CAAA;AACP,KAAA;AACF,GAAC,EAAE,CAACT,SAAS,CAAC,CAAC,CAAA;EAEf,MAAMU,eAAe,GAAIC,KAA0C,IAAI;IACrEA,KAAK,CAACC,cAAc,EAAE,CAAA;IACtB,IAAI,CAACd,QAAQ,EAAE;MACbG,OAAO,CAACR,IAAI,CAAC,CAAA;AACf,KAAA;GACD,CAAA;EAED,MAAMoB,kBAAkB,GAAGA,MAAK;AAC9B,IAAA,IAAIhB,MAAM,EAAE;MACV,OAAO,CAAA,EAAGD,SAAS,IAAID,KAAK,IAAI,EAAE,CAAKS,EAAAA,EAAAA,IAAI,CAACU,aAAa,CACvDC,QAAQ,CAACC,QAAQ,CAClB,CAAIZ,CAAAA,EAAAA,IAAI,CAACU,aAAa,CAACC,QAAQ,CAACrB,IAAI,CAAC,CAAC,CAAE,CAAA,CAAA;AAC3C,KAAA;IACA,OAAOE,SAAS,IAAID,KAAK,CAAA;GAC1B,CAAA;AAED,EAAA,oBACEsB,GAAA,CAAA,QAAA,EAAA;AACIC,IAAAA,GAAG,EAAEhB,SAAU;AACfR,IAAAA,IAAI,EAAC,QAAQ;AACbyB,IAAAA,SAAS,EAAEC,IAAI,CACb,CAAkB1B,eAAAA,EAAAA,IAAI,mCAAmC,EACzD;MAAEG,MAAM,EAAE,CAAC,CAACA,MAAAA;AAAQ,KAAA,EACpB;MAAEE,KAAK,EAAE,CAAC,CAACA,KAAAA;KAAO,CAClB;AACFD,IAAAA,QAAQ,EAAEA,QAAS;AACnBuB,IAAAA,QAAQ,EAAErB,SAAS,GAAG,CAAC,GAAG,CAAC,CAAE;IAC7B,YAAYa,EAAAA,kBAAkB,EAAG;AACjC,IAAA,cAAA,EAAchB,MAAO;AACrBI,IAAAA,OAAO,EAAES,eAAgB;IAAAY,QAAA,EAExB3B,KAAK,IAAIF,IAAAA;AAAI,GACR,CAAC,CAAA;AAEf;;;;"}

package/build/decision/Decision.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var classNames = require('classnames');
+var clsx = require('clsx');
 var useScreenSize = require('../common/hooks/useScreenSize.js');
 var NavigationOption = require('../navigationOption/NavigationOption.js');
 var Tile = require('../tile/Tile.js');
@@ -10,10 +10,6 @@ var jsxRuntime = require('react/jsx-runtime');
 var breakpoint = require('../common/propsValues/breakpoint.js');
 var size = require('../common/propsValues/size.js');
 
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var classNames__default = /*#__PURE__*/_interopDefault(classNames);
-
 exports.DecisionPresentation = void 0;
 (function (DecisionPresentation) {
   DecisionPresentation["LIST"] = "LIST";
@@ -65,7 +61,7 @@ const Decision = ({
       const breakpoint = isSmall ? screenXs : screenSm;
       const isGrid = presentation === exports.DecisionPresentation.LIST_BLOCK_GRID;
       return /*#__PURE__*/jsxRuntime.jsx("div", {
-        className: classNames__default.default('np-decision d-flex', {
+        className: clsx.clsx('np-decision d-flex', {
           'np-decision--small': isSmall,
           'np-decision--grid': isGrid
         }, breakpoint ? isGrid && 'flex-wrap' : 'flex-column'),
@@ -82,7 +78,7 @@ const Decision = ({
         }, key) => /*#__PURE__*/jsxRuntime.jsx(Tile
         // eslint-disable-next-line react/no-array-index-key
         , {
-          className: classNames__default.default(`np-decision__tile${isSmall ? '--small' : ''}`, {
+          className: clsx.clsx(`np-decision__tile${isSmall ? '--small' : ''}`, {
             'np-decision__tile--fixed-width': isGrid
           }),
           description: description,

package/build/decision/Decision.js.map

@@ -1 +1 @@
-{"version":3,"file":"Decision.js","sources":["../../src/decision/Decision.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { Size, Breakpoint, SizeSmall, SizeMedium } from '../common';\nimport { useScreenSize } from '../common/hooks/useScreenSize';\nimport NavigationOption from '../navigationOption';\nimport Tile from '../tile';\n\ninterface DecisionOption {\n  description?: React.ReactNode;\n  disabled?: boolean;\n  href?: string;\n  target?: React.HTMLAttributeAnchorTarget;\n  media: {\n    block: React.ReactNode;\n    list: React.ReactNode;\n  };\n  onClick?: (event?: React.MouseEvent<HTMLElement>) => void;\n  title: React.ReactNode;\n}\n\nexport enum DecisionPresentation {\n  LIST = 'LIST',\n  LIST_BLOCK = 'LIST_BLOCK',\n  LIST_BLOCK_GRID = 'LIST_BLOCK_GRID',\n}\n\nexport enum DecisionType {\n  NAVIGATION = 'NAVIGATION',\n}\n\nexport interface DecisionProps {\n  /**  A list of elements to be rendered */\n  options: readonly DecisionOption[];\n  /**  Handles the display mode of the component */\n  presentation?: `${DecisionPresentation}`;\n  /** Size currently affects only Tile dimension */\n  size?: SizeSmall | SizeMedium;\n  /** Decide which kind of element type needs to be rendered ex: Navigation Options or in the future Radio or Checkbox Options */\n  type?: `${DecisionType}`;\n\n  /** Display media in a circle in list presentation */\n  showMediaCircleInList?: boolean;\n\n  /** Sets navigation options to be aligned with the parent container */\n  isContainerAligned?: boolean;\n}\n\nconst Decision = ({\n  options,\n  presentation = DecisionPresentation.LIST,\n  size = Size.MEDIUM,\n  type = DecisionType.NAVIGATION,\n  showMediaCircleInList = true,\n  isContainerAligned = false,\n}: DecisionProps) => {\n  const screenXs = useScreenSize(Breakpoint.EXTRA_SMALL);\n  const screenSm = useScreenSize(Breakpoint.SMALL);\n\n  if (type === DecisionType.NAVIGATION) {\n    const renderedOptions = options.map(\n      ({ title, description, disabled, href, target, media: { list }, onClick }, key) => (\n        <NavigationOption\n          // eslint-disable-next-line react/no-array-index-key\n          key={`nav-${key}`}\n          complex={false}\n          content={description}\n          disabled={disabled}\n          href={href}\n          target={target}\n          media={list}\n          showMediaAtAllSizes\n          showMediaCircle={showMediaCircleInList}\n          isContainerAligned={isContainerAligned}\n          title={title}\n          onClick={onClick}\n        />\n      ),\n    );\n\n    if (\n      presentation === DecisionPresentation.LIST_BLOCK ||\n      presentation === DecisionPresentation.LIST_BLOCK_GRID\n    ) {\n      const isSmall = size === Size.SMALL;\n      const breakpoint = isSmall ? screenXs : screenSm;\n\n      const isGrid = presentation === DecisionPresentation.LIST_BLOCK_GRID;\n\n      return (\n        <div\n          className={classNames(\n            'np-decision d-flex',\n            {\n              'np-decision--small': isSmall,\n              'np-decision--grid': isGrid,\n            },\n            breakpoint ? isGrid && 'flex-wrap' : 'flex-column',\n          )}\n        >\n          {breakpoint\n            ? options.map(\n                (\n                  { description, disabled, href, target, media: { block }, onClick, title },\n                  key,\n                ) => (\n                  <Tile\n                    // eslint-disable-next-line react/no-array-index-key\n                    key={`tile-${key}`}\n                    className={classNames(`np-decision__tile${isSmall ? '--small' : ''}`, {\n                      'np-decision__tile--fixed-width': isGrid,\n                    })}\n                    description={description}\n                    disabled={disabled}\n                    href={href}\n                    target={target}\n                    media={block}\n                    size={isSmall ? Size.SMALL : Size.MEDIUM}\n                    title={title}\n                    onClick={onClick}\n                  />\n                ),\n              )\n            : renderedOptions}\n        </div>\n      );\n    }\n    // LIST\n    return <>{renderedOptions}</>;\n  }\n  return null;\n};\n\nexport default Decision;\n"],"names":["DecisionPresentation","DecisionType","Decision","options","presentation","LIST","size","Size","MEDIUM","type","NAVIGATION","showMediaCircleInList","isContainerAligned","screenXs","useScreenSize","Breakpoint","EXTRA_SMALL","screenSm","SMALL","renderedOptions","map","title","description","disabled","href","target","media","list","onClick","key","_jsx","NavigationOption","complex","content","showMediaAtAllSizes","showMediaCircle","LIST_BLOCK","LIST_BLOCK_GRID","isSmall","breakpoint","isGrid","className","classNames","children","block","Tile","_Fragment"],"mappings":"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"}
+{"version":3,"file":"Decision.js","sources":["../../src/decision/Decision.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport { Size, Breakpoint, SizeSmall, SizeMedium } from '../common';\nimport { useScreenSize } from '../common/hooks/useScreenSize';\nimport NavigationOption from '../navigationOption';\nimport Tile from '../tile';\n\ninterface DecisionOption {\n  description?: React.ReactNode;\n  disabled?: boolean;\n  href?: string;\n  target?: React.HTMLAttributeAnchorTarget;\n  media: {\n    block: React.ReactNode;\n    list: React.ReactNode;\n  };\n  onClick?: (event?: React.MouseEvent<HTMLElement>) => void;\n  title: React.ReactNode;\n}\n\nexport enum DecisionPresentation {\n  LIST = 'LIST',\n  LIST_BLOCK = 'LIST_BLOCK',\n  LIST_BLOCK_GRID = 'LIST_BLOCK_GRID',\n}\n\nexport enum DecisionType {\n  NAVIGATION = 'NAVIGATION',\n}\n\nexport interface DecisionProps {\n  /**  A list of elements to be rendered */\n  options: readonly DecisionOption[];\n  /**  Handles the display mode of the component */\n  presentation?: `${DecisionPresentation}`;\n  /** Size currently affects only Tile dimension */\n  size?: SizeSmall | SizeMedium;\n  /** Decide which kind of element type needs to be rendered ex: Navigation Options or in the future Radio or Checkbox Options */\n  type?: `${DecisionType}`;\n\n  /** Display media in a circle in list presentation */\n  showMediaCircleInList?: boolean;\n\n  /** Sets navigation options to be aligned with the parent container */\n  isContainerAligned?: boolean;\n}\n\nconst Decision = ({\n  options,\n  presentation = DecisionPresentation.LIST,\n  size = Size.MEDIUM,\n  type = DecisionType.NAVIGATION,\n  showMediaCircleInList = true,\n  isContainerAligned = false,\n}: DecisionProps) => {\n  const screenXs = useScreenSize(Breakpoint.EXTRA_SMALL);\n  const screenSm = useScreenSize(Breakpoint.SMALL);\n\n  if (type === DecisionType.NAVIGATION) {\n    const renderedOptions = options.map(\n      ({ title, description, disabled, href, target, media: { list }, onClick }, key) => (\n        <NavigationOption\n          // eslint-disable-next-line react/no-array-index-key\n          key={`nav-${key}`}\n          complex={false}\n          content={description}\n          disabled={disabled}\n          href={href}\n          target={target}\n          media={list}\n          showMediaAtAllSizes\n          showMediaCircle={showMediaCircleInList}\n          isContainerAligned={isContainerAligned}\n          title={title}\n          onClick={onClick}\n        />\n      ),\n    );\n\n    if (\n      presentation === DecisionPresentation.LIST_BLOCK ||\n      presentation === DecisionPresentation.LIST_BLOCK_GRID\n    ) {\n      const isSmall = size === Size.SMALL;\n      const breakpoint = isSmall ? screenXs : screenSm;\n\n      const isGrid = presentation === DecisionPresentation.LIST_BLOCK_GRID;\n\n      return (\n        <div\n          className={clsx(\n            'np-decision d-flex',\n            {\n              'np-decision--small': isSmall,\n              'np-decision--grid': isGrid,\n            },\n            breakpoint ? isGrid && 'flex-wrap' : 'flex-column',\n          )}\n        >\n          {breakpoint\n            ? options.map(\n                (\n                  { description, disabled, href, target, media: { block }, onClick, title },\n                  key,\n                ) => (\n                  <Tile\n                    // eslint-disable-next-line react/no-array-index-key\n                    key={`tile-${key}`}\n                    className={clsx(`np-decision__tile${isSmall ? '--small' : ''}`, {\n                      'np-decision__tile--fixed-width': isGrid,\n                    })}\n                    description={description}\n                    disabled={disabled}\n                    href={href}\n                    target={target}\n                    media={block}\n                    size={isSmall ? Size.SMALL : Size.MEDIUM}\n                    title={title}\n                    onClick={onClick}\n                  />\n                ),\n              )\n            : renderedOptions}\n        </div>\n      );\n    }\n    // LIST\n    return <>{renderedOptions}</>;\n  }\n  return null;\n};\n\nexport default Decision;\n"],"names":["DecisionPresentation","DecisionType","Decision","options","presentation","LIST","size","Size","MEDIUM","type","NAVIGATION","showMediaCircleInList","isContainerAligned","screenXs","useScreenSize","Breakpoint","EXTRA_SMALL","screenSm","SMALL","renderedOptions","map","title","description","disabled","href","target","media","list","onClick","key","_jsx","NavigationOption","complex","content","showMediaAtAllSizes","showMediaCircle","LIST_BLOCK","LIST_BLOCK_GRID","isSmall","breakpoint","isGrid","className","clsx","children","block","Tile","_Fragment"],"mappings":"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"}

package/build/decision/Decision.mjs

@@ -1,4 +1,4 @@
-import classNames from 'classnames';
+import { clsx } from 'clsx';
 import { useScreenSize } from '../common/hooks/useScreenSize.mjs';
 import NavigationOption from '../navigationOption/NavigationOption.mjs';
 import Tile from '../tile/Tile.mjs';
@@ -57,7 +57,7 @@ const Decision = ({
       const breakpoint = isSmall ? screenXs : screenSm;
       const isGrid = presentation === DecisionPresentation.LIST_BLOCK_GRID;
       return /*#__PURE__*/jsx("div", {
-        className: classNames('np-decision d-flex', {
+        className: clsx('np-decision d-flex', {
           'np-decision--small': isSmall,
           'np-decision--grid': isGrid
         }, breakpoint ? isGrid && 'flex-wrap' : 'flex-column'),
@@ -74,7 +74,7 @@ const Decision = ({
         }, key) => /*#__PURE__*/jsx(Tile
         // eslint-disable-next-line react/no-array-index-key
         , {
-          className: classNames(`np-decision__tile${isSmall ? '--small' : ''}`, {
+          className: clsx(`np-decision__tile${isSmall ? '--small' : ''}`, {
             'np-decision__tile--fixed-width': isGrid
           }),
           description: description,

package/build/decision/Decision.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Decision.mjs","sources":["../../src/decision/Decision.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { Size, Breakpoint, SizeSmall, SizeMedium } from '../common';\nimport { useScreenSize } from '../common/hooks/useScreenSize';\nimport NavigationOption from '../navigationOption';\nimport Tile from '../tile';\n\ninterface DecisionOption {\n  description?: React.ReactNode;\n  disabled?: boolean;\n  href?: string;\n  target?: React.HTMLAttributeAnchorTarget;\n  media: {\n    block: React.ReactNode;\n    list: React.ReactNode;\n  };\n  onClick?: (event?: React.MouseEvent<HTMLElement>) => void;\n  title: React.ReactNode;\n}\n\nexport enum DecisionPresentation {\n  LIST = 'LIST',\n  LIST_BLOCK = 'LIST_BLOCK',\n  LIST_BLOCK_GRID = 'LIST_BLOCK_GRID',\n}\n\nexport enum DecisionType {\n  NAVIGATION = 'NAVIGATION',\n}\n\nexport interface DecisionProps {\n  /**  A list of elements to be rendered */\n  options: readonly DecisionOption[];\n  /**  Handles the display mode of the component */\n  presentation?: `${DecisionPresentation}`;\n  /** Size currently affects only Tile dimension */\n  size?: SizeSmall | SizeMedium;\n  /** Decide which kind of element type needs to be rendered ex: Navigation Options or in the future Radio or Checkbox Options */\n  type?: `${DecisionType}`;\n\n  /** Display media in a circle in list presentation */\n  showMediaCircleInList?: boolean;\n\n  /** Sets navigation options to be aligned with the parent container */\n  isContainerAligned?: boolean;\n}\n\nconst Decision = ({\n  options,\n  presentation = DecisionPresentation.LIST,\n  size = Size.MEDIUM,\n  type = DecisionType.NAVIGATION,\n  showMediaCircleInList = true,\n  isContainerAligned = false,\n}: DecisionProps) => {\n  const screenXs = useScreenSize(Breakpoint.EXTRA_SMALL);\n  const screenSm = useScreenSize(Breakpoint.SMALL);\n\n  if (type === DecisionType.NAVIGATION) {\n    const renderedOptions = options.map(\n      ({ title, description, disabled, href, target, media: { list }, onClick }, key) => (\n        <NavigationOption\n          // eslint-disable-next-line react/no-array-index-key\n          key={`nav-${key}`}\n          complex={false}\n          content={description}\n          disabled={disabled}\n          href={href}\n          target={target}\n          media={list}\n          showMediaAtAllSizes\n          showMediaCircle={showMediaCircleInList}\n          isContainerAligned={isContainerAligned}\n          title={title}\n          onClick={onClick}\n        />\n      ),\n    );\n\n    if (\n      presentation === DecisionPresentation.LIST_BLOCK ||\n      presentation === DecisionPresentation.LIST_BLOCK_GRID\n    ) {\n      const isSmall = size === Size.SMALL;\n      const breakpoint = isSmall ? screenXs : screenSm;\n\n      const isGrid = presentation === DecisionPresentation.LIST_BLOCK_GRID;\n\n      return (\n        <div\n          className={classNames(\n            'np-decision d-flex',\n            {\n              'np-decision--small': isSmall,\n              'np-decision--grid': isGrid,\n            },\n            breakpoint ? isGrid && 'flex-wrap' : 'flex-column',\n          )}\n        >\n          {breakpoint\n            ? options.map(\n                (\n                  { description, disabled, href, target, media: { block }, onClick, title },\n                  key,\n                ) => (\n                  <Tile\n                    // eslint-disable-next-line react/no-array-index-key\n                    key={`tile-${key}`}\n                    className={classNames(`np-decision__tile${isSmall ? '--small' : ''}`, {\n                      'np-decision__tile--fixed-width': isGrid,\n                    })}\n                    description={description}\n                    disabled={disabled}\n                    href={href}\n                    target={target}\n                    media={block}\n                    size={isSmall ? Size.SMALL : Size.MEDIUM}\n                    title={title}\n                    onClick={onClick}\n                  />\n                ),\n              )\n            : renderedOptions}\n        </div>\n      );\n    }\n    // LIST\n    return <>{renderedOptions}</>;\n  }\n  return null;\n};\n\nexport default Decision;\n"],"names":["DecisionPresentation","DecisionType","Decision","options","presentation","LIST","size","Size","MEDIUM","type","NAVIGATION","showMediaCircleInList","isContainerAligned","screenXs","useScreenSize","Breakpoint","EXTRA_SMALL","screenSm","SMALL","renderedOptions","map","title","description","disabled","href","target","media","list","onClick","key","_jsx","NavigationOption","complex","content","showMediaAtAllSizes","showMediaCircle","LIST_BLOCK","LIST_BLOCK_GRID","isSmall","breakpoint","isGrid","className","classNames","children","block","Tile","_Fragment"],"mappings":"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"}
+{"version":3,"file":"Decision.mjs","sources":["../../src/decision/Decision.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport { Size, Breakpoint, SizeSmall, SizeMedium } from '../common';\nimport { useScreenSize } from '../common/hooks/useScreenSize';\nimport NavigationOption from '../navigationOption';\nimport Tile from '../tile';\n\ninterface DecisionOption {\n  description?: React.ReactNode;\n  disabled?: boolean;\n  href?: string;\n  target?: React.HTMLAttributeAnchorTarget;\n  media: {\n    block: React.ReactNode;\n    list: React.ReactNode;\n  };\n  onClick?: (event?: React.MouseEvent<HTMLElement>) => void;\n  title: React.ReactNode;\n}\n\nexport enum DecisionPresentation {\n  LIST = 'LIST',\n  LIST_BLOCK = 'LIST_BLOCK',\n  LIST_BLOCK_GRID = 'LIST_BLOCK_GRID',\n}\n\nexport enum DecisionType {\n  NAVIGATION = 'NAVIGATION',\n}\n\nexport interface DecisionProps {\n  /**  A list of elements to be rendered */\n  options: readonly DecisionOption[];\n  /**  Handles the display mode of the component */\n  presentation?: `${DecisionPresentation}`;\n  /** Size currently affects only Tile dimension */\n  size?: SizeSmall | SizeMedium;\n  /** Decide which kind of element type needs to be rendered ex: Navigation Options or in the future Radio or Checkbox Options */\n  type?: `${DecisionType}`;\n\n  /** Display media in a circle in list presentation */\n  showMediaCircleInList?: boolean;\n\n  /** Sets navigation options to be aligned with the parent container */\n  isContainerAligned?: boolean;\n}\n\nconst Decision = ({\n  options,\n  presentation = DecisionPresentation.LIST,\n  size = Size.MEDIUM,\n  type = DecisionType.NAVIGATION,\n  showMediaCircleInList = true,\n  isContainerAligned = false,\n}: DecisionProps) => {\n  const screenXs = useScreenSize(Breakpoint.EXTRA_SMALL);\n  const screenSm = useScreenSize(Breakpoint.SMALL);\n\n  if (type === DecisionType.NAVIGATION) {\n    const renderedOptions = options.map(\n      ({ title, description, disabled, href, target, media: { list }, onClick }, key) => (\n        <NavigationOption\n          // eslint-disable-next-line react/no-array-index-key\n          key={`nav-${key}`}\n          complex={false}\n          content={description}\n          disabled={disabled}\n          href={href}\n          target={target}\n          media={list}\n          showMediaAtAllSizes\n          showMediaCircle={showMediaCircleInList}\n          isContainerAligned={isContainerAligned}\n          title={title}\n          onClick={onClick}\n        />\n      ),\n    );\n\n    if (\n      presentation === DecisionPresentation.LIST_BLOCK ||\n      presentation === DecisionPresentation.LIST_BLOCK_GRID\n    ) {\n      const isSmall = size === Size.SMALL;\n      const breakpoint = isSmall ? screenXs : screenSm;\n\n      const isGrid = presentation === DecisionPresentation.LIST_BLOCK_GRID;\n\n      return (\n        <div\n          className={clsx(\n            'np-decision d-flex',\n            {\n              'np-decision--small': isSmall,\n              'np-decision--grid': isGrid,\n            },\n            breakpoint ? isGrid && 'flex-wrap' : 'flex-column',\n          )}\n        >\n          {breakpoint\n            ? options.map(\n                (\n                  { description, disabled, href, target, media: { block }, onClick, title },\n                  key,\n                ) => (\n                  <Tile\n                    // eslint-disable-next-line react/no-array-index-key\n                    key={`tile-${key}`}\n                    className={clsx(`np-decision__tile${isSmall ? '--small' : ''}`, {\n                      'np-decision__tile--fixed-width': isGrid,\n                    })}\n                    description={description}\n                    disabled={disabled}\n                    href={href}\n                    target={target}\n                    media={block}\n                    size={isSmall ? Size.SMALL : Size.MEDIUM}\n                    title={title}\n                    onClick={onClick}\n                  />\n                ),\n              )\n            : renderedOptions}\n        </div>\n      );\n    }\n    // LIST\n    return <>{renderedOptions}</>;\n  }\n  return null;\n};\n\nexport default Decision;\n"],"names":["DecisionPresentation","DecisionType","Decision","options","presentation","LIST","size","Size","MEDIUM","type","NAVIGATION","showMediaCircleInList","isContainerAligned","screenXs","useScreenSize","Breakpoint","EXTRA_SMALL","screenSm","SMALL","renderedOptions","map","title","description","disabled","href","target","media","list","onClick","key","_jsx","NavigationOption","complex","content","showMediaAtAllSizes","showMediaCircle","LIST_BLOCK","LIST_BLOCK_GRID","isSmall","breakpoint","isGrid","className","clsx","children","block","Tile","_Fragment"],"mappings":"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"}

package/build/definitionList/DefinitionList.js

@@ -1,14 +1,10 @@
 'use strict';
 
-var classNames = require('classnames');
+var clsx = require('clsx');
 var ActionButton = require('../actionButton/ActionButton.js');
 var jsxRuntime = require('react/jsx-runtime');
 var layouts = require('../common/propsValues/layouts.js');
 
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var classNames__default = /*#__PURE__*/_interopDefault(classNames);
-
 const isLayoutHorizontal = layout => layout === layouts.Layout.HORIZONTAL_LEFT_ALIGNED || layout === layouts.Layout.HORIZONTAL_RIGHT_ALIGNED || layout === layouts.Layout.HORIZONTAL_JUSTIFIED;
 const getAlignmentClasses = (layout, action) => {
   const classes = ['d-flex'];
@@ -36,7 +32,7 @@ function DefinitionList({
   muted
 }) {
   return /*#__PURE__*/jsxRuntime.jsx("dl", {
-    className: classNames__default.default('tw-definition-list d-flex ', {
+    className: clsx.clsx('tw-definition-list d-flex ', {
       'text-muted': muted,
       'flex-column': layout === layouts.Layout.VERTICAL_ONE_COLUMN,
       'tw-definition-list--columns flex-column flex-row--sm': layout === layouts.Layout.VERTICAL_TWO_COLUMN,
@@ -52,11 +48,11 @@ function DefinitionList({
       children: [/*#__PURE__*/jsxRuntime.jsx("dt", {
         children: title
       }), /*#__PURE__*/jsxRuntime.jsxs("dd", {
-        className: classNames__default.default(...getAlignmentClasses(layout, action)),
+        className: clsx.clsx(...getAlignmentClasses(layout, action)),
         children: [/*#__PURE__*/jsxRuntime.jsx("div", {
           children: value
         }), action ? /*#__PURE__*/jsxRuntime.jsx("div", {
-          className: classNames__default.default(isLayoutHorizontal(layout) ? 'p-l-2' : 'p-x-2', 'tw-definition-list__action'),
+          className: clsx.clsx(isLayoutHorizontal(layout) ? 'p-l-2' : 'p-x-2', 'tw-definition-list__action'),
           children: /*#__PURE__*/jsxRuntime.jsx(ActionButton, {
             className: "tw-definition-list__button",
             onClick: action.onClick,

package/build/definitionList/DefinitionList.js.map

@@ -1 +1 @@
-{"version":3,"file":"DefinitionList.js","sources":["../../src/definitionList/DefinitionList.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport ActionButton from '../actionButton';\nimport { Layout } from '../common';\n\nexport interface DefinitionListDefinition {\n  action?: {\n    label: string;\n    onClick?: React.MouseEventHandler<HTMLButtonElement>;\n  };\n  title: React.ReactNode;\n  value: React.ReactNode;\n  key: string;\n}\n\ntype DefinitionListLayout =\n  `${Layout.VERTICAL_TWO_COLUMN | Layout.VERTICAL_ONE_COLUMN | Layout.HORIZONTAL_JUSTIFIED | Layout.HORIZONTAL_LEFT_ALIGNED | Layout.HORIZONTAL_RIGHT_ALIGNED}`;\n\nexport interface DefinitionListProps {\n  definitions?: DefinitionListDefinition[];\n  layout?: DefinitionListLayout;\n  muted?: boolean;\n}\n\nconst isLayoutHorizontal = (layout: DefinitionListLayout) =>\n  layout === Layout.HORIZONTAL_LEFT_ALIGNED ||\n  layout === Layout.HORIZONTAL_RIGHT_ALIGNED ||\n  layout === Layout.HORIZONTAL_JUSTIFIED;\n\nconst getAlignmentClasses = (\n  layout: DefinitionListLayout,\n  action: DefinitionListDefinition['action'],\n) => {\n  const classes = ['d-flex'];\n\n  if (action) {\n    if (isLayoutHorizontal(layout)) {\n      classes.push('align-items-center');\n    } else {\n      classes.push('align-items-start');\n    }\n  }\n\n  if (layout === Layout.HORIZONTAL_RIGHT_ALIGNED) {\n    classes.push('text-sm-right tw-definition-list--right-aligned-desktop');\n  } else {\n    classes.push('justify-content-between');\n  }\n\n  if (layout === Layout.HORIZONTAL_JUSTIFIED) {\n    classes.push('text-sm-justify');\n  }\n\n  return classes;\n};\n\nconst defaultDefinitions = [] satisfies DefinitionListProps['definitions'];\n\nexport default function DefinitionList({\n  definitions = defaultDefinitions,\n  layout = 'VERTICAL_TWO_COLUMN',\n  muted,\n}: DefinitionListProps) {\n  return (\n    <dl\n      className={classNames('tw-definition-list d-flex ', {\n        'text-muted': muted,\n        'flex-column': layout === Layout.VERTICAL_ONE_COLUMN,\n        'tw-definition-list--columns flex-column flex-row--sm':\n          layout === Layout.VERTICAL_TWO_COLUMN,\n        'tw-definition-list--horizontal flex-column': isLayoutHorizontal(layout),\n      })}\n    >\n      {definitions\n        .filter((definition) => definition)\n        .map(({ action, title, value, key }) => (\n          <div key={key} className=\"tw-definition-list__item\">\n            <dt>{title}</dt>\n            <dd className={classNames(...getAlignmentClasses(layout, action))}>\n              <div>{value}</div>\n              {action ? (\n                <div\n                  className={classNames(\n                    isLayoutHorizontal(layout) ? 'p-l-2' : 'p-x-2',\n                    'tw-definition-list__action',\n                  )}\n                >\n                  <ActionButton className=\"tw-definition-list__button\" onClick={action.onClick}>\n                    {action.label}\n                  </ActionButton>\n                </div>\n              ) : null}\n            </dd>\n          </div>\n        ))}\n    </dl>\n  );\n}\n"],"names":["isLayoutHorizontal","layout","Layout","HORIZONTAL_LEFT_ALIGNED","HORIZONTAL_RIGHT_ALIGNED","HORIZONTAL_JUSTIFIED","getAlignmentClasses","action","classes","push","defaultDefinitions","DefinitionList","definitions","muted","_jsx","className","classNames","VERTICAL_ONE_COLUMN","VERTICAL_TWO_COLUMN","children","filter","definition","map","title","value","key","_jsxs","ActionButton","onClick","label"],"mappings":"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"}
+{"version":3,"file":"DefinitionList.js","sources":["../../src/definitionList/DefinitionList.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport ActionButton from '../actionButton';\nimport { Layout } from '../common';\n\nexport interface DefinitionListDefinition {\n  action?: {\n    label: string;\n    onClick?: React.MouseEventHandler<HTMLButtonElement>;\n  };\n  title: React.ReactNode;\n  value: React.ReactNode;\n  key: string;\n}\n\ntype DefinitionListLayout =\n  `${Layout.VERTICAL_TWO_COLUMN | Layout.VERTICAL_ONE_COLUMN | Layout.HORIZONTAL_JUSTIFIED | Layout.HORIZONTAL_LEFT_ALIGNED | Layout.HORIZONTAL_RIGHT_ALIGNED}`;\n\nexport interface DefinitionListProps {\n  definitions?: DefinitionListDefinition[];\n  layout?: DefinitionListLayout;\n  muted?: boolean;\n}\n\nconst isLayoutHorizontal = (layout: DefinitionListLayout) =>\n  layout === Layout.HORIZONTAL_LEFT_ALIGNED ||\n  layout === Layout.HORIZONTAL_RIGHT_ALIGNED ||\n  layout === Layout.HORIZONTAL_JUSTIFIED;\n\nconst getAlignmentClasses = (\n  layout: DefinitionListLayout,\n  action: DefinitionListDefinition['action'],\n) => {\n  const classes = ['d-flex'];\n\n  if (action) {\n    if (isLayoutHorizontal(layout)) {\n      classes.push('align-items-center');\n    } else {\n      classes.push('align-items-start');\n    }\n  }\n\n  if (layout === Layout.HORIZONTAL_RIGHT_ALIGNED) {\n    classes.push('text-sm-right tw-definition-list--right-aligned-desktop');\n  } else {\n    classes.push('justify-content-between');\n  }\n\n  if (layout === Layout.HORIZONTAL_JUSTIFIED) {\n    classes.push('text-sm-justify');\n  }\n\n  return classes;\n};\n\nconst defaultDefinitions = [] satisfies DefinitionListProps['definitions'];\n\nexport default function DefinitionList({\n  definitions = defaultDefinitions,\n  layout = 'VERTICAL_TWO_COLUMN',\n  muted,\n}: DefinitionListProps) {\n  return (\n    <dl\n      className={clsx('tw-definition-list d-flex ', {\n        'text-muted': muted,\n        'flex-column': layout === Layout.VERTICAL_ONE_COLUMN,\n        'tw-definition-list--columns flex-column flex-row--sm':\n          layout === Layout.VERTICAL_TWO_COLUMN,\n        'tw-definition-list--horizontal flex-column': isLayoutHorizontal(layout),\n      })}\n    >\n      {definitions\n        .filter((definition) => definition)\n        .map(({ action, title, value, key }) => (\n          <div key={key} className=\"tw-definition-list__item\">\n            <dt>{title}</dt>\n            <dd className={clsx(...getAlignmentClasses(layout, action))}>\n              <div>{value}</div>\n              {action ? (\n                <div\n                  className={clsx(\n                    isLayoutHorizontal(layout) ? 'p-l-2' : 'p-x-2',\n                    'tw-definition-list__action',\n                  )}\n                >\n                  <ActionButton className=\"tw-definition-list__button\" onClick={action.onClick}>\n                    {action.label}\n                  </ActionButton>\n                </div>\n              ) : null}\n            </dd>\n          </div>\n        ))}\n    </dl>\n  );\n}\n"],"names":["isLayoutHorizontal","layout","Layout","HORIZONTAL_LEFT_ALIGNED","HORIZONTAL_RIGHT_ALIGNED","HORIZONTAL_JUSTIFIED","getAlignmentClasses","action","classes","push","defaultDefinitions","DefinitionList","definitions","muted","_jsx","className","clsx","VERTICAL_ONE_COLUMN","VERTICAL_TWO_COLUMN","children","filter","definition","map","title","value","key","_jsxs","ActionButton","onClick","label"],"mappings":";;;;;;;AAwBA,MAAMA,kBAAkB,GAAIC,MAA4B,IACtDA,MAAM,KAAKC,cAAM,CAACC,uBAAuB,IACzCF,MAAM,KAAKC,cAAM,CAACE,wBAAwB,IAC1CH,MAAM,KAAKC,cAAM,CAACG,oBAAoB,CAAA;AAExC,MAAMC,mBAAmB,GAAGA,CAC1BL,MAA4B,EAC5BM,MAA0C,KACxC;AACF,EAAA,MAAMC,OAAO,GAAG,CAAC,QAAQ,CAAC,CAAA;AAE1B,EAAA,IAAID,MAAM,EAAE;AACV,IAAA,IAAIP,kBAAkB,CAACC,MAAM,CAAC,EAAE;AAC9BO,MAAAA,OAAO,CAACC,IAAI,CAAC,oBAAoB,CAAC,CAAA;AACpC,KAAC,MAAM;AACLD,MAAAA,OAAO,CAACC,IAAI,CAAC,mBAAmB,CAAC,CAAA;AACnC,KAAA;AACF,GAAA;AAEA,EAAA,IAAIR,MAAM,KAAKC,cAAM,CAACE,wBAAwB,EAAE;AAC9CI,IAAAA,OAAO,CAACC,IAAI,CAAC,yDAAyD,CAAC,CAAA;AACzE,GAAC,MAAM;AACLD,IAAAA,OAAO,CAACC,IAAI,CAAC,yBAAyB,CAAC,CAAA;AACzC,GAAA;AAEA,EAAA,IAAIR,MAAM,KAAKC,cAAM,CAACG,oBAAoB,EAAE;AAC1CG,IAAAA,OAAO,CAACC,IAAI,CAAC,iBAAiB,CAAC,CAAA;AACjC,GAAA;AAEA,EAAA,OAAOD,OAAO,CAAA;AAChB,CAAC,CAAA;AAED,MAAME,kBAAkB,GAAG,EAA+C,CAAA;AAElD,SAAAC,cAAcA,CAAC;AACrCC,EAAAA,WAAW,GAAGF,kBAAkB;AAChCT,EAAAA,MAAM,GAAG,qBAAqB;AAC9BY,EAAAA,KAAAA;AACoB,CAAA,EAAA;AACpB,EAAA,oBACEC,cAAA,CAAA,IAAA,EAAA;AACEC,IAAAA,SAAS,EAAEC,SAAI,CAAC,4BAA4B,EAAE;AAC5C,MAAA,YAAY,EAAEH,KAAK;AACnB,MAAA,aAAa,EAAEZ,MAAM,KAAKC,cAAM,CAACe,mBAAmB;AACpD,MAAA,sDAAsD,EACpDhB,MAAM,KAAKC,cAAM,CAACgB,mBAAmB;MACvC,4CAA4C,EAAElB,kBAAkB,CAACC,MAAM,CAAA;AACxE,KAAA,CAAE;AAAAkB,IAAAA,QAAA,EAEFP,WAAW,CACTQ,MAAM,CAAEC,UAAU,IAAKA,UAAU,CAAC,CAClCC,GAAG,CAAC,CAAC;MAAEf,MAAM;MAAEgB,KAAK;MAAEC,KAAK;AAAEC,MAAAA,GAAAA;AAAG,KAAE,kBACjCC,eAAA,CAAA,KAAA,EAAA;AAAeX,MAAAA,SAAS,EAAC,0BAA0B;AAAAI,MAAAA,QAAA,gBACjDL,cAAA,CAAA,IAAA,EAAA;AAAAK,QAAAA,QAAA,EAAKI,KAAAA;OAAU,CACf,eAAAG,eAAA,CAAA,IAAA,EAAA;QAAIX,SAAS,EAAEC,SAAI,CAAC,GAAGV,mBAAmB,CAACL,MAAM,EAAEM,MAAM,CAAC,CAAE;AAAAY,QAAAA,QAAA,gBAC1DL,cAAA,CAAA,KAAA,EAAA;AAAAK,UAAAA,QAAA,EAAMK,KAAAA;AAAK,SAAM,CACjB,EAACjB,MAAM,gBACLO,cAAA,CAAA,KAAA,EAAA;AACEC,UAAAA,SAAS,EAAEC,SAAI,CACbhB,kBAAkB,CAACC,MAAM,CAAC,GAAG,OAAO,GAAG,OAAO,EAC9C,4BAA4B,CAC5B;UAAAkB,QAAA,eAEFL,cAAA,CAACa,YAAY,EAAA;AAACZ,YAAAA,SAAS,EAAC,4BAA4B;YAACa,OAAO,EAAErB,MAAM,CAACqB,OAAQ;YAAAT,QAAA,EAC1EZ,MAAM,CAACsB,KAAAA;WACI,CAAA;SACX,CAAC,GACJ,IAAI,CAAA;AAAA,OACN,CACN,CAAA;AAAA,KAAA,EAjBUJ,GAiBL,CACN,CAAA;AAAC,GACF,CAAC,CAAA;AAET;;;;"}

package/build/definitionList/DefinitionList.mjs

@@ -1,4 +1,4 @@
-import classNames from 'classnames';
+import { clsx } from 'clsx';
 import ActionButton from '../actionButton/ActionButton.mjs';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Layout } from '../common/propsValues/layouts.mjs';
@@ -30,7 +30,7 @@ function DefinitionList({
   muted
 }) {
   return /*#__PURE__*/jsx("dl", {
-    className: classNames('tw-definition-list d-flex ', {
+    className: clsx('tw-definition-list d-flex ', {
       'text-muted': muted,
       'flex-column': layout === Layout.VERTICAL_ONE_COLUMN,
       'tw-definition-list--columns flex-column flex-row--sm': layout === Layout.VERTICAL_TWO_COLUMN,
@@ -46,11 +46,11 @@ function DefinitionList({
       children: [/*#__PURE__*/jsx("dt", {
         children: title
       }), /*#__PURE__*/jsxs("dd", {
-        className: classNames(...getAlignmentClasses(layout, action)),
+        className: clsx(...getAlignmentClasses(layout, action)),
         children: [/*#__PURE__*/jsx("div", {
           children: value
         }), action ? /*#__PURE__*/jsx("div", {
-          className: classNames(isLayoutHorizontal(layout) ? 'p-l-2' : 'p-x-2', 'tw-definition-list__action'),
+          className: clsx(isLayoutHorizontal(layout) ? 'p-l-2' : 'p-x-2', 'tw-definition-list__action'),
           children: /*#__PURE__*/jsx(ActionButton, {
             className: "tw-definition-list__button",
             onClick: action.onClick,

package/build/definitionList/DefinitionList.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DefinitionList.mjs","sources":["../../src/definitionList/DefinitionList.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport ActionButton from '../actionButton';\nimport { Layout } from '../common';\n\nexport interface DefinitionListDefinition {\n  action?: {\n    label: string;\n    onClick?: React.MouseEventHandler<HTMLButtonElement>;\n  };\n  title: React.ReactNode;\n  value: React.ReactNode;\n  key: string;\n}\n\ntype DefinitionListLayout =\n  `${Layout.VERTICAL_TWO_COLUMN | Layout.VERTICAL_ONE_COLUMN | Layout.HORIZONTAL_JUSTIFIED | Layout.HORIZONTAL_LEFT_ALIGNED | Layout.HORIZONTAL_RIGHT_ALIGNED}`;\n\nexport interface DefinitionListProps {\n  definitions?: DefinitionListDefinition[];\n  layout?: DefinitionListLayout;\n  muted?: boolean;\n}\n\nconst isLayoutHorizontal = (layout: DefinitionListLayout) =>\n  layout === Layout.HORIZONTAL_LEFT_ALIGNED ||\n  layout === Layout.HORIZONTAL_RIGHT_ALIGNED ||\n  layout === Layout.HORIZONTAL_JUSTIFIED;\n\nconst getAlignmentClasses = (\n  layout: DefinitionListLayout,\n  action: DefinitionListDefinition['action'],\n) => {\n  const classes = ['d-flex'];\n\n  if (action) {\n    if (isLayoutHorizontal(layout)) {\n      classes.push('align-items-center');\n    } else {\n      classes.push('align-items-start');\n    }\n  }\n\n  if (layout === Layout.HORIZONTAL_RIGHT_ALIGNED) {\n    classes.push('text-sm-right tw-definition-list--right-aligned-desktop');\n  } else {\n    classes.push('justify-content-between');\n  }\n\n  if (layout === Layout.HORIZONTAL_JUSTIFIED) {\n    classes.push('text-sm-justify');\n  }\n\n  return classes;\n};\n\nconst defaultDefinitions = [] satisfies DefinitionListProps['definitions'];\n\nexport default function DefinitionList({\n  definitions = defaultDefinitions,\n  layout = 'VERTICAL_TWO_COLUMN',\n  muted,\n}: DefinitionListProps) {\n  return (\n    <dl\n      className={classNames('tw-definition-list d-flex ', {\n        'text-muted': muted,\n        'flex-column': layout === Layout.VERTICAL_ONE_COLUMN,\n        'tw-definition-list--columns flex-column flex-row--sm':\n          layout === Layout.VERTICAL_TWO_COLUMN,\n        'tw-definition-list--horizontal flex-column': isLayoutHorizontal(layout),\n      })}\n    >\n      {definitions\n        .filter((definition) => definition)\n        .map(({ action, title, value, key }) => (\n          <div key={key} className=\"tw-definition-list__item\">\n            <dt>{title}</dt>\n            <dd className={classNames(...getAlignmentClasses(layout, action))}>\n              <div>{value}</div>\n              {action ? (\n                <div\n                  className={classNames(\n                    isLayoutHorizontal(layout) ? 'p-l-2' : 'p-x-2',\n                    'tw-definition-list__action',\n                  )}\n                >\n                  <ActionButton className=\"tw-definition-list__button\" onClick={action.onClick}>\n                    {action.label}\n                  </ActionButton>\n                </div>\n              ) : null}\n            </dd>\n          </div>\n        ))}\n    </dl>\n  );\n}\n"],"names":["isLayoutHorizontal","layout","Layout","HORIZONTAL_LEFT_ALIGNED","HORIZONTAL_RIGHT_ALIGNED","HORIZONTAL_JUSTIFIED","getAlignmentClasses","action","classes","push","defaultDefinitions","DefinitionList","definitions","muted","_jsx","className","classNames","VERTICAL_ONE_COLUMN","VERTICAL_TWO_COLUMN","children","filter","definition","map","title","value","key","_jsxs","ActionButton","onClick","label"],"mappings":"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"}
+{"version":3,"file":"DefinitionList.mjs","sources":["../../src/definitionList/DefinitionList.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport ActionButton from '../actionButton';\nimport { Layout } from '../common';\n\nexport interface DefinitionListDefinition {\n  action?: {\n    label: string;\n    onClick?: React.MouseEventHandler<HTMLButtonElement>;\n  };\n  title: React.ReactNode;\n  value: React.ReactNode;\n  key: string;\n}\n\ntype DefinitionListLayout =\n  `${Layout.VERTICAL_TWO_COLUMN | Layout.VERTICAL_ONE_COLUMN | Layout.HORIZONTAL_JUSTIFIED | Layout.HORIZONTAL_LEFT_ALIGNED | Layout.HORIZONTAL_RIGHT_ALIGNED}`;\n\nexport interface DefinitionListProps {\n  definitions?: DefinitionListDefinition[];\n  layout?: DefinitionListLayout;\n  muted?: boolean;\n}\n\nconst isLayoutHorizontal = (layout: DefinitionListLayout) =>\n  layout === Layout.HORIZONTAL_LEFT_ALIGNED ||\n  layout === Layout.HORIZONTAL_RIGHT_ALIGNED ||\n  layout === Layout.HORIZONTAL_JUSTIFIED;\n\nconst getAlignmentClasses = (\n  layout: DefinitionListLayout,\n  action: DefinitionListDefinition['action'],\n) => {\n  const classes = ['d-flex'];\n\n  if (action) {\n    if (isLayoutHorizontal(layout)) {\n      classes.push('align-items-center');\n    } else {\n      classes.push('align-items-start');\n    }\n  }\n\n  if (layout === Layout.HORIZONTAL_RIGHT_ALIGNED) {\n    classes.push('text-sm-right tw-definition-list--right-aligned-desktop');\n  } else {\n    classes.push('justify-content-between');\n  }\n\n  if (layout === Layout.HORIZONTAL_JUSTIFIED) {\n    classes.push('text-sm-justify');\n  }\n\n  return classes;\n};\n\nconst defaultDefinitions = [] satisfies DefinitionListProps['definitions'];\n\nexport default function DefinitionList({\n  definitions = defaultDefinitions,\n  layout = 'VERTICAL_TWO_COLUMN',\n  muted,\n}: DefinitionListProps) {\n  return (\n    <dl\n      className={clsx('tw-definition-list d-flex ', {\n        'text-muted': muted,\n        'flex-column': layout === Layout.VERTICAL_ONE_COLUMN,\n        'tw-definition-list--columns flex-column flex-row--sm':\n          layout === Layout.VERTICAL_TWO_COLUMN,\n        'tw-definition-list--horizontal flex-column': isLayoutHorizontal(layout),\n      })}\n    >\n      {definitions\n        .filter((definition) => definition)\n        .map(({ action, title, value, key }) => (\n          <div key={key} className=\"tw-definition-list__item\">\n            <dt>{title}</dt>\n            <dd className={clsx(...getAlignmentClasses(layout, action))}>\n              <div>{value}</div>\n              {action ? (\n                <div\n                  className={clsx(\n                    isLayoutHorizontal(layout) ? 'p-l-2' : 'p-x-2',\n                    'tw-definition-list__action',\n                  )}\n                >\n                  <ActionButton className=\"tw-definition-list__button\" onClick={action.onClick}>\n                    {action.label}\n                  </ActionButton>\n                </div>\n              ) : null}\n            </dd>\n          </div>\n        ))}\n    </dl>\n  );\n}\n"],"names":["isLayoutHorizontal","layout","Layout","HORIZONTAL_LEFT_ALIGNED","HORIZONTAL_RIGHT_ALIGNED","HORIZONTAL_JUSTIFIED","getAlignmentClasses","action","classes","push","defaultDefinitions","DefinitionList","definitions","muted","_jsx","className","clsx","VERTICAL_ONE_COLUMN","VERTICAL_TWO_COLUMN","children","filter","definition","map","title","value","key","_jsxs","ActionButton","onClick","label"],"mappings":";;;;;AAwBA,MAAMA,kBAAkB,GAAIC,MAA4B,IACtDA,MAAM,KAAKC,MAAM,CAACC,uBAAuB,IACzCF,MAAM,KAAKC,MAAM,CAACE,wBAAwB,IAC1CH,MAAM,KAAKC,MAAM,CAACG,oBAAoB,CAAA;AAExC,MAAMC,mBAAmB,GAAGA,CAC1BL,MAA4B,EAC5BM,MAA0C,KACxC;AACF,EAAA,MAAMC,OAAO,GAAG,CAAC,QAAQ,CAAC,CAAA;AAE1B,EAAA,IAAID,MAAM,EAAE;AACV,IAAA,IAAIP,kBAAkB,CAACC,MAAM,CAAC,EAAE;AAC9BO,MAAAA,OAAO,CAACC,IAAI,CAAC,oBAAoB,CAAC,CAAA;AACpC,KAAC,MAAM;AACLD,MAAAA,OAAO,CAACC,IAAI,CAAC,mBAAmB,CAAC,CAAA;AACnC,KAAA;AACF,GAAA;AAEA,EAAA,IAAIR,MAAM,KAAKC,MAAM,CAACE,wBAAwB,EAAE;AAC9CI,IAAAA,OAAO,CAACC,IAAI,CAAC,yDAAyD,CAAC,CAAA;AACzE,GAAC,MAAM;AACLD,IAAAA,OAAO,CAACC,IAAI,CAAC,yBAAyB,CAAC,CAAA;AACzC,GAAA;AAEA,EAAA,IAAIR,MAAM,KAAKC,MAAM,CAACG,oBAAoB,EAAE;AAC1CG,IAAAA,OAAO,CAACC,IAAI,CAAC,iBAAiB,CAAC,CAAA;AACjC,GAAA;AAEA,EAAA,OAAOD,OAAO,CAAA;AAChB,CAAC,CAAA;AAED,MAAME,kBAAkB,GAAG,EAA+C,CAAA;AAElD,SAAAC,cAAcA,CAAC;AACrCC,EAAAA,WAAW,GAAGF,kBAAkB;AAChCT,EAAAA,MAAM,GAAG,qBAAqB;AAC9BY,EAAAA,KAAAA;AACoB,CAAA,EAAA;AACpB,EAAA,oBACEC,GAAA,CAAA,IAAA,EAAA;AACEC,IAAAA,SAAS,EAAEC,IAAI,CAAC,4BAA4B,EAAE;AAC5C,MAAA,YAAY,EAAEH,KAAK;AACnB,MAAA,aAAa,EAAEZ,MAAM,KAAKC,MAAM,CAACe,mBAAmB;AACpD,MAAA,sDAAsD,EACpDhB,MAAM,KAAKC,MAAM,CAACgB,mBAAmB;MACvC,4CAA4C,EAAElB,kBAAkB,CAACC,MAAM,CAAA;AACxE,KAAA,CAAE;AAAAkB,IAAAA,QAAA,EAEFP,WAAW,CACTQ,MAAM,CAAEC,UAAU,IAAKA,UAAU,CAAC,CAClCC,GAAG,CAAC,CAAC;MAAEf,MAAM;MAAEgB,KAAK;MAAEC,KAAK;AAAEC,MAAAA,GAAAA;AAAG,KAAE,kBACjCC,IAAA,CAAA,KAAA,EAAA;AAAeX,MAAAA,SAAS,EAAC,0BAA0B;AAAAI,MAAAA,QAAA,gBACjDL,GAAA,CAAA,IAAA,EAAA;AAAAK,QAAAA,QAAA,EAAKI,KAAAA;OAAU,CACf,eAAAG,IAAA,CAAA,IAAA,EAAA;QAAIX,SAAS,EAAEC,IAAI,CAAC,GAAGV,mBAAmB,CAACL,MAAM,EAAEM,MAAM,CAAC,CAAE;AAAAY,QAAAA,QAAA,gBAC1DL,GAAA,CAAA,KAAA,EAAA;AAAAK,UAAAA,QAAA,EAAMK,KAAAA;AAAK,SAAM,CACjB,EAACjB,MAAM,gBACLO,GAAA,CAAA,KAAA,EAAA;AACEC,UAAAA,SAAS,EAAEC,IAAI,CACbhB,kBAAkB,CAACC,MAAM,CAAC,GAAG,OAAO,GAAG,OAAO,EAC9C,4BAA4B,CAC5B;UAAAkB,QAAA,eAEFL,GAAA,CAACa,YAAY,EAAA;AAACZ,YAAAA,SAAS,EAAC,4BAA4B;YAACa,OAAO,EAAErB,MAAM,CAACqB,OAAQ;YAAAT,QAAA,EAC1EZ,MAAM,CAACsB,KAAAA;WACI,CAAA;SACX,CAAC,GACJ,IAAI,CAAA;AAAA,OACN,CACN,CAAA;AAAA,KAAA,EAjBUJ,GAiBL,CACN,CAAA;AAAC,GACF,CAAC,CAAA;AAET;;;;"}

package/build/dimmer/Dimmer.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var componentsTheming = require('@wise/components-theming');
-var classNames = require('classnames');
+var clsx = require('clsx');
 var React = require('react');
 var reactTransitionGroup = require('react-transition-group');
 var deviceDetection = require('../common/deviceDetection/deviceDetection.js');
@@ -13,10 +13,6 @@ var DimmerManager = require('./dimmerManager/DimmerManager.js');
 var jsxRuntime = require('react/jsx-runtime');
 var DOMOperations = require('../common/DOMOperations/DOMOperations.js');
 
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var classNames__default = /*#__PURE__*/_interopDefault(classNames);
-
 const EXIT_ANIMATION = 350;
 const dimmerManager = new DimmerManager();
 const handleTouchMove = event => {
@@ -102,13 +98,13 @@ const Dimmer = ({
         exit: EXIT_ANIMATION
       },
       classNames: {
-        enter: classNames__default.default({
+        enter: clsx.clsx({
           'dimmer--enter-fade': fadeContentOnEnter
         }),
-        enterDone: classNames__default.default('dimmer--enter-done', {
+        enterDone: clsx.clsx('dimmer--enter-done', {
           'dimmer--enter-fade': fadeContentOnEnter
         }),
-        exit: classNames__default.default('dimmer--exit', {
+        exit: clsx.clsx('dimmer--exit', {
           'dimmer--exit-fade': fadeContentOnExit
         })
       },
@@ -120,14 +116,14 @@ const Dimmer = ({
         children: /*#__PURE__*/jsxRuntime.jsx(FocusBoundary, {
           children: /*#__PURE__*/jsxRuntime.jsx("div", {
             ref: dimmerReference,
-            className: classNames__default.default('dimmer', {
+            className: clsx.clsx('dimmer', {
               'dimmer--scrollable': scrollable,
               'dimmer--transparent': transparent
             }, className),
             role: "presentation",
             onClick: handleClick,
             children: /*#__PURE__*/jsxRuntime.jsx("div", {
-              className: classNames__default.default('dimmer-content-positioner', contentPosition != null && ['d-flex justify-content-center', {
+              className: clsx.clsx('dimmer-content-positioner', contentPosition != null && ['d-flex justify-content-center', {
                 'align-items-start': contentPosition === 'top',
                 'align-items-center': contentPosition === 'center',
                 'align-items-end': contentPosition === 'bottom'