@elliemae/ds-system 2.3.0-alpha.9 → 2.3.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.
Files changed (105) hide show
  1. package/cjs/arithmetic.js +43 -0
  2. package/cjs/constants.js +19 -0
  3. package/cjs/globalStyles.js +25 -0
  4. package/cjs/index.js +84 -0
  5. package/cjs/mobileUtilities.js +41 -0
  6. package/cjs/spaceUtilities.js +68 -0
  7. package/cjs/styled/index.d.js +2 -0
  8. package/cjs/styled/index.js +124 -0
  9. package/cjs/styled/styleGetters.js +44 -0
  10. package/cjs/styled/types.js +12 -0
  11. package/cjs/styled/utils.js +24 -0
  12. package/cjs/th.js +43 -0
  13. package/cjs/theme.js +9 -0
  14. package/cjs/themeProviderHOC.js +29 -0
  15. package/cjs/utils.js +184 -0
  16. package/{dist/esm → esm}/arithmetic.js +25 -13
  17. package/esm/constants.js +13 -0
  18. package/esm/globalStyles.js +17 -0
  19. package/esm/index.js +11 -0
  20. package/esm/mobileUtilities.js +34 -0
  21. package/esm/spaceUtilities.js +57 -0
  22. package/esm/styled/index.d.js +1 -0
  23. package/esm/styled/index.js +115 -0
  24. package/esm/styled/styleGetters.js +38 -0
  25. package/esm/styled/types.js +1 -0
  26. package/esm/styled/utils.js +18 -0
  27. package/esm/th.js +39 -0
  28. package/esm/theme.js +5 -0
  29. package/esm/themeProviderHOC.js +20 -0
  30. package/esm/utils.js +136 -0
  31. package/package.json +45 -47
  32. package/{dist/types → types}/arithmetic.d.ts +0 -0
  33. package/{dist/types → types}/constants.d.ts +0 -0
  34. package/{dist/types → types}/globalStyles.d.ts +0 -0
  35. package/{dist/types → types}/index.d.ts +0 -0
  36. package/{dist/types → types}/mobileUtilities.d.ts +0 -0
  37. package/{dist/types → types}/spaceUtilities.d.ts +0 -0
  38. package/{dist/types → types}/styled/index.d.ts +0 -0
  39. package/{dist/types → types}/styled/styleGetters.d.ts +0 -0
  40. package/{dist/types → types}/styled/types.d.ts +0 -0
  41. package/{dist/types → types}/styled/utils.d.ts +0 -0
  42. package/{dist/types → types}/tests/arithmetic.test.d.ts +0 -0
  43. package/{dist/types → types}/th.d.ts +0 -0
  44. package/{dist/types → types}/theme.d.ts +0 -0
  45. package/{dist/types → types}/themeProviderHOC.d.ts +0 -0
  46. package/{dist/types → types}/utils.d.ts +2 -1
  47. package/dist/cjs/arithmetic.js +0 -55
  48. package/dist/cjs/arithmetic.js.map +0 -7
  49. package/dist/cjs/constants.js +0 -47
  50. package/dist/cjs/constants.js.map +0 -7
  51. package/dist/cjs/globalStyles.js +0 -47
  52. package/dist/cjs/globalStyles.js.map +0 -7
  53. package/dist/cjs/index.js +0 -43
  54. package/dist/cjs/index.js.map +0 -7
  55. package/dist/cjs/mobileUtilities.js +0 -72
  56. package/dist/cjs/mobileUtilities.js.map +0 -7
  57. package/dist/cjs/spaceUtilities.js +0 -94
  58. package/dist/cjs/spaceUtilities.js.map +0 -7
  59. package/dist/cjs/styled/index.d.js +0 -27
  60. package/dist/cjs/styled/index.d.js.map +0 -7
  61. package/dist/cjs/styled/index.js +0 -89
  62. package/dist/cjs/styled/index.js.map +0 -7
  63. package/dist/cjs/styled/styleGetters.js +0 -56
  64. package/dist/cjs/styled/styleGetters.js.map +0 -7
  65. package/dist/cjs/styled/types.js +0 -35
  66. package/dist/cjs/styled/types.js.map +0 -7
  67. package/dist/cjs/styled/utils.js +0 -47
  68. package/dist/cjs/styled/utils.js.map +0 -7
  69. package/dist/cjs/th.js +0 -58
  70. package/dist/cjs/th.js.map +0 -7
  71. package/dist/cjs/theme.js +0 -36
  72. package/dist/cjs/theme.js.map +0 -7
  73. package/dist/cjs/themeProviderHOC.js +0 -42
  74. package/dist/cjs/themeProviderHOC.js.map +0 -7
  75. package/dist/cjs/utils.js +0 -294
  76. package/dist/cjs/utils.js.map +0 -7
  77. package/dist/esm/arithmetic.js.map +0 -7
  78. package/dist/esm/constants.js +0 -18
  79. package/dist/esm/constants.js.map +0 -7
  80. package/dist/esm/globalStyles.js +0 -18
  81. package/dist/esm/globalStyles.js.map +0 -7
  82. package/dist/esm/index.js +0 -14
  83. package/dist/esm/index.js.map +0 -7
  84. package/dist/esm/mobileUtilities.js +0 -43
  85. package/dist/esm/mobileUtilities.js.map +0 -7
  86. package/dist/esm/spaceUtilities.js +0 -65
  87. package/dist/esm/spaceUtilities.js.map +0 -7
  88. package/dist/esm/styled/index.d.js +0 -2
  89. package/dist/esm/styled/index.d.js.map +0 -7
  90. package/dist/esm/styled/index.js +0 -60
  91. package/dist/esm/styled/index.js.map +0 -7
  92. package/dist/esm/styled/styleGetters.js +0 -27
  93. package/dist/esm/styled/styleGetters.js.map +0 -7
  94. package/dist/esm/styled/types.js +0 -6
  95. package/dist/esm/styled/types.js.map +0 -7
  96. package/dist/esm/styled/utils.js +0 -18
  97. package/dist/esm/styled/utils.js.map +0 -7
  98. package/dist/esm/th.js +0 -29
  99. package/dist/esm/th.js.map +0 -7
  100. package/dist/esm/theme.js +0 -7
  101. package/dist/esm/theme.js.map +0 -7
  102. package/dist/esm/themeProviderHOC.js +0 -13
  103. package/dist/esm/themeProviderHOC.js.map +0 -7
  104. package/dist/esm/utils.js +0 -265
  105. package/dist/esm/utils.js.map +0 -7
package/dist/cjs/utils.js DELETED
@@ -1,294 +0,0 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __reExport = (target, module2, copyDefault, desc) => {
13
- if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
- for (let key of __getOwnPropNames(module2))
15
- if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
- __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
- }
18
- return target;
19
- };
20
- var __toESM = (module2, isNodeMode) => {
21
- return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
- };
23
- var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
- return (module2, temp) => {
25
- return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
- };
27
- })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
- var utils_exports = {};
29
- __export(utils_exports, {
30
- active: () => active,
31
- animation: () => animation,
32
- border: () => border,
33
- boxShadow: () => boxShadow,
34
- buttonLink: () => buttonLink,
35
- clearFocus: () => clearFocus,
36
- color: () => color,
37
- createGlobalStyle: () => import_styled_components.createGlobalStyle,
38
- css: () => import_styled_components.css,
39
- disabled: () => disabled,
40
- fakeActive: () => fakeActive,
41
- fakeBorder: () => fakeBorder,
42
- flexCenter: () => flexCenter,
43
- focus: () => focus,
44
- focusAfter: () => focusAfter,
45
- hover: () => hover,
46
- iconColor: () => iconColor,
47
- keyframes: () => keyframes,
48
- kfrm: () => import_styled_components.keyframes,
49
- onlyFirefox: () => onlyFirefox,
50
- onlySafari: () => onlySafari,
51
- onlySafariAndFirefox: () => onlySafariAndFirefox,
52
- rgba: () => import_polished.rgba,
53
- safariAndFirefoxBold: () => safariAndFirefoxBold,
54
- textStyle: () => textStyle,
55
- transition: () => transition,
56
- truncate: () => truncate,
57
- useTheme: () => import_styled_components.useTheme,
58
- withTheme: () => import_styled_components.withTheme
59
- });
60
- var React = __toESM(require("react"));
61
- var import_polished = require("polished");
62
- var import_lodash = require("lodash");
63
- var import_styled_components = require("styled-components");
64
- var import_theme = require("./theme");
65
- var import_mobileUtilities = require("./mobileUtilities");
66
- function truncate(width) {
67
- return (props) => import_styled_components.css`
68
- ${!!width || props.width ? `width: ${props.width || width};` : ""}
69
- white-space: nowrap;
70
- overflow: hidden;
71
- text-overflow: ellipsis;
72
- `;
73
- }
74
- function flexCenter() {
75
- return `
76
- display: flex;
77
- justify-content: center;
78
- align-items: center;
79
- `;
80
- }
81
- function disabled() {
82
- return `
83
- cursor: not-allowed;
84
- pointer-events: none;
85
- `;
86
- }
87
- function keyframes(obj) {
88
- return import_styled_components.keyframes`${(0, import_lodash.reduce)(obj, (result, value, key) => `
89
- ${result}
90
- ${key}% {
91
- ${value}
92
- }
93
- `, "")}
94
- `;
95
- }
96
- function boxShadow(top, left, blur, color2, inset = false) {
97
- return `box-shadow: ${inset ? "inset" : ""} ${top} ${left} ${blur} ${color2};`;
98
- }
99
- function color(variant = "neutral", type = 400) {
100
- return import_styled_components.css`
101
- color: ${(props) => props.theme.colors[variant][type]};
102
- `;
103
- }
104
- function border(color2 = import_theme.theme.colors.brand[600], size = "1px", type = "solid") {
105
- return `${size} ${type} ${color2}`;
106
- }
107
- function animation(animationKeyframes, animationLength, animationTimingFn) {
108
- return (props) => import_styled_components.css`
109
- animation: ${props.animationKeyframes || animationKeyframes} ${props.animationLength || animationLength}
110
- ${props.animationTimingFn || animationTimingFn};
111
- `;
112
- }
113
- function focus(color2 = import_theme.theme.colors.brand[600]) {
114
- return () => import_styled_components.css`
115
- outline: none;
116
- border: 1px solid ${color2};
117
- box-shadow: inset 0 0 0 1px ${(0, import_polished.lighten)(0.3, color2)};
118
- border-radius: 2px;
119
- `;
120
- }
121
- function focusAfter(color2) {
122
- return import_styled_components.css`
123
- outline: none;
124
- position: relative;
125
- &:after {
126
- content: '';
127
- z-index: 10;
128
- position: absolute;
129
- top: 0;
130
- left: 0;
131
- width: 100%;
132
- height: 100%;
133
- pointer-events: none;
134
- ${focus(color2)}
135
- }
136
- `;
137
- }
138
- function active() {
139
- return (props) => import_styled_components.css`
140
- outline: none;
141
- border: 1px solid ${props.theme.colors.brand[700]};
142
- border-radius: 2px;
143
- `;
144
- }
145
- function hover() {
146
- return (props) => import_styled_components.css`
147
- outline: 1px solid ${props.theme.colors.brand[600]};
148
- outline-offset: -1px;
149
- `;
150
- }
151
- function textStyle(type, weight = "regular") {
152
- return (props) => {
153
- let cssVar = `font-weight: ${props.theme.fontWeights[weight]};`;
154
- switch (type) {
155
- case "h1":
156
- cssVar += `
157
- font-size: ${(0, import_mobileUtilities.toMobile)("2.7692rem")};
158
- line-height: normal;
159
- `;
160
- break;
161
- case "h2":
162
- cssVar += `
163
- font-size: ${(0, import_mobileUtilities.toMobile)(props.theme.fontSizes.title[800])};
164
- line-height: normal;
165
- `;
166
- break;
167
- case "h3":
168
- cssVar += `
169
- font-size: ${(0, import_mobileUtilities.toMobile)(props.theme.fontSizes.title[700])};
170
- line-height: 1.2;
171
- `;
172
- break;
173
- case "h4":
174
- cssVar += `
175
- font-size: ${(0, import_mobileUtilities.toMobile)(props.theme.fontSizes.title[600])};
176
- line-height: normal;
177
- `;
178
- break;
179
- case "h5":
180
- cssVar += `
181
- font-size: ${(0, import_mobileUtilities.toMobile)(props.theme.fontSizes.title[500])};
182
- line-height: normal;
183
- `;
184
- break;
185
- case "section-header":
186
- cssVar += `
187
- font-size: ${(0, import_mobileUtilities.toMobile)(props.theme.fontSizes.title[500])};
188
- line-height: normal;
189
- text-transform: uppercase;
190
- `;
191
- break;
192
- case "body":
193
- cssVar += `
194
- font-size: ${(0, import_mobileUtilities.toMobile)(props.theme.fontSizes.value[400])};
195
- line-height: normal;
196
- `;
197
- break;
198
- case "body-small":
199
- cssVar += `
200
- font-size: ${(0, import_mobileUtilities.toMobile)(props.theme.fontSizes.value[300])};
201
- line-height: normal;
202
- `;
203
- break;
204
- case "body-micro":
205
- cssVar += `
206
- font-size: ${(0, import_mobileUtilities.toMobile)(props.theme.fontSizes.microText[200])};
207
- line-height: normal;
208
- `;
209
- break;
210
- case "list":
211
- cssVar += `
212
- font-size: ${(0, import_mobileUtilities.toMobile)(props.theme.fontSizes.value[400])};
213
- line-height: normal;
214
- `;
215
- break;
216
- case "link":
217
- cssVar += `
218
- line-height: ${props.theme.xl};
219
- color: ${props.theme.colors.brand[600]};
220
- cursor: pointer;
221
- `;
222
- break;
223
- }
224
- return cssVar;
225
- };
226
- }
227
- function iconColor(variant = "neutral", type = 400) {
228
- return import_styled_components.css`
229
- fill: ${(props) => props.theme.colors[variant][type]};
230
- `;
231
- }
232
- function fakeBorder() {
233
- return import_styled_components.css`
234
- box-shadow: inset 0 0 0 1px ${(props) => props.theme.colors.neutral[200]};
235
- border-radius: 2px;
236
- `;
237
- }
238
- function fakeActive() {
239
- return import_styled_components.css`
240
- outline: none;
241
- box-shadow: inset 0 0 0 1px ${(props) => props.theme.colors.brand[700]};
242
- border-radius: 2px;
243
- `;
244
- }
245
- function clearFocus() {
246
- return `
247
- border: none;
248
- box-shadow: none;
249
- `;
250
- }
251
- function buttonLink() {
252
- return `
253
- background-color: transparent;
254
- border: 1px solid transparent;
255
- cursor: pointer;
256
- `;
257
- }
258
- function transition(t = "all 1s ease") {
259
- return `
260
- transition: ${t};
261
- `;
262
- }
263
- const onlySafariAndFirefox = (styles) => import_styled_components.css`
264
- @media not all and (min-resolution: 0.001dpcm) {
265
- ${styles}
266
- }
267
- @media screen and (min--moz-device-pixel-ratio: 0) {
268
- ${styles}
269
- }
270
- `;
271
- const onlySafari = (styles) => `
272
- @media not all and (min-resolution: 0.001dpcm) {
273
- ${styles}
274
- }
275
- `;
276
- const onlyFirefox = (styles) => `
277
- @media screen and (min--moz-device-pixel-ratio: 0) {
278
- ${styles}
279
- }
280
- `;
281
- const safariAndFirefoxBold = (color2) => `
282
- @media not all and (min-resolution: 0.001dpcm) {
283
- font-weight: 400;
284
- -webkit-font-smoothing: subpixel-antialiased;
285
- -webkit-text-stroke: 0.4px ${color2};
286
- }
287
- @media screen and (min--moz-device-pixel-ratio: 0) {
288
- font-weight: 400;
289
- -webkit-font-smoothing: subpixel-antialiased;
290
- -webkit-text-stroke: 0.4px ${color2};
291
- }
292
- `;
293
- module.exports = __toCommonJS(utils_exports);
294
- //# sourceMappingURL=utils.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/utils.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable no-shadow */\n/* eslint-disable max-lines */\n// https://github.com/styled-components/babel-plugin-styled-components/issues/216#issuecomment-516941240\nimport { lighten, rgba } from 'polished';\nimport { reduce } from 'lodash';\nimport { Keyframes, css, withTheme, keyframes as kfrm, createGlobalStyle, useTheme } from 'styled-components';\nimport { theme } from './theme';\nimport { toMobile } from './mobileUtilities';\n\nexport { withTheme, createGlobalStyle, rgba, useTheme, kfrm, css };\n\nexport function truncate(width?: string) {\n return (props) => css`\n ${!!width || props.width ? `width: ${props.width || width};` : ''}\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n `;\n}\n\nexport function flexCenter(): string {\n return `\n display: flex;\n justify-content: center;\n align-items: center;\n `;\n}\n\nexport function disabled(): string {\n return `\n cursor: not-allowed;\n pointer-events: none;\n `;\n}\n\nexport function keyframes(obj: Record<string, unknown>): Keyframes {\n return kfrm`${reduce(\n obj,\n (result, value, key) => `\n ${result}\n ${key}% {\n ${value}\n }\n `,\n '',\n )}\n `;\n}\n\n// eslint-disable-next-line max-params\nexport function boxShadow(top: string, left: string, blur: string, color: string, inset = false): string {\n return `box-shadow: ${inset ? 'inset' : ''} ${top} ${left} ${blur} ${color};`;\n}\n\nexport function color(variant = 'neutral', type = 400) {\n return css`\n color: ${(props) => props.theme.colors[variant][type]};\n `;\n}\n\nexport function border(color = theme.colors.brand[600], size = '1px', type = 'solid'): string {\n return `${size} ${type} ${color}`;\n}\n\nexport function animation(animationKeyframes: string, animationLength: string, animationTimingFn: string) {\n return (props) => css`\n animation: ${props.animationKeyframes || animationKeyframes} ${props.animationLength || animationLength}\n ${props.animationTimingFn || animationTimingFn};\n `;\n}\n// 0.0769\nexport function focus(color: string = theme.colors.brand[600]) {\n return () => css`\n outline: none;\n border: 1px solid ${color};\n box-shadow: inset 0 0 0 1px ${lighten(0.3, color)};\n border-radius: 2px;\n `;\n}\n\nexport function focusAfter(color: string) {\n return css`\n outline: none;\n position: relative;\n &:after {\n content: '';\n z-index: 10;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n ${focus(color)}\n }\n `;\n}\n\nexport function active() {\n return (props) => css`\n outline: none;\n border: 1px solid ${props.theme.colors.brand[700]};\n border-radius: 2px;\n `;\n}\n\nexport function hover() {\n return (props) => css`\n outline: 1px solid ${props.theme.colors.brand[600]};\n outline-offset: -1px;\n `;\n}\n\nexport function textStyle(type: string, weight = 'regular') {\n // eslint-disable-next-line complexity\n return (props): string => {\n let cssVar = `font-weight: ${props.theme.fontWeights[weight]};`;\n // eslint-disable-next-line default-case\n switch (type) {\n case 'h1':\n cssVar += `\n font-size: ${toMobile('2.7692rem')};\n line-height: normal;\n `;\n break;\n case 'h2':\n cssVar += `\n font-size: ${toMobile(props.theme.fontSizes.title[800])};\n line-height: normal;\n `;\n break;\n case 'h3':\n cssVar += `\n font-size: ${toMobile(props.theme.fontSizes.title[700])};\n line-height: 1.2;\n `;\n break;\n case 'h4':\n cssVar += `\n font-size: ${toMobile(props.theme.fontSizes.title[600])};\n line-height: normal;\n `;\n break;\n case 'h5':\n cssVar += `\n font-size: ${toMobile(props.theme.fontSizes.title[500])};\n line-height: normal;\n `;\n break;\n case 'section-header':\n cssVar += `\n font-size: ${toMobile(props.theme.fontSizes.title[500])};\n line-height: normal;\n text-transform: uppercase;\n `;\n break;\n case 'body':\n cssVar += `\n font-size: ${toMobile(props.theme.fontSizes.value[400])};\n line-height: normal;\n `;\n break;\n case 'body-small':\n cssVar += `\n font-size: ${toMobile(props.theme.fontSizes.value[300])};\n line-height: normal;\n `;\n break;\n case 'body-micro':\n cssVar += `\n font-size: ${toMobile(props.theme.fontSizes.microText[200])};\n line-height: normal;\n `;\n break;\n case 'list':\n cssVar += `\n font-size: ${toMobile(props.theme.fontSizes.value[400])};\n line-height: normal;\n `;\n break;\n case 'link':\n cssVar += `\n line-height: ${props.theme.xl};\n color: ${props.theme.colors.brand[600]};\n cursor: pointer;\n `;\n break;\n }\n return cssVar;\n };\n}\n\nexport function iconColor(variant = 'neutral', type = 400) {\n return css`\n fill: ${(props) => props.theme.colors[variant][type]};\n `;\n}\n\nexport function fakeBorder() {\n return css`\n box-shadow: inset 0 0 0 1px ${(props) => props.theme.colors.neutral[200]};\n border-radius: 2px;\n `;\n}\n\nexport function fakeActive() {\n return css`\n outline: none;\n box-shadow: inset 0 0 0 1px ${(props) => props.theme.colors.brand[700]};\n border-radius: 2px;\n `;\n}\n\nexport function clearFocus(): string {\n return `\n border: none;\n box-shadow: none;\n `;\n}\n\nexport function buttonLink(): string {\n return `\n background-color: transparent;\n border: 1px solid transparent;\n cursor: pointer;\n `;\n}\n\nexport function transition(t = 'all 1s ease'): string {\n return `\n transition: ${t};\n `;\n}\n\nexport const onlySafariAndFirefox = (styles: string): string => css`\n @media not all and (min-resolution: 0.001dpcm) {\n ${styles}\n }\n @media screen and (min--moz-device-pixel-ratio: 0) {\n ${styles}\n }\n`;\n\nexport const onlySafari = (styles: string): string => `\n @media not all and (min-resolution: 0.001dpcm) {\n ${styles}\n }\n `;\n\nexport const onlyFirefox = (styles: string): string => `\n @media screen and (min--moz-device-pixel-ratio: 0) {\n ${styles}\n }\n `;\n\nexport const safariAndFirefoxBold = (color: string): string => `\n @media not all and (min-resolution: 0.001dpcm) {\n font-weight: 400;\n -webkit-font-smoothing: subpixel-antialiased;\n -webkit-text-stroke: 0.4px ${color};\n }\n @media screen and (min--moz-device-pixel-ratio: 0) {\n font-weight: 400;\n -webkit-font-smoothing: subpixel-antialiased;\n -webkit-text-stroke: 0.4px ${color};\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,sBAA8B;AAC9B,oBAAuB;AACvB,+BAA0F;AAC1F,mBAAsB;AACtB,6BAAyB;AAIlB,kBAAkB,OAAgB;AACvC,SAAO,CAAC,UAAU;AAAA,MACd,CAAC,CAAC,SAAS,MAAM,QAAQ,UAAU,MAAM,SAAS,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAO5D,sBAA8B;AACnC,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOF,oBAA4B;AACjC,SAAO;AAAA;AAAA;AAAA;AAAA;AAMF,mBAAmB,KAAyC;AACjE,SAAO,qCAAO,0BACZ,KACA,CAAC,QAAQ,OAAO,QAAQ;AAAA,MACtB;AAAA,MACA;AAAA,QACE;AAAA;AAAA,KAGJ;AAAA;AAAA;AAMG,mBAAmB,KAAa,MAAc,MAAc,QAAe,QAAQ,OAAe;AACvG,SAAO,eAAe,QAAQ,UAAU,MAAM,OAAO,QAAQ,QAAQ;AAAA;AAGhE,eAAe,UAAU,WAAW,OAAO,KAAK;AACrD,SAAO;AAAA,aACI,CAAC,UAAU,MAAM,MAAM,OAAO,SAAS;AAAA;AAAA;AAI7C,gBAAgB,SAAQ,mBAAM,OAAO,MAAM,MAAM,OAAO,OAAO,OAAO,SAAiB;AAC5F,SAAO,GAAG,QAAQ,QAAQ;AAAA;AAGrB,mBAAmB,oBAA4B,iBAAyB,mBAA2B;AACxG,SAAO,CAAC,UAAU;AAAA,iBACH,MAAM,sBAAsB,sBAAsB,MAAM,mBAAmB;AAAA,QACpF,MAAM,qBAAqB;AAAA;AAAA;AAI5B,eAAe,SAAgB,mBAAM,OAAO,MAAM,MAAM;AAC7D,SAAO,MAAM;AAAA;AAAA,wBAES;AAAA,kCACU,6BAAQ,KAAK;AAAA;AAAA;AAAA;AAKxC,oBAAoB,QAAe;AACxC,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAYD,MAAM;AAAA;AAAA;AAAA;AAKP,kBAAkB;AACvB,SAAO,CAAC,UAAU;AAAA;AAAA,wBAEI,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAK1C,iBAAiB;AACtB,SAAO,CAAC,UAAU;AAAA,yBACK,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAK3C,mBAAmB,MAAc,SAAS,WAAW;AAE1D,SAAO,CAAC,UAAkB;AACxB,QAAI,SAAS,gBAAgB,MAAM,MAAM,YAAY;AAErD,YAAQ;AAAA,WACD;AACH,kBAAU;AAAA,qBACG,qCAAS;AAAA;AAAA;AAGtB;AAAA,WACG;AACH,kBAAU;AAAA,qBACG,qCAAS,MAAM,MAAM,UAAU,MAAM;AAAA;AAAA;AAGlD;AAAA,WACG;AACH,kBAAU;AAAA,qBACG,qCAAS,MAAM,MAAM,UAAU,MAAM;AAAA;AAAA;AAGlD;AAAA,WACG;AACH,kBAAU;AAAA,qBACG,qCAAS,MAAM,MAAM,UAAU,MAAM;AAAA;AAAA;AAGlD;AAAA,WACG;AACH,kBAAU;AAAA,qBACG,qCAAS,MAAM,MAAM,UAAU,MAAM;AAAA;AAAA;AAGlD;AAAA,WACG;AACH,kBAAU;AAAA,qBACG,qCAAS,MAAM,MAAM,UAAU,MAAM;AAAA;AAAA;AAAA;AAIlD;AAAA,WACG;AACH,kBAAU;AAAA,qBACG,qCAAS,MAAM,MAAM,UAAU,MAAM;AAAA;AAAA;AAGlD;AAAA,WACG;AACH,kBAAU;AAAA,qBACG,qCAAS,MAAM,MAAM,UAAU,MAAM;AAAA;AAAA;AAGlD;AAAA,WACG;AACH,kBAAU;AAAA,qBACG,qCAAS,MAAM,MAAM,UAAU,UAAU;AAAA;AAAA;AAGtD;AAAA,WACG;AACH,kBAAU;AAAA,qBACG,qCAAS,MAAM,MAAM,UAAU,MAAM;AAAA;AAAA;AAGlD;AAAA,WACG;AACH,kBAAU;AAAA,uBACK,MAAM,MAAM;AAAA,iBAClB,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAGlC;AAAA;AAEJ,WAAO;AAAA;AAAA;AAIJ,mBAAmB,UAAU,WAAW,OAAO,KAAK;AACzD,SAAO;AAAA,YACG,CAAC,UAAU,MAAM,MAAM,OAAO,SAAS;AAAA;AAAA;AAI5C,sBAAsB;AAC3B,SAAO;AAAA,kCACyB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAKjE,sBAAsB;AAC3B,SAAO;AAAA;AAAA,kCAEyB,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAK/D,sBAA8B;AACnC,SAAO;AAAA;AAAA;AAAA;AAAA;AAMF,sBAA8B;AACnC,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOF,oBAAoB,IAAI,eAAuB;AACpD,SAAO;AAAA,kBACS;AAAA;AAAA;AAIX,MAAM,uBAAuB,CAAC,WAA2B;AAAA;AAAA,MAE1D;AAAA;AAAA;AAAA,MAGA;AAAA;AAAA;AAIC,MAAM,aAAa,CAAC,WAA2B;AAAA;AAAA,QAE9C;AAAA;AAAA;AAID,MAAM,cAAc,CAAC,WAA2B;AAAA;AAAA,QAE/C;AAAA;AAAA;AAID,MAAM,uBAAuB,CAAC,WAA0B;AAAA;AAAA;AAAA;AAAA,iCAI9B;AAAA;AAAA;AAAA;AAAA;AAAA,iCAKA;AAAA;AAAA;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/arithmetic.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export function getNumberAndUnit(\n numberStrWithUnit: string | number,\n): { number: string; unit: string } {\n const [number, unit] = String(numberStrWithUnit).match(\n /[a-z]+|[(/^\\-?\\d*.\\d+|\\d+),?]+/gi,\n );\n return { number, unit };\n}\n\nexport function op(operator: string, n1: string, n2: string | number): string {\n const { number, unit } = getNumberAndUnit(n1);\n const { number: number2, unit: unit2 } = getNumberAndUnit(n2);\n switch (operator) {\n case '*':\n return Number(number) * Number(number2) + (unit || unit2);\n case '+':\n return Number(number) + Number(number2) + (unit || unit2);\n case '-':\n return Number(number) - Number(number2) + (unit || unit2);\n case '/':\n return Number(number) / Number(number2) + (unit || unit2);\n default:\n return Number(number) + Number(number2) + (unit || unit2);\n }\n}\n"],
5
- "mappings": "AAAA;ACAO,0BACL,mBACkC;AAClC,QAAM,CAAC,QAAQ,QAAQ,OAAO,mBAAmB,MAC/C;AAEF,SAAO,EAAE,QAAQ;AAAA;AAGZ,YAAY,UAAkB,IAAY,IAA6B;AAC5E,QAAM,EAAE,QAAQ,SAAS,iBAAiB;AAC1C,QAAM,EAAE,QAAQ,SAAS,MAAM,UAAU,iBAAiB;AAC1D,UAAQ;AAAA,SACD;AACH,aAAO,OAAO,UAAU,OAAO,WAAY,SAAQ;AAAA,SAChD;AACH,aAAO,OAAO,UAAU,OAAO,WAAY,SAAQ;AAAA,SAChD;AACH,aAAO,OAAO,UAAU,OAAO,WAAY,SAAQ;AAAA,SAChD;AACH,aAAO,OAAO,UAAU,OAAO,WAAY,SAAQ;AAAA;AAEnD,aAAO,OAAO,UAAU,OAAO,WAAY,SAAQ;AAAA;AAAA;",
6
- "names": []
7
- }
@@ -1,18 +0,0 @@
1
- import * as React from "react";
2
- const desktopBaseFont = 13;
3
- const mobileBaseFont = 16;
4
- const translateUnits = {
5
- "8px": "4px",
6
- "16px": "8px",
7
- "32px": "16px",
8
- "48px": "24px",
9
- "56px": "32px",
10
- "64px": "48px",
11
- "72px": "64px"
12
- };
13
- export {
14
- desktopBaseFont,
15
- mobileBaseFont,
16
- translateUnits
17
- };
18
- //# sourceMappingURL=constants.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/constants.ts"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const desktopBaseFont = 13;\n\nexport const mobileBaseFont = 16;\n\nexport const translateUnits = {\n '8px': '4px',\n '16px': '8px',\n '32px': '16px',\n '48px': '24px',\n '56px': '32px',\n '64px': '48px',\n '72px': '64px',\n};\n"],
5
- "mappings": "AAAA;ACAO,MAAM,kBAAkB;AAExB,MAAM,iBAAiB;AAEvB,MAAM,iBAAiB;AAAA,EAC5B,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA;",
6
- "names": []
7
- }
@@ -1,18 +0,0 @@
1
- import * as React from "react";
2
- import { createGlobalStyle } from "./utils";
3
- const GlobalStyles = createGlobalStyle`
4
- :root, body {
5
- overscroll-behavior-y: none;
6
-
7
- font-size: ${(props) => props.device === "desktop" ? "13px" : "16px"};
8
-
9
- @media(min-width: ${({ theme }) => theme.breakpoints.small}) {
10
- font-size: ${(props) => props.device === "mobile" ? "16px" : "13px"};
11
- }
12
-
13
- }
14
- `;
15
- export {
16
- GlobalStyles
17
- };
18
- //# sourceMappingURL=globalStyles.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/globalStyles.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createGlobalStyle } from './utils';\n\nexport const GlobalStyles = createGlobalStyle`\n :root, body {\n overscroll-behavior-y: none;\n\n font-size: ${(props) => (props.device === 'desktop' ? '13px' : '16px')};\n\n @media(min-width: ${({ theme }) => theme.breakpoints.small}) {\n font-size: ${(props) => (props.device === 'mobile' ? '16px' : '13px')};\n }\n\n }\n`;\n"],
5
- "mappings": "AAAA;ACAA;AAEO,MAAM,eAAe;AAAA;AAAA;AAAA;AAAA,iBAIX,CAAC,UAAW,MAAM,WAAW,YAAY,SAAS;AAAA;AAAA,wBAE3C,CAAC,EAAE,YAAY,MAAM,YAAY;AAAA,mBACtC,CAAC,UAAW,MAAM,WAAW,WAAW,SAAS;AAAA;AAAA;AAAA;AAAA;",
6
- "names": []
7
- }
package/dist/esm/index.js DELETED
@@ -1,14 +0,0 @@
1
- import * as React from "react";
2
- export * from "./globalStyles";
3
- export * from "./spaceUtilities";
4
- export * from "./mobileUtilities";
5
- export * from "./utils";
6
- export * from "./arithmetic";
7
- export * from "./th";
8
- export * from "./theme";
9
- export * from "./styled";
10
- import { themeProviderHOC } from "./themeProviderHOC";
11
- export {
12
- themeProviderHOC
13
- };
14
- //# sourceMappingURL=index.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './globalStyles';\nexport * from './spaceUtilities';\nexport * from './mobileUtilities';\nexport * from './utils';\nexport * from './arithmetic';\nexport * from './th';\nexport * from './theme';\nexport * from './styled';\nexport { themeProviderHOC } from './themeProviderHOC';\n"],
5
- "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;",
6
- "names": []
7
- }
@@ -1,43 +0,0 @@
1
- import * as React from "react";
2
- import { useState, useEffect } from "react";
3
- import { theme } from "./theme";
4
- import { desktopBaseFont, mobileBaseFont, translateUnits } from "./constants";
5
- function __UNSAFE_SPACE_TO_DIMSUM(unit) {
6
- if (translateUnits[unit])
7
- return translateUnits[unit];
8
- return `${parseFloat(unit) * (mobileBaseFont / desktopBaseFont) / 2}px`;
9
- }
10
- function toMobile(unit) {
11
- if (!isMobile())
12
- return unit;
13
- return `${parseFloat(unit) * (desktopBaseFont / mobileBaseFont)}rem`;
14
- }
15
- const useIsMobile = () => {
16
- const [mobile, setMobile] = useState(isMobile());
17
- useEffect(() => {
18
- function handleResize() {
19
- setMobile(isMobile());
20
- }
21
- if (window)
22
- window.addEventListener("resize", handleResize);
23
- return () => {
24
- if (window)
25
- window.removeEventListener("resize", handleResize);
26
- };
27
- }, []);
28
- if (!window)
29
- return false;
30
- return mobile;
31
- };
32
- const isMobile = () => {
33
- if (!window)
34
- return false;
35
- return Number(theme.breakpoints.medium.split("px")[0]) - window.innerWidth >= 0;
36
- };
37
- export {
38
- __UNSAFE_SPACE_TO_DIMSUM,
39
- isMobile,
40
- toMobile,
41
- useIsMobile
42
- };
43
- //# sourceMappingURL=mobileUtilities.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/mobileUtilities.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useState, useEffect } from 'react';\nimport { theme } from './theme';\nimport { desktopBaseFont, mobileBaseFont, translateUnits } from './constants';\n\n// eslint-disable-next-line no-underscore-dangle\nexport function __UNSAFE_SPACE_TO_DIMSUM(unit: string): string {\n if (translateUnits[unit]) return translateUnits[unit];\n return `${(parseFloat(unit) * (mobileBaseFont / desktopBaseFont)) / 2}px`;\n}\n\nexport function toMobile(unit: string): string {\n if (!isMobile()) return unit;\n return `${parseFloat(unit) * (desktopBaseFont / mobileBaseFont)}rem`;\n}\n\nexport const useIsMobile = (): boolean => {\n const [mobile, setMobile] = useState<boolean>(isMobile());\n useEffect(() => {\n function handleResize() {\n setMobile(isMobile());\n }\n if (window) window.addEventListener('resize', handleResize);\n return () => {\n if (window) window.removeEventListener('resize', handleResize);\n };\n }, []);\n if (!window) return false;\n return mobile;\n};\n\nexport const isMobile = (): boolean => {\n if (!window) return false;\n return (\n Number(theme.breakpoints.medium.split('px')[0]) - window.innerWidth >= 0\n );\n};\n"],
5
- "mappings": "AAAA;ACAA;AACA;AACA;AAGO,kCAAkC,MAAsB;AAC7D,MAAI,eAAe;AAAO,WAAO,eAAe;AAChD,SAAO,GAAI,WAAW,QAAS,kBAAiB,mBAAoB;AAAA;AAG/D,kBAAkB,MAAsB;AAC7C,MAAI,CAAC;AAAY,WAAO;AACxB,SAAO,GAAG,WAAW,QAAS,mBAAkB;AAAA;AAG3C,MAAM,cAAc,MAAe;AACxC,QAAM,CAAC,QAAQ,aAAa,SAAkB;AAC9C,YAAU,MAAM;AACd,4BAAwB;AACtB,gBAAU;AAAA;AAEZ,QAAI;AAAQ,aAAO,iBAAiB,UAAU;AAC9C,WAAO,MAAM;AACX,UAAI;AAAQ,eAAO,oBAAoB,UAAU;AAAA;AAAA,KAElD;AACH,MAAI,CAAC;AAAQ,WAAO;AACpB,SAAO;AAAA;AAGF,MAAM,WAAW,MAAe;AACrC,MAAI,CAAC;AAAQ,WAAO;AACpB,SACE,OAAO,MAAM,YAAY,OAAO,MAAM,MAAM,MAAM,OAAO,cAAc;AAAA;",
6
- "names": []
7
- }
@@ -1,65 +0,0 @@
1
- import * as React from "react";
2
- import { get } from "lodash";
3
- import { theme } from "./theme";
4
- function mapGap(gutter) {
5
- if (!gutter)
6
- return "0rem";
7
- if (String(gutter).includes("rem") || String(gutter).includes("px"))
8
- return gutter;
9
- return `${theme.space[gutter]}`;
10
- }
11
- function mapGutter(gutter) {
12
- if (!gutter)
13
- return "0rem";
14
- return `${theme.space[gutter]} * 2`;
15
- }
16
- function mapSpace(width) {
17
- if (typeof width === "string")
18
- return get(theme, width) ? `${get(theme, width)}` : width;
19
- return `${width * 100}%`;
20
- }
21
- function fixSpaceGutter(width, gutter) {
22
- if (!width)
23
- return "";
24
- if (Array.isArray(width))
25
- return width.map((w) => `calc(${mapSpace(w)} - (${mapGutter(gutter)}))`);
26
- return `calc(${mapSpace(width)} - (${mapGutter(gutter)}))`;
27
- }
28
- function fixSpace(width) {
29
- if (!width)
30
- return "";
31
- if (Array.isArray(width))
32
- return width.map((w) => mapSpace(w));
33
- return mapSpace(width);
34
- }
35
- function numbersToFr(grid) {
36
- const den = grid.map((f) => f < 1 ? Math.floor(1 / f) : f);
37
- return den.map((d) => `${d}fr`);
38
- }
39
- function mapGrid(width) {
40
- if (get(theme, width))
41
- return `${get(theme, width)}`;
42
- if (typeof width === "string")
43
- return width;
44
- const den = width < 1 ? Math.floor(1 / width) : width;
45
- return `${den}fr`;
46
- }
47
- function mapTemplateGrid(grid) {
48
- if (Array.isArray(grid)) {
49
- if (grid.some((w) => typeof w === "string"))
50
- return grid.map((w) => mapGrid(w));
51
- return numbersToFr(grid);
52
- }
53
- return mapGrid(grid);
54
- }
55
- export {
56
- fixSpace,
57
- fixSpaceGutter,
58
- mapGap,
59
- mapGrid,
60
- mapGutter,
61
- mapSpace,
62
- mapTemplateGrid,
63
- numbersToFr
64
- };
65
- //# sourceMappingURL=spaceUtilities.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/spaceUtilities.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { get } from 'lodash';\nimport { theme } from './theme';\n\nexport function mapGap(gutter: number | string): number | string {\n if (!gutter) return '0rem';\n if (String(gutter).includes('rem') || String(gutter).includes('px'))\n return gutter;\n return `${theme.space[gutter]}`;\n}\n\nexport function mapGutter(gutter: string | number): string {\n if (!gutter) return '0rem';\n return `${theme.space[gutter]} * 2`;\n}\n\nexport function mapSpace(width: string | number): string {\n if (typeof width === 'string')\n return get(theme, width) ? `${get(theme, width)}` : width;\n return `${width * 100}%`;\n}\n\nexport function fixSpaceGutter(\n width: string | number,\n gutter: string | number,\n): string | string[] {\n if (!width) return '';\n if (Array.isArray(width))\n return width.map((w) => `calc(${mapSpace(w)} - (${mapGutter(gutter)}))`);\n return `calc(${mapSpace(width)} - (${mapGutter(gutter)}))`;\n}\n\nexport function fixSpace(width: string | number): string | string[] {\n if (!width) return '';\n if (Array.isArray(width)) return width.map((w) => mapSpace(w));\n return mapSpace(width);\n}\n\n/**\n * Grid\n *\n * @param grid\n */\nexport function numbersToFr(grid: number[]): string[] {\n const den = grid.map((f) => (f < 1 ? Math.floor(1 / f) : f));\n return den.map((d) => `${d}fr`);\n}\nexport function mapGrid(width: string | number): string {\n if (get(theme, width)) return `${get(theme, width)}`;\n if (typeof width === 'string') return width;\n const den = width < 1 ? Math.floor(1 / width) : width;\n return `${den}fr`;\n}\n\nexport function mapTemplateGrid(grid: number[]): string | string[] {\n if (Array.isArray(grid)) {\n if (grid.some((w) => typeof w === 'string'))\n return grid.map((w) => mapGrid(w));\n return numbersToFr(grid);\n }\n return mapGrid(grid);\n}\n"],
5
- "mappings": "AAAA;ACAA;AACA;AAEO,gBAAgB,QAA0C;AAC/D,MAAI,CAAC;AAAQ,WAAO;AACpB,MAAI,OAAO,QAAQ,SAAS,UAAU,OAAO,QAAQ,SAAS;AAC5D,WAAO;AACT,SAAO,GAAG,MAAM,MAAM;AAAA;AAGjB,mBAAmB,QAAiC;AACzD,MAAI,CAAC;AAAQ,WAAO;AACpB,SAAO,GAAG,MAAM,MAAM;AAAA;AAGjB,kBAAkB,OAAgC;AACvD,MAAI,OAAO,UAAU;AACnB,WAAO,IAAI,OAAO,SAAS,GAAG,IAAI,OAAO,WAAW;AACtD,SAAO,GAAG,QAAQ;AAAA;AAGb,wBACL,OACA,QACmB;AACnB,MAAI,CAAC;AAAO,WAAO;AACnB,MAAI,MAAM,QAAQ;AAChB,WAAO,MAAM,IAAI,CAAC,MAAM,QAAQ,SAAS,SAAS,UAAU;AAC9D,SAAO,QAAQ,SAAS,aAAa,UAAU;AAAA;AAG1C,kBAAkB,OAA2C;AAClE,MAAI,CAAC;AAAO,WAAO;AACnB,MAAI,MAAM,QAAQ;AAAQ,WAAO,MAAM,IAAI,CAAC,MAAM,SAAS;AAC3D,SAAO,SAAS;AAAA;AAQX,qBAAqB,MAA0B;AACpD,QAAM,MAAM,KAAK,IAAI,CAAC,MAAO,IAAI,IAAI,KAAK,MAAM,IAAI,KAAK;AACzD,SAAO,IAAI,IAAI,CAAC,MAAM,GAAG;AAAA;AAEpB,iBAAiB,OAAgC;AACtD,MAAI,IAAI,OAAO;AAAQ,WAAO,GAAG,IAAI,OAAO;AAC5C,MAAI,OAAO,UAAU;AAAU,WAAO;AACtC,QAAM,MAAM,QAAQ,IAAI,KAAK,MAAM,IAAI,SAAS;AAChD,SAAO,GAAG;AAAA;AAGL,yBAAyB,MAAmC;AACjE,MAAI,MAAM,QAAQ,OAAO;AACvB,QAAI,KAAK,KAAK,CAAC,MAAM,OAAO,MAAM;AAChC,aAAO,KAAK,IAAI,CAAC,MAAM,QAAQ;AACjC,WAAO,YAAY;AAAA;AAErB,SAAO,QAAQ;AAAA;",
6
- "names": []
7
- }
@@ -1,2 +0,0 @@
1
- import * as React from "react";
2
- //# sourceMappingURL=index.d.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "AAAA;",
6
- "names": []
7
- }
@@ -1,60 +0,0 @@
1
- import * as React from "react";
2
- import styled_component from "styled-components";
3
- import { getStyleOverrides, getVariantStyles, variantsResolver } from "./styleGetters";
4
- import { coerceWithDefaultTheme } from "./utils";
5
- const styledFunction = (tag, options = { name: null, slot: null }) => {
6
- const { name: componentName = null, slot: componentSlot = null } = options;
7
- const func = (styleArg, ...expressions) => {
8
- const expressionsWithDefaultTheme = expressions ? expressions.map((stylesArg) => typeof stylesArg === "function" ? (props) => stylesArg({
9
- ...props,
10
- theme: coerceWithDefaultTheme(props.theme)
11
- }) : stylesArg) : [];
12
- let transformedStyleArg = styleArg;
13
- if (componentName && componentSlot) {
14
- expressionsWithDefaultTheme.push((props) => {
15
- const theme = coerceWithDefaultTheme(props.theme);
16
- const styleOverrides = getStyleOverrides(componentName, theme);
17
- if (styleOverrides) {
18
- return [styleOverrides[componentSlot]];
19
- }
20
- return null;
21
- });
22
- }
23
- if (componentName && componentSlot === "root") {
24
- expressionsWithDefaultTheme.push((props) => {
25
- const theme = coerceWithDefaultTheme(props.theme);
26
- return variantsResolver(props, getVariantStyles(componentName, theme), theme, componentName);
27
- });
28
- }
29
- const numOfCustomFnsApplied = expressionsWithDefaultTheme.length - expressions.length;
30
- if (Array.isArray(styleArg) && numOfCustomFnsApplied > 0) {
31
- const placeholders = new Array(numOfCustomFnsApplied).fill("");
32
- transformedStyleArg = Object.assign([...styleArg, ...placeholders], {
33
- raw: [...styleArg.raw, ...placeholders]
34
- });
35
- } else if (typeof styleArg === "function") {
36
- transformedStyleArg = (props) => styleArg({ ...props, theme: coerceWithDefaultTheme(props.theme) });
37
- }
38
- let Component = styled_component(tag);
39
- const displayName = componentName !== null && componentSlot !== null ? `${componentName}-${componentSlot}` : null;
40
- if (displayName !== null) {
41
- Component = Component.attrs({ className: `${componentName}${componentSlot}` });
42
- }
43
- Component = Component(transformedStyleArg, ...expressionsWithDefaultTheme);
44
- if (displayName !== null) {
45
- Component.displayName = displayName;
46
- }
47
- return Component;
48
- };
49
- return func;
50
- };
51
- const styledObject = Object.keys(styled_component).reduce((obj, key) => {
52
- const castedKey = key;
53
- obj[castedKey] = styledFunction(castedKey);
54
- return obj;
55
- }, {});
56
- const styled = Object.assign(styledFunction, styledObject);
57
- export {
58
- styled
59
- };
60
- //# sourceMappingURL=index.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/styled/index.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import styled_component, { StyledComponentPropsWithRef } from 'styled-components';\nimport { Styled, StyledFunction, StyledObject } from './types';\nimport { getStyleOverrides, getVariantStyles, variantsResolver } from './styleGetters';\nimport { coerceWithDefaultTheme } from './utils';\n\nconst styledFunction: StyledFunction = (tag, options = { name: null, slot: null }) => {\n const { name: componentName = null, slot: componentSlot = null } = options;\n const func: ReturnType<StyledFunction> = (styleArg, ...expressions) => {\n /*\n * These are the internal expression written in dimsum\n * We just coerce with the default theme in case users\n * forget to add the ThemeProvider\n */\n const expressionsWithDefaultTheme = expressions\n ? expressions.map<typeof expressions[number]>((stylesArg) =>\n typeof stylesArg === 'function'\n ? (props) =>\n stylesArg({\n ...props,\n theme: coerceWithDefaultTheme(props.theme),\n })\n : stylesArg,\n )\n : [];\n\n let transformedStyleArg = styleArg;\n\n /*\n * Here we get the style overrides from the user\n */\n if (componentName && componentSlot) {\n expressionsWithDefaultTheme.push((props) => {\n const theme = coerceWithDefaultTheme(props.theme);\n const styleOverrides = getStyleOverrides(componentName, theme);\n if (styleOverrides) {\n return [styleOverrides[componentSlot]];\n }\n return null;\n });\n }\n\n /*\n * Here we get the variant overrides from the user (only for the root)\n */\n if (componentName && componentSlot === 'root') {\n expressionsWithDefaultTheme.push((props) => {\n const theme = coerceWithDefaultTheme(props.theme);\n return variantsResolver(props, getVariantStyles(componentName, theme), theme, componentName);\n });\n }\n\n const numOfCustomFnsApplied = expressionsWithDefaultTheme.length - expressions.length;\n\n if (Array.isArray(styleArg) && numOfCustomFnsApplied > 0) {\n // Here we are adding placeholders for all the new functions that we are gonna call\n const placeholders: string[] = new Array(numOfCustomFnsApplied).fill('');\n transformedStyleArg = Object.assign([...styleArg, ...placeholders], {\n raw: [...(styleArg as TemplateStringsArray).raw, ...placeholders],\n });\n } else if (typeof styleArg === 'function') {\n // Here we just coerce with the default theme\n transformedStyleArg = (props) => styleArg({ ...props, theme: coerceWithDefaultTheme(props.theme) });\n }\n let Component = styled_component(tag);\n\n const displayName =\n componentName !== null && componentSlot !== null ? `${componentName}-${componentSlot}` : null;\n\n if (displayName !== null) {\n Component = Component.attrs({ className: `${componentName}${componentSlot}` } as unknown as Partial<\n StyledComponentPropsWithRef<typeof tag>\n >);\n }\n\n Component = Component(transformedStyleArg, ...expressionsWithDefaultTheme);\n\n if (displayName !== null) {\n Component.displayName = displayName;\n }\n\n return Component;\n };\n return func;\n};\n\nconst styledObject = Object.keys(styled_component).reduce((obj, key) => {\n const castedKey = key as keyof JSX.IntrinsicElements;\n obj[castedKey] = styledFunction(castedKey);\n return obj;\n}, {} as StyledObject);\n\nexport const styled: Styled = Object.assign(styledFunction, styledObject);\n"],
5
- "mappings": "AAAA;ACAA;AAEA;AACA;AAEA,MAAM,iBAAiC,CAAC,KAAK,UAAU,EAAE,MAAM,MAAM,MAAM,WAAW;AACpF,QAAM,EAAE,MAAM,gBAAgB,MAAM,MAAM,gBAAgB,SAAS;AACnE,QAAM,OAAmC,CAAC,aAAa,gBAAgB;AAMrE,UAAM,8BAA8B,cAChC,YAAY,IAAgC,CAAC,cAC7C,OAAO,cAAc,aACjB,CAAC,UACD,UAAU;AAAA,SACL;AAAA,MACH,OAAO,uBAAuB,MAAM;AAAA,SAEtC,aAEJ;AAEJ,QAAI,sBAAsB;AAK1B,QAAI,iBAAiB,eAAe;AAClC,kCAA4B,KAAK,CAAC,UAAU;AAC1C,cAAM,QAAQ,uBAAuB,MAAM;AAC3C,cAAM,iBAAiB,kBAAkB,eAAe;AACxD,YAAI,gBAAgB;AAClB,iBAAO,CAAC,eAAe;AAAA;AAEzB,eAAO;AAAA;AAAA;AAOX,QAAI,iBAAiB,kBAAkB,QAAQ;AAC7C,kCAA4B,KAAK,CAAC,UAAU;AAC1C,cAAM,QAAQ,uBAAuB,MAAM;AAC3C,eAAO,iBAAiB,OAAO,iBAAiB,eAAe,QAAQ,OAAO;AAAA;AAAA;AAIlF,UAAM,wBAAwB,4BAA4B,SAAS,YAAY;AAE/E,QAAI,MAAM,QAAQ,aAAa,wBAAwB,GAAG;AAExD,YAAM,eAAyB,IAAI,MAAM,uBAAuB,KAAK;AACrE,4BAAsB,OAAO,OAAO,CAAC,GAAG,UAAU,GAAG,eAAe;AAAA,QAClE,KAAK,CAAC,GAAI,SAAkC,KAAK,GAAG;AAAA;AAAA,eAE7C,OAAO,aAAa,YAAY;AAEzC,4BAAsB,CAAC,UAAU,SAAS,KAAK,OAAO,OAAO,uBAAuB,MAAM;AAAA;AAE5F,QAAI,YAAY,iBAAiB;AAEjC,UAAM,cACJ,kBAAkB,QAAQ,kBAAkB,OAAO,GAAG,iBAAiB,kBAAkB;AAE3F,QAAI,gBAAgB,MAAM;AACxB,kBAAY,UAAU,MAAM,EAAE,WAAW,GAAG,gBAAgB;AAAA;AAK9D,gBAAY,UAAU,qBAAqB,GAAG;AAE9C,QAAI,gBAAgB,MAAM;AACxB,gBAAU,cAAc;AAAA;AAG1B,WAAO;AAAA;AAET,SAAO;AAAA;AAGT,MAAM,eAAe,OAAO,KAAK,kBAAkB,OAAO,CAAC,KAAK,QAAQ;AACtE,QAAM,YAAY;AAClB,MAAI,aAAa,eAAe;AAChC,SAAO;AAAA,GACN;AAEI,MAAM,SAAiB,OAAO,OAAO,gBAAgB;",
6
- "names": []
7
- }