@elliemae/ds-system 3.0.4-rc.2 → 3.1.0-next.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/cjs/th.js CHANGED
@@ -74,4 +74,5 @@ th.font = th("fonts");
74
74
  th.color = th("colors");
75
75
  th.breakpoint = th("breakpoints");
76
76
  th.media = th("media");
77
+ th.zIndex = th("zIndex");
77
78
  //# sourceMappingURL=th.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/th.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable indent */\nimport type { Theme } from '@elliemae/pui-theme';\n\nexport const hexToRgba = (hex: string, alpha: string) => {\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n\n if (result) {\n return `rgba(${parseInt(result[1], 16)}, ${parseInt(result[2], 16)}, ${parseInt(result[3], 16)}, ${alpha})`;\n }\n return ``;\n};\n\ntype ThemeStringGetter = ({ theme }: { theme: Theme }) => string;\n\ntype ThGetter = (value: string, dfault?: string) => ThemeStringGetter;\n\ntype ThConstructor = ((property: keyof Theme) => ThGetter) & {\n space: ThGetter;\n fontSize: ThGetter;\n fontWeight: ThGetter;\n lineHeight: ThGetter;\n letterSpacing: ThGetter;\n font: ThGetter;\n color: ThGetter;\n breakpoint: ThGetter;\n media: ThGetter;\n};\n\nconst colorGetter: ThGetter =\n (value, dfault = '') =>\n ({ theme }) => {\n const colorValues = value.split('-');\n\n if (colorValues.length === 1) return colorValues[0];\n\n if (colorValues.length > 3) return dfault;\n\n const [colorType, colorValue, alpha] = colorValues as [\n keyof Theme['colors'],\n keyof Theme['colors'][keyof Theme['colors']],\n string,\n ];\n\n const themeColor = theme.colors && theme.colors[colorType][colorValue];\n\n if (!themeColor) return dfault;\n\n if (alpha) {\n const alphaFloatingNumber = `0.${alpha.slice(1)}`;\n\n return hexToRgba(themeColor, alphaFloatingNumber);\n }\n\n return themeColor;\n };\n\nconst genericGetter =\n (property: keyof Theme) =>\n (value: string, dfault = ''): ThemeStringGetter =>\n ({ theme }) => {\n const parts = value.split('-');\n let result = theme[property];\n parts.forEach((part) => {\n if (result) result = result[part as keyof typeof result];\n });\n return (result as unknown as string) ?? dfault;\n };\n\nexport const th: ThConstructor = (property): ThGetter => {\n switch (property) {\n case 'colors' as keyof Theme:\n return colorGetter;\n default:\n return genericGetter(property);\n }\n};\n\nth.space = th('space');\nth.fontSize = th('fontSizes');\nth.fontWeight = th('fontWeights');\nth.lineHeight = th('lineHeights');\nth.letterSpacing = th('letterSpacings');\nth.font = th('fonts');\nth.color = th('colors');\nth.breakpoint = th('breakpoints');\nth.media = th('media');\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGhB,MAAM,YAAY,CAAC,KAAa,UAAkB;AACvD,QAAM,SAAS,4CAA4C,KAAK,GAAG;AAEnE,MAAI,QAAQ;AACV,WAAO,QAAQ,SAAS,OAAO,IAAI,EAAE,MAAM,SAAS,OAAO,IAAI,EAAE,MAAM,SAAS,OAAO,IAAI,EAAE,MAAM;AAAA,EACrG;AACA,SAAO;AACT;AAkBA,MAAM,cACJ,CAAC,OAAO,SAAS,OACjB,CAAC,EAAE,YAAY;AACb,QAAM,cAAc,MAAM,MAAM,GAAG;AAEnC,MAAI,YAAY,WAAW;AAAG,WAAO,YAAY;AAEjD,MAAI,YAAY,SAAS;AAAG,WAAO;AAEnC,QAAM,CAAC,WAAW,YAAY,SAAS;AAMvC,QAAM,aAAa,MAAM,UAAU,MAAM,OAAO,WAAW;AAE3D,MAAI,CAAC;AAAY,WAAO;AAExB,MAAI,OAAO;AACT,UAAM,sBAAsB,KAAK,MAAM,MAAM,CAAC;AAE9C,WAAO,UAAU,YAAY,mBAAmB;AAAA,EAClD;AAEA,SAAO;AACT;AAEF,MAAM,gBACJ,CAAC,aACD,CAAC,OAAe,SAAS,OACzB,CAAC,EAAE,YAAY;AACb,QAAM,QAAQ,MAAM,MAAM,GAAG;AAC7B,MAAI,SAAS,MAAM;AACnB,QAAM,QAAQ,CAAC,SAAS;AACtB,QAAI;AAAQ,eAAS,OAAO;AAAA,EAC9B,CAAC;AACD,SAAQ,UAAgC;AAC1C;AAEK,MAAM,KAAoB,CAAC,aAAuB;AACvD,UAAQ;AAAA,SACD;AACH,aAAO;AAAA;AAEP,aAAO,cAAc,QAAQ;AAAA;AAEnC;AAEA,GAAG,QAAQ,GAAG,OAAO;AACrB,GAAG,WAAW,GAAG,WAAW;AAC5B,GAAG,aAAa,GAAG,aAAa;AAChC,GAAG,aAAa,GAAG,aAAa;AAChC,GAAG,gBAAgB,GAAG,gBAAgB;AACtC,GAAG,OAAO,GAAG,OAAO;AACpB,GAAG,QAAQ,GAAG,QAAQ;AACtB,GAAG,aAAa,GAAG,aAAa;AAChC,GAAG,QAAQ,GAAG,OAAO;",
4
+ "sourcesContent": ["/* eslint-disable indent */\nimport type { Theme } from '@elliemae/pui-theme';\n\nexport const hexToRgba = (hex: string, alpha: string) => {\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n\n if (result) {\n return `rgba(${parseInt(result[1], 16)}, ${parseInt(result[2], 16)}, ${parseInt(result[3], 16)}, ${alpha})`;\n }\n return ``;\n};\n\ntype ThemeStringGetter = ({ theme }: { theme: Theme }) => string;\n\ntype ThGetter = (value: string, dfault?: string) => ThemeStringGetter;\n\ntype ThConstructor = ((property: keyof Theme) => ThGetter) & {\n space: ThGetter;\n fontSize: ThGetter;\n fontWeight: ThGetter;\n lineHeight: ThGetter;\n letterSpacing: ThGetter;\n font: ThGetter;\n color: ThGetter;\n breakpoint: ThGetter;\n media: ThGetter;\n zIndex: ThGetter;\n};\n\nconst colorGetter: ThGetter =\n (value, dfault = '') =>\n ({ theme }) => {\n const colorValues = value.split('-');\n\n if (colorValues.length === 1) return colorValues[0];\n\n if (colorValues.length > 3) return dfault;\n\n const [colorType, colorValue, alpha] = colorValues as [\n keyof Theme['colors'],\n keyof Theme['colors'][keyof Theme['colors']],\n string,\n ];\n\n const themeColor = theme.colors && theme.colors[colorType][colorValue];\n\n if (!themeColor) return dfault;\n\n if (alpha) {\n const alphaFloatingNumber = `0.${alpha.slice(1)}`;\n\n return hexToRgba(themeColor, alphaFloatingNumber);\n }\n\n return themeColor;\n };\n\nconst genericGetter =\n (property: keyof Theme) =>\n (value: string, dfault = ''): ThemeStringGetter =>\n ({ theme }) => {\n const parts = value.split('-');\n let result = theme[property];\n parts.forEach((part) => {\n if (result) result = result[part as keyof typeof result];\n });\n return (result as unknown as string) ?? dfault;\n };\n\nexport const th: ThConstructor = (property): ThGetter => {\n switch (property) {\n case 'colors' as keyof Theme:\n return colorGetter;\n default:\n return genericGetter(property);\n }\n};\n\nth.space = th('space');\nth.fontSize = th('fontSizes');\nth.fontWeight = th('fontWeights');\nth.lineHeight = th('lineHeights');\nth.letterSpacing = th('letterSpacings');\nth.font = th('fonts');\nth.color = th('colors');\nth.breakpoint = th('breakpoints');\nth.media = th('media');\nth.zIndex = th('zIndex');\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGhB,MAAM,YAAY,CAAC,KAAa,UAAkB;AACvD,QAAM,SAAS,4CAA4C,KAAK,GAAG;AAEnE,MAAI,QAAQ;AACV,WAAO,QAAQ,SAAS,OAAO,IAAI,EAAE,MAAM,SAAS,OAAO,IAAI,EAAE,MAAM,SAAS,OAAO,IAAI,EAAE,MAAM;AAAA,EACrG;AACA,SAAO;AACT;AAmBA,MAAM,cACJ,CAAC,OAAO,SAAS,OACjB,CAAC,EAAE,YAAY;AACb,QAAM,cAAc,MAAM,MAAM,GAAG;AAEnC,MAAI,YAAY,WAAW;AAAG,WAAO,YAAY;AAEjD,MAAI,YAAY,SAAS;AAAG,WAAO;AAEnC,QAAM,CAAC,WAAW,YAAY,SAAS;AAMvC,QAAM,aAAa,MAAM,UAAU,MAAM,OAAO,WAAW;AAE3D,MAAI,CAAC;AAAY,WAAO;AAExB,MAAI,OAAO;AACT,UAAM,sBAAsB,KAAK,MAAM,MAAM,CAAC;AAE9C,WAAO,UAAU,YAAY,mBAAmB;AAAA,EAClD;AAEA,SAAO;AACT;AAEF,MAAM,gBACJ,CAAC,aACD,CAAC,OAAe,SAAS,OACzB,CAAC,EAAE,YAAY;AACb,QAAM,QAAQ,MAAM,MAAM,GAAG;AAC7B,MAAI,SAAS,MAAM;AACnB,QAAM,QAAQ,CAAC,SAAS;AACtB,QAAI;AAAQ,eAAS,OAAO;AAAA,EAC9B,CAAC;AACD,SAAQ,UAAgC;AAC1C;AAEK,MAAM,KAAoB,CAAC,aAAuB;AACvD,UAAQ;AAAA,SACD;AACH,aAAO;AAAA;AAEP,aAAO,cAAc,QAAQ;AAAA;AAEnC;AAEA,GAAG,QAAQ,GAAG,OAAO;AACrB,GAAG,WAAW,GAAG,WAAW;AAC5B,GAAG,aAAa,GAAG,aAAa;AAChC,GAAG,aAAa,GAAG,aAAa;AAChC,GAAG,gBAAgB,GAAG,gBAAgB;AACtC,GAAG,OAAO,GAAG,OAAO;AACpB,GAAG,QAAQ,GAAG,QAAQ;AACtB,GAAG,aAAa,GAAG,aAAa;AAChC,GAAG,QAAQ,GAAG,OAAO;AACrB,GAAG,SAAS,GAAG,QAAQ;",
6
6
  "names": []
7
7
  }
package/dist/esm/th.js CHANGED
@@ -48,6 +48,7 @@ th.font = th("fonts");
48
48
  th.color = th("colors");
49
49
  th.breakpoint = th("breakpoints");
50
50
  th.media = th("media");
51
+ th.zIndex = th("zIndex");
51
52
  export {
52
53
  hexToRgba,
53
54
  th
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/th.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable indent */\nimport type { Theme } from '@elliemae/pui-theme';\n\nexport const hexToRgba = (hex: string, alpha: string) => {\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n\n if (result) {\n return `rgba(${parseInt(result[1], 16)}, ${parseInt(result[2], 16)}, ${parseInt(result[3], 16)}, ${alpha})`;\n }\n return ``;\n};\n\ntype ThemeStringGetter = ({ theme }: { theme: Theme }) => string;\n\ntype ThGetter = (value: string, dfault?: string) => ThemeStringGetter;\n\ntype ThConstructor = ((property: keyof Theme) => ThGetter) & {\n space: ThGetter;\n fontSize: ThGetter;\n fontWeight: ThGetter;\n lineHeight: ThGetter;\n letterSpacing: ThGetter;\n font: ThGetter;\n color: ThGetter;\n breakpoint: ThGetter;\n media: ThGetter;\n};\n\nconst colorGetter: ThGetter =\n (value, dfault = '') =>\n ({ theme }) => {\n const colorValues = value.split('-');\n\n if (colorValues.length === 1) return colorValues[0];\n\n if (colorValues.length > 3) return dfault;\n\n const [colorType, colorValue, alpha] = colorValues as [\n keyof Theme['colors'],\n keyof Theme['colors'][keyof Theme['colors']],\n string,\n ];\n\n const themeColor = theme.colors && theme.colors[colorType][colorValue];\n\n if (!themeColor) return dfault;\n\n if (alpha) {\n const alphaFloatingNumber = `0.${alpha.slice(1)}`;\n\n return hexToRgba(themeColor, alphaFloatingNumber);\n }\n\n return themeColor;\n };\n\nconst genericGetter =\n (property: keyof Theme) =>\n (value: string, dfault = ''): ThemeStringGetter =>\n ({ theme }) => {\n const parts = value.split('-');\n let result = theme[property];\n parts.forEach((part) => {\n if (result) result = result[part as keyof typeof result];\n });\n return (result as unknown as string) ?? dfault;\n };\n\nexport const th: ThConstructor = (property): ThGetter => {\n switch (property) {\n case 'colors' as keyof Theme:\n return colorGetter;\n default:\n return genericGetter(property);\n }\n};\n\nth.space = th('space');\nth.fontSize = th('fontSizes');\nth.fontWeight = th('fontWeights');\nth.lineHeight = th('lineHeights');\nth.letterSpacing = th('letterSpacings');\nth.font = th('fonts');\nth.color = th('colors');\nth.breakpoint = th('breakpoints');\nth.media = th('media');\n"],
5
- "mappings": "AAAA;ACGO,MAAM,YAAY,CAAC,KAAa,UAAkB;AACvD,QAAM,SAAS,4CAA4C,KAAK,GAAG;AAEnE,MAAI,QAAQ;AACV,WAAO,QAAQ,SAAS,OAAO,IAAI,EAAE,MAAM,SAAS,OAAO,IAAI,EAAE,MAAM,SAAS,OAAO,IAAI,EAAE,MAAM;AAAA,EACrG;AACA,SAAO;AACT;AAkBA,MAAM,cACJ,CAAC,OAAO,SAAS,OACjB,CAAC,EAAE,YAAY;AACb,QAAM,cAAc,MAAM,MAAM,GAAG;AAEnC,MAAI,YAAY,WAAW;AAAG,WAAO,YAAY;AAEjD,MAAI,YAAY,SAAS;AAAG,WAAO;AAEnC,QAAM,CAAC,WAAW,YAAY,SAAS;AAMvC,QAAM,aAAa,MAAM,UAAU,MAAM,OAAO,WAAW;AAE3D,MAAI,CAAC;AAAY,WAAO;AAExB,MAAI,OAAO;AACT,UAAM,sBAAsB,KAAK,MAAM,MAAM,CAAC;AAE9C,WAAO,UAAU,YAAY,mBAAmB;AAAA,EAClD;AAEA,SAAO;AACT;AAEF,MAAM,gBACJ,CAAC,aACD,CAAC,OAAe,SAAS,OACzB,CAAC,EAAE,YAAY;AACb,QAAM,QAAQ,MAAM,MAAM,GAAG;AAC7B,MAAI,SAAS,MAAM;AACnB,QAAM,QAAQ,CAAC,SAAS;AACtB,QAAI;AAAQ,eAAS,OAAO;AAAA,EAC9B,CAAC;AACD,SAAQ,UAAgC;AAC1C;AAEK,MAAM,KAAoB,CAAC,aAAuB;AACvD,UAAQ;AAAA,SACD;AACH,aAAO;AAAA;AAEP,aAAO,cAAc,QAAQ;AAAA;AAEnC;AAEA,GAAG,QAAQ,GAAG,OAAO;AACrB,GAAG,WAAW,GAAG,WAAW;AAC5B,GAAG,aAAa,GAAG,aAAa;AAChC,GAAG,aAAa,GAAG,aAAa;AAChC,GAAG,gBAAgB,GAAG,gBAAgB;AACtC,GAAG,OAAO,GAAG,OAAO;AACpB,GAAG,QAAQ,GAAG,QAAQ;AACtB,GAAG,aAAa,GAAG,aAAa;AAChC,GAAG,QAAQ,GAAG,OAAO;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable indent */\nimport type { Theme } from '@elliemae/pui-theme';\n\nexport const hexToRgba = (hex: string, alpha: string) => {\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n\n if (result) {\n return `rgba(${parseInt(result[1], 16)}, ${parseInt(result[2], 16)}, ${parseInt(result[3], 16)}, ${alpha})`;\n }\n return ``;\n};\n\ntype ThemeStringGetter = ({ theme }: { theme: Theme }) => string;\n\ntype ThGetter = (value: string, dfault?: string) => ThemeStringGetter;\n\ntype ThConstructor = ((property: keyof Theme) => ThGetter) & {\n space: ThGetter;\n fontSize: ThGetter;\n fontWeight: ThGetter;\n lineHeight: ThGetter;\n letterSpacing: ThGetter;\n font: ThGetter;\n color: ThGetter;\n breakpoint: ThGetter;\n media: ThGetter;\n zIndex: ThGetter;\n};\n\nconst colorGetter: ThGetter =\n (value, dfault = '') =>\n ({ theme }) => {\n const colorValues = value.split('-');\n\n if (colorValues.length === 1) return colorValues[0];\n\n if (colorValues.length > 3) return dfault;\n\n const [colorType, colorValue, alpha] = colorValues as [\n keyof Theme['colors'],\n keyof Theme['colors'][keyof Theme['colors']],\n string,\n ];\n\n const themeColor = theme.colors && theme.colors[colorType][colorValue];\n\n if (!themeColor) return dfault;\n\n if (alpha) {\n const alphaFloatingNumber = `0.${alpha.slice(1)}`;\n\n return hexToRgba(themeColor, alphaFloatingNumber);\n }\n\n return themeColor;\n };\n\nconst genericGetter =\n (property: keyof Theme) =>\n (value: string, dfault = ''): ThemeStringGetter =>\n ({ theme }) => {\n const parts = value.split('-');\n let result = theme[property];\n parts.forEach((part) => {\n if (result) result = result[part as keyof typeof result];\n });\n return (result as unknown as string) ?? dfault;\n };\n\nexport const th: ThConstructor = (property): ThGetter => {\n switch (property) {\n case 'colors' as keyof Theme:\n return colorGetter;\n default:\n return genericGetter(property);\n }\n};\n\nth.space = th('space');\nth.fontSize = th('fontSizes');\nth.fontWeight = th('fontWeights');\nth.lineHeight = th('lineHeights');\nth.letterSpacing = th('letterSpacings');\nth.font = th('fonts');\nth.color = th('colors');\nth.breakpoint = th('breakpoints');\nth.media = th('media');\nth.zIndex = th('zIndex');\n"],
5
+ "mappings": "AAAA;ACGO,MAAM,YAAY,CAAC,KAAa,UAAkB;AACvD,QAAM,SAAS,4CAA4C,KAAK,GAAG;AAEnE,MAAI,QAAQ;AACV,WAAO,QAAQ,SAAS,OAAO,IAAI,EAAE,MAAM,SAAS,OAAO,IAAI,EAAE,MAAM,SAAS,OAAO,IAAI,EAAE,MAAM;AAAA,EACrG;AACA,SAAO;AACT;AAmBA,MAAM,cACJ,CAAC,OAAO,SAAS,OACjB,CAAC,EAAE,YAAY;AACb,QAAM,cAAc,MAAM,MAAM,GAAG;AAEnC,MAAI,YAAY,WAAW;AAAG,WAAO,YAAY;AAEjD,MAAI,YAAY,SAAS;AAAG,WAAO;AAEnC,QAAM,CAAC,WAAW,YAAY,SAAS;AAMvC,QAAM,aAAa,MAAM,UAAU,MAAM,OAAO,WAAW;AAE3D,MAAI,CAAC;AAAY,WAAO;AAExB,MAAI,OAAO;AACT,UAAM,sBAAsB,KAAK,MAAM,MAAM,CAAC;AAE9C,WAAO,UAAU,YAAY,mBAAmB;AAAA,EAClD;AAEA,SAAO;AACT;AAEF,MAAM,gBACJ,CAAC,aACD,CAAC,OAAe,SAAS,OACzB,CAAC,EAAE,YAAY;AACb,QAAM,QAAQ,MAAM,MAAM,GAAG;AAC7B,MAAI,SAAS,MAAM;AACnB,QAAM,QAAQ,CAAC,SAAS;AACtB,QAAI;AAAQ,eAAS,OAAO;AAAA,EAC9B,CAAC;AACD,SAAQ,UAAgC;AAC1C;AAEK,MAAM,KAAoB,CAAC,aAAuB;AACvD,UAAQ;AAAA,SACD;AACH,aAAO;AAAA;AAEP,aAAO,cAAc,QAAQ;AAAA;AAEnC;AAEA,GAAG,QAAQ,GAAG,OAAO;AACrB,GAAG,WAAW,GAAG,WAAW;AAC5B,GAAG,aAAa,GAAG,aAAa;AAChC,GAAG,aAAa,GAAG,aAAa;AAChC,GAAG,gBAAgB,GAAG,gBAAgB;AACtC,GAAG,OAAO,GAAG,OAAO;AACpB,GAAG,QAAQ,GAAG,QAAQ;AACtB,GAAG,aAAa,GAAG,aAAa;AAChC,GAAG,QAAQ,GAAG,OAAO;AACrB,GAAG,SAAS,GAAG,QAAQ;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-system",
3
- "version": "3.0.4-rc.2",
3
+ "version": "3.1.0-next.0",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - System",
6
6
  "files": [
@@ -98,16 +98,16 @@
98
98
  "typeSafety": false
99
99
  },
100
100
  "dependencies": {
101
- "@elliemae/ds-utilities": "3.0.4-rc.2",
101
+ "@elliemae/ds-utilities": "3.1.0-next.0",
102
102
  "polished": "~3.6.7"
103
103
  },
104
104
  "devDependencies": {
105
- "@elliemae/pui-theme": "~2.4.1",
105
+ "@elliemae/pui-theme": "~2.5.0",
106
106
  "@testing-library/jest-dom": "~5.16.2",
107
107
  "styled-components": "~5.3.3"
108
108
  },
109
109
  "peerDependencies": {
110
- "@elliemae/pui-theme": "^2.4.1",
110
+ "@elliemae/pui-theme": "^2.5.0",
111
111
  "lodash": "^4.17.21",
112
112
  "react": "~17.0.2",
113
113
  "react-dom": "^17.0.2",