@foxford/ui 2.19.2 → 2.20.0-beta-74e0253-20240306

package/mixins/create-responsive-props.js

@@ -1,2 +1,2 @@
-import e from'@babel/runtime/helpers/taggedTemplateLiteral';import{css as r}from'styled-components';import{screenMinM as s,screenMaxM as a,screenMaxS as n,screenMinL as t,screenMaxL as o,screenMaxXs as p,screenMaxXxs as c}from'./screen.js';import{desktopFirst as i,getMediaQueryByResponsiveProp as v}from'./shared.js';var u,M;function m(m,h){var l=new RegExp("^(".concat(m.join('|'),")$"));var x=new RegExp("^(".concat(m.join('|'),")(XXS|XS|S|M|L|XL)$"));var X=/(XXS|XS|S|M|L|XL)$/;var g=[s,a,n];var f=[t,o,a,n,p,c];return s=>{var a=Object.keys(s).reduce(((e,r)=>(l.test(r)?e[0].push(r):x.test(r)&&e[1].push(r),e)),[[],[]]);var n=a[0].reduce(((r,a)=>{var n=s[a];if(Array.isArray(n)){if(n.length>0){var t=[];var o=n.length>g.length?f:g;for(var p=0;p<n.length&&o[p];p++)t.push(o[p]()(u||(u=e(["",""])),h(a,n[p],s)));r.push(...t)}}else r.push(h(a,n,s));return r}),[]);var t=a[1].sort(i).map((r=>v(r)()(M||(M=e(["",""])),h(r.replace(X,''),s[r],s))));return r([""," ",""],n,t)}}export{m as createResponsivePropsMixin};
+import e from'@babel/runtime/helpers/taggedTemplateLiteral';import{css as r}from'styled-components';import{screenMinM as s,screenMaxM as a,screenMaxS as t,screenMinL as n,screenMaxL as c,screenMaxXs as o,screenMaxXxs as p}from'./screen.js';import{desktopFirst as i,getMediaQueryByResponsiveProp as v}from'./shared.js';var u,h;function l(l,M){var g=new RegExp("^(".concat(l.join('|'),")$"));var m=new RegExp("^(".concat(l.join('|'),")(XXS|XS|S|M|L|XL)$"));var x=/(XXS|XS|S|M|L|XL)$/;var X=[s,a,t];var y=[n,c,a,t,o,p];return s=>{var a=Object.keys(s).reduce(((e,r)=>(g.test(r)?e[0].push(r):m.test(r)&&e[1].push(r),e)),[[],[]]);var t=a[0].reduce(((r,a)=>{var t=s[a];if(Array.isArray(t)){if(t.length>0){var n=[];var c=t.length>X.length?y:X;for(var o=0;o<t.length&&c[o];o++){var p=M(a,t[o],s);Object.keys(p).length>0&&n.push(c[o]()(u||(u=e(["",""])),p))}r.push(...n)}}else{var i=M(a,t,s);Object.keys(i).length>0&&r.push(i)}return r}),[]);var n=a[1].sort(i).reduce(((r,a)=>{var t=M(a.replace(x,''),s[a],s);return Object.keys(t).length>0&&r.push(v(a)()(h||(h=e(["",""])),t)),r}),[]);return r([""," ",""],t,n)}}export{l as createResponsivePropsMixin};
 //# sourceMappingURL=create-responsive-props.js.map

package/mixins/create-responsive-props.js.map

@@ -1 +1 @@
-{"version":3,"file":"create-responsive-props.js","sources":["../../../src/mixins/create-responsive-props.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { css } from 'styled-components'\nimport type { ThemedStyledProps, DefaultTheme, CSSObject, FlattenInterpolation, ThemeProps } from 'styled-components'\nimport { screenMinM, screenMaxM, screenMaxS, screenMinL, screenMaxL, screenMaxXs, screenMaxXxs } from 'mixins/screen'\nimport { getMediaQueryByResponsiveProp, desktopFirst } from 'mixins/shared'\nimport type { MediaQuery } from 'mixins/screen'\nimport type { Breakpoint } from 'shared/types'\n\ntype ResponsivePropKey = 'size' | keyof CSSProperties\n\ntype ResponsiveProps<K extends ResponsivePropKey, V> = {\n  [key in K]?: V | [desktop: V, tablet: V, mobile: V] | [xl: V, l: V, m: V, s: V, xs: V, xxs: V]\n} & {\n  [key in `${K}${Breakpoint}`]?: V\n}\n\ntype MediaFunction = ReturnType<ReturnType<MediaQuery>>\n\n/**\n *\n * Factory to create mixins to enable responsive interface for any set of props\n */\nfunction createResponsivePropsMixin<K extends ResponsivePropKey, V, P extends ResponsiveProps<K, V>>(\n  propsKeys: K[],\n  buildCSSObject: (propKey: K, propValue: V, props: ThemedStyledProps<P, DefaultTheme>) => CSSObject\n): (props: ThemedStyledProps<P, DefaultTheme>) => FlattenInterpolation<ThemeProps<DefaultTheme>> {\n  const propsRegExp = new RegExp(`^(${propsKeys.join('|')})$`)\n  const breakpointsPropsRegExp = new RegExp(`^(${propsKeys.join('|')})(XXS|XS|S|M|L|XL)$`)\n  const breakpointsRegExp = /(XXS|XS|S|M|L|XL)$/\n\n  const deviceQueries = [screenMinM, screenMaxM, screenMaxS]\n  const breakpointsQueries = [screenMinL, screenMaxL, screenMaxM, screenMaxS, screenMaxXs, screenMaxXxs]\n\n  return (props) => {\n    const propsKeys = Object.keys(props).reduce(\n      (groups, propKey) => {\n        if (propsRegExp.test(propKey)) groups[0].push(propKey)\n        else if (breakpointsPropsRegExp.test(propKey)) groups[1].push(propKey)\n\n        return groups\n      },\n      [[], []] as [string[], string[]]\n    )\n\n    const interpolations = propsKeys[0].reduce((acc, propKey) => {\n      const propValue: V | V[] = props[propKey]\n\n      if (!Array.isArray(propValue)) {\n        acc.push(buildCSSObject(propKey as K, propValue, props))\n      } else if (propValue.length > 0) {\n        const mediaFunctions: MediaFunction[] = []\n        const queries = propValue.length > deviceQueries.length ? breakpointsQueries : deviceQueries\n\n        for (let i = 0; i < propValue.length; i++) {\n          if (!queries[i]) break\n          mediaFunctions.push(queries[i]()`${buildCSSObject(propKey as K, propValue[i], props)}`)\n        }\n\n        acc.push(...mediaFunctions)\n      }\n\n      return acc\n    }, [] as (CSSObject | MediaFunction)[])\n\n    const breakpointsInterpolations = propsKeys[1]\n      .sort(desktopFirst)\n      .map<MediaFunction>(\n        (propKey) =>\n          getMediaQueryByResponsiveProp(propKey)()`${buildCSSObject(\n            propKey.replace(breakpointsRegExp, '') as K,\n            props[propKey],\n            props\n          )}`\n      )\n\n    return css`\n      ${interpolations}\n      ${breakpointsInterpolations}\n    `\n  }\n}\n\nexport type { ResponsiveProps }\n\nexport { createResponsivePropsMixin }\n"],"names":["createResponsivePropsMixin","propsKeys","buildCSSObject","propsRegExp","RegExp","concat","join","breakpointsPropsRegExp","breakpointsRegExp","deviceQueries","screenMinM","screenMaxM","screenMaxS","breakpointsQueries","screenMinL","screenMaxL","screenMaxXs","screenMaxXxs","props","Object","keys","reduce","groups","propKey","test","push","interpolations","acc","propValue","Array","isArray","length","mediaFunctions","queries","i","_templateObject","_taggedTemplateLiteral","breakpointsInterpolations","sort","desktopFirst","map","getMediaQueryByResponsiveProp","replace","css"],"mappings":"sUAsBA,SAASA,EACPC,EACAC,GAEA,IAAMC,EAAc,IAAIC,OAAJ,KAAAC,OAAgBJ,EAAUK,KAAK,KAAnD,OACA,IAAMC,EAAyB,IAAIH,OAAJ,KAAAC,OAAgBJ,EAAUK,KAAK,KAA9D,wBACA,IAAME,EAAoB,qBAE1B,IAAMC,EAAgB,CAACC,EAAYC,EAAYC,GAC/C,IAAMC,EAAqB,CAACC,EAAYC,EAAYJ,EAAYC,EAAYI,EAAaC,GAEzF,OAAQC,IACN,IAAMjB,EAAYkB,OAAOC,KAAKF,GAAOG,QAAAA,CAClCC,EAAQC,KACHpB,EAAYqB,KAAKD,GAAUD,EAAO,GAAGG,KAAKF,GACrChB,EAAuBiB,KAAKD,IAAUD,EAAO,GAAGG,KAAKF,GAEvDD,IAET,CAAC,GAAI,KAGP,IAAMI,EAAiBzB,EAAU,GAAGoB,QAAAA,CAAQM,EAAKJ,KAC/C,IAAMK,EAAqBV,EAAMK,GAEjC,GAAKM,MAAMC,QAAQF,IAEZ,GAAIA,EAAUG,OAAS,EAAG,CAC/B,IAAMC,EAAkC,GACxC,IAAMC,EAAUL,EAAUG,OAAStB,EAAcsB,OAASlB,EAAqBJ,EAE/E,IAAK,IAAIyB,EAAI,EAAGA,EAAIN,EAAUG,QACvBE,EAAQC,GADuBA,IAEpCF,EAAeP,KAAKQ,EAAQC,IAARD,CAApBE,IAAAA,EAAAC,EAAA,CAAA,GAAA,MAAmClC,EAAeqB,EAAcK,EAAUM,GAAIhB,KAGhFS,EAAIF,QAAQO,SAVZL,EAAIF,KAAKvB,EAAeqB,EAAcK,EAAWV,IAanD,OAAOS,IACN,IAEH,IAAMU,EAA4BpC,EAAU,GACzCqC,KAAKC,GACLC,KACEjB,GACCkB,EAA8BlB,EAA9BkB,EAAAA,CAA2CvC,IAAAA,EAAAA,EAAAA,CAAAA,GAAAA,MAAAA,EACzCqB,EAAQmB,QAAQlC,EAAmB,IACnCU,EAAMK,GACNL,MAIR,OAAOyB,EAAP,CAAA,GAAA,IAAA,IACIjB,EACAW"}
+{"version":3,"file":"create-responsive-props.js","sources":["../../../src/mixins/create-responsive-props.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { css } from 'styled-components'\nimport type { ThemedStyledProps, DefaultTheme, CSSObject, FlattenInterpolation, ThemeProps } from 'styled-components'\nimport { screenMinM, screenMaxM, screenMaxS, screenMinL, screenMaxL, screenMaxXs, screenMaxXxs } from 'mixins/screen'\nimport { getMediaQueryByResponsiveProp, desktopFirst } from 'mixins/shared'\nimport type { MediaQuery } from 'mixins/screen'\nimport type { Breakpoint } from 'shared/types'\n\ntype ResponsivePropKey = 'size' | keyof CSSProperties\n\ntype ResponsiveProps<K extends ResponsivePropKey, V> = {\n  [key in K]?: V | [desktop: V, tablet: V, mobile: V] | [xl: V, l: V, m: V, s: V, xs: V, xxs: V]\n} & {\n  [key in `${K}${Breakpoint}`]?: V\n}\n\ntype MediaFunction = ReturnType<ReturnType<MediaQuery>>\n\n/**\n *\n * Factory to create mixins to enable responsive interface for any set of props\n */\nfunction createResponsivePropsMixin<K extends ResponsivePropKey, V, P extends ResponsiveProps<K, V>>(\n  propsKeys: K[],\n  buildCSSObject: (propKey: K, propValue: V, props: ThemedStyledProps<P, DefaultTheme>) => CSSObject\n): (props: ThemedStyledProps<P, DefaultTheme>) => FlattenInterpolation<ThemeProps<DefaultTheme>> {\n  const propsRegExp = new RegExp(`^(${propsKeys.join('|')})$`)\n  const breakpointsPropsRegExp = new RegExp(`^(${propsKeys.join('|')})(XXS|XS|S|M|L|XL)$`)\n  const breakpointsRegExp = /(XXS|XS|S|M|L|XL)$/\n\n  const deviceQueries = [screenMinM, screenMaxM, screenMaxS]\n  const breakpointsQueries = [screenMinL, screenMaxL, screenMaxM, screenMaxS, screenMaxXs, screenMaxXxs]\n\n  return (props) => {\n    const propsKeys = Object.keys(props).reduce(\n      (groups, propKey) => {\n        if (propsRegExp.test(propKey)) groups[0].push(propKey)\n        else if (breakpointsPropsRegExp.test(propKey)) groups[1].push(propKey)\n\n        return groups\n      },\n      [[], []] as [string[], string[]]\n    )\n\n    const interpolations = propsKeys[0].reduce((acc, propKey) => {\n      const propValue: V | V[] = props[propKey]\n\n      if (!Array.isArray(propValue)) {\n        const cssObject = buildCSSObject(propKey as K, propValue, props)\n\n        if (Object.keys(cssObject).length > 0) {\n          acc.push(cssObject)\n        }\n      } else if (propValue.length > 0) {\n        const mediaFunctions: MediaFunction[] = []\n        const queries = propValue.length > deviceQueries.length ? breakpointsQueries : deviceQueries\n\n        for (let i = 0; i < propValue.length; i++) {\n          if (!queries[i]) break\n\n          const cssObject = buildCSSObject(propKey as K, propValue[i], props)\n\n          if (Object.keys(cssObject).length > 0) {\n            mediaFunctions.push(queries[i]()`${cssObject}`)\n          }\n        }\n\n        acc.push(...mediaFunctions)\n      }\n\n      return acc\n    }, [] as (CSSObject | MediaFunction)[])\n\n    const breakpointsInterpolations = propsKeys[1].sort(desktopFirst).reduce((acc, propKey) => {\n      const cssObject = buildCSSObject(propKey.replace(breakpointsRegExp, '') as K, props[propKey], props)\n\n      if (Object.keys(cssObject).length > 0) {\n        acc.push(getMediaQueryByResponsiveProp(propKey)()`${cssObject}`)\n      }\n\n      return acc\n    }, [] as MediaFunction[])\n\n    return css`\n      ${interpolations}\n      ${breakpointsInterpolations}\n    `\n  }\n}\n\nexport type { ResponsiveProps }\n\nexport { createResponsivePropsMixin }\n"],"names":["createResponsivePropsMixin","propsKeys","buildCSSObject","propsRegExp","RegExp","concat","join","breakpointsPropsRegExp","breakpointsRegExp","deviceQueries","screenMinM","screenMaxM","screenMaxS","breakpointsQueries","screenMinL","screenMaxL","screenMaxXs","screenMaxXxs","props","Object","keys","reduce","groups","propKey","test","push","interpolations","acc","propValue","Array","isArray","length","mediaFunctions","queries","i","cssObject","_templateObject","_taggedTemplateLiteral","breakpointsInterpolations","sort","desktopFirst","replace","getMediaQueryByResponsiveProp","_templateObject2","css"],"mappings":"sUAsBA,SAASA,EACPC,EACAC,GAEA,IAAMC,EAAc,IAAIC,OAAJ,KAAAC,OAAgBJ,EAAUK,KAAK,KAAnD,OACA,IAAMC,EAAyB,IAAIH,OAAJ,KAAAC,OAAgBJ,EAAUK,KAAK,KAA9D,wBACA,IAAME,EAAoB,qBAE1B,IAAMC,EAAgB,CAACC,EAAYC,EAAYC,GAC/C,IAAMC,EAAqB,CAACC,EAAYC,EAAYJ,EAAYC,EAAYI,EAAaC,GAEzF,OAAQC,IACN,IAAMjB,EAAYkB,OAAOC,KAAKF,GAAOG,QAAAA,CAClCC,EAAQC,KACHpB,EAAYqB,KAAKD,GAAUD,EAAO,GAAGG,KAAKF,GACrChB,EAAuBiB,KAAKD,IAAUD,EAAO,GAAGG,KAAKF,GAEvDD,IAET,CAAC,GAAI,KAGP,IAAMI,EAAiBzB,EAAU,GAAGoB,QAAAA,CAAQM,EAAKJ,KAC/C,IAAMK,EAAqBV,EAAMK,GAEjC,GAAKM,MAAMC,QAAQF,IAMZ,GAAIA,EAAUG,OAAS,EAAG,CAC/B,IAAMC,EAAkC,GACxC,IAAMC,EAAUL,EAAUG,OAAStB,EAAcsB,OAASlB,EAAqBJ,EAE/E,IAAK,IAAIyB,EAAI,EAAGA,EAAIN,EAAUG,QACvBE,EAAQC,GADuBA,IAAK,CAGzC,IAAMC,EAAYjC,EAAeqB,EAAcK,EAAUM,GAAIhB,GAEzDC,OAAOC,KAAKe,GAAWJ,OAAS,GAClCC,EAAeP,KAAKQ,EAAQC,IAARD,CAApBG,IAAAA,EAAAC,EAAA,CAAA,GAAA,MAAmCF,IAIvCR,EAAIF,QAAQO,QApBiB,CAC7B,IAAMG,EAAYjC,EAAeqB,EAAcK,EAAWV,GAEtDC,OAAOC,KAAKe,GAAWJ,OAAS,GAClCJ,EAAIF,KAAKU,GAmBb,OAAOR,IACN,IAEH,IAAMW,EAA4BrC,EAAU,GAAGsC,KAAKC,GAAcnB,QAAAA,CAAQM,EAAKJ,KAC7E,IAAMY,EAAYjC,EAAeqB,EAAQkB,QAAQjC,EAAmB,IAAUU,EAAMK,GAAUL,GAM9F,OAJIC,OAAOC,KAAKe,GAAWJ,OAAS,GAClCJ,EAAIF,KAAKiB,EAA8BnB,EAA9BmB,EAAAA,CAATC,IAAAA,EAAAN,EAAA,CAAA,GAAA,MAAoDF,IAG/CR,IACN,IAEH,OAAOiB,EAAP,CAAA,GAAA,IAAA,IACIlB,EACAY"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@foxford/ui",
-  "version": "2.19.2",
+  "version": "2.20.0-beta-74e0253-20240306",
   "description": "UI components library",
   "main": "index.cjs.js",
   "module": "index.js",
@@ -8,14 +8,12 @@
   "typings": "dts/index.d.ts",
   "peerDependencies": {
     "@foxford/icon-pack": ">=0.0.4 <1",
-    "@types/react-input-mask": ">=2.0",
     "@types/react-modal": ">=3.13",
     "clsx": ">=1.1",
     "ramda": ">=0.25",
     "rc-scrollbars": ">=1.1",
     "react": ">=16 <=18",
     "react-dom": ">=16 <=18",
-    "react-input-mask": ">=2.0",
     "react-modal": ">=3.15",
     "react-router-dom": ">=5.x.x",
     "react-select": "1.3.x",
@@ -39,14 +37,13 @@
   "dependencies": {
     "@babel/runtime": ">=7.0",
     "@foxford/icon-pack": ">=0.2.0 <1",
-    "classnames": ">=2.3",
     "clsx": ">=1.1",
     "ramda": ">=0.25",
     "rc-scrollbars": ">=1.1",
     "react": ">=16 <=18",
     "react-dom": ">=16 <=18",
     "react-floater": "0.8.2",
-    "react-input-mask": ">=2.0",
+    "react-input-mask": "2.0.4",
     "react-modal": ">=3.15",
     "react-router-dom": ">=5.x.x",
     "react-select": "1.3.x",
@@ -85,3 +82,4 @@
     "ui-kit"
   ]
 }
+