@flodesk/grain 11.0.0-next.9 → 11.0.1
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/es/components/popover.js
CHANGED
|
@@ -37,7 +37,7 @@ var ChildrenWrapper = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "prod
|
|
|
37
37
|
}, ";transition-property:opacity;", function (_ref4) {
|
|
38
38
|
var isOpen = _ref4.isOpen;
|
|
39
39
|
return isOpen ? "transition-duration: ".concat(getTransition('xxFast')) : "transition-duration: ".concat(getTransition('xFast'), "; opacity: 0; pointer-events: none;");
|
|
40
|
-
}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL3BvcG92ZXIuanN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXlCa0MiLCJmaWxlIjoiLi4vLi4vc3JjL2NvbXBvbmVudHMvcG9wb3Zlci5qc3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgdXNlUmVmLCB1c2VFZmZlY3QsIGNsb25lRWxlbWVudCwgRnJhZ21lbnQsIGZvcndhcmRSZWYgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgUHJvcFR5cGVzIGZyb20gJ3Byb3AtdHlwZXMnO1xuaW1wb3J0IHsgdHlwZXMgfSBmcm9tICcuLi90eXBlcyc7XG5pbXBvcnQgeyBwbGFjZW1lbnRzTWFwIH0gZnJvbSAnLi4vZm91bmRhdGlvbmFsJztcbmltcG9ydCB7IHVzZUtleVByZXNzLCB1c2VPbkNsaWNrT3V0c2lkZSB9IGZyb20gJy4uL2hvb2tzJztcbmltcG9ydCB7XG4gIGdldENvbG9yLFxuICBnZXREaW1lbnNpb24sXG4gIGdldFJhZGl1cyxcbiAgZ2V0U2hhZG93LFxuICBnZXRTcGFjZSxcbiAgZ2V0VHJhbnNpdGlvbixcbiAgbWVyZ2VSZWZzLFxufSBmcm9tICcuLi91dGlsaXRpZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHtcbiAgdXNlRmxvYXRpbmcsXG4gIGF1dG9VcGRhdGUsXG4gIG9mZnNldCxcbiAgZmxpcCxcbiAgRmxvYXRpbmdQb3J0YWwsXG4gIHNoaWZ0LFxuICBsaW1pdFNoaWZ0LFxufSBmcm9tICdAZmxvYXRpbmctdWkvcmVhY3QtZG9tLWludGVyYWN0aW9ucyc7XG5cbmNvbnN0IENoaWxkcmVuV3JhcHBlciA9IHN0eWxlZC5kaXZgXG4gICR7KHsgd2lkdGggfSkgPT4gYHdpZHRoOiAke2dldERpbWVuc2lvbih3aWR0aCl9YH07XG4gICR7KHsgcGFkZGluZyB9KSA9PiBgcGFkZGluZzogJHtnZXRTcGFjZShwYWRkaW5nKX1gfTtcbiAgYm94LXNoYWRvdzogJHtnZXRTaGFkb3coJ20nKX07XG4gIGJvcmRlci1yYWRpdXM6ICR7Z2V0UmFkaXVzKCdtJyl9O1xuICBiYWNrZ3JvdW5kOiAke2dldENvbG9yKCdmbG9hdGluZ0JhY2tncm91bmQnKX07XG4gICR7KHsgekluZGV4IH0pID0+
|
|
40
|
+
}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL3BvcG92ZXIuanN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXlCa0MiLCJmaWxlIjoiLi4vLi4vc3JjL2NvbXBvbmVudHMvcG9wb3Zlci5qc3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgdXNlUmVmLCB1c2VFZmZlY3QsIGNsb25lRWxlbWVudCwgRnJhZ21lbnQsIGZvcndhcmRSZWYgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgUHJvcFR5cGVzIGZyb20gJ3Byb3AtdHlwZXMnO1xuaW1wb3J0IHsgdHlwZXMgfSBmcm9tICcuLi90eXBlcyc7XG5pbXBvcnQgeyBwbGFjZW1lbnRzTWFwIH0gZnJvbSAnLi4vZm91bmRhdGlvbmFsJztcbmltcG9ydCB7IHVzZUtleVByZXNzLCB1c2VPbkNsaWNrT3V0c2lkZSB9IGZyb20gJy4uL2hvb2tzJztcbmltcG9ydCB7XG4gIGdldENvbG9yLFxuICBnZXREaW1lbnNpb24sXG4gIGdldFJhZGl1cyxcbiAgZ2V0U2hhZG93LFxuICBnZXRTcGFjZSxcbiAgZ2V0VHJhbnNpdGlvbixcbiAgbWVyZ2VSZWZzLFxufSBmcm9tICcuLi91dGlsaXRpZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHtcbiAgdXNlRmxvYXRpbmcsXG4gIGF1dG9VcGRhdGUsXG4gIG9mZnNldCxcbiAgZmxpcCxcbiAgRmxvYXRpbmdQb3J0YWwsXG4gIHNoaWZ0LFxuICBsaW1pdFNoaWZ0LFxufSBmcm9tICdAZmxvYXRpbmctdWkvcmVhY3QtZG9tLWludGVyYWN0aW9ucyc7XG5cbmNvbnN0IENoaWxkcmVuV3JhcHBlciA9IHN0eWxlZC5kaXZgXG4gICR7KHsgd2lkdGggfSkgPT4gYHdpZHRoOiAke2dldERpbWVuc2lvbih3aWR0aCl9YH07XG4gICR7KHsgcGFkZGluZyB9KSA9PiBgcGFkZGluZzogJHtnZXRTcGFjZShwYWRkaW5nKX1gfTtcbiAgYm94LXNoYWRvdzogJHtnZXRTaGFkb3coJ20nKX07XG4gIGJvcmRlci1yYWRpdXM6ICR7Z2V0UmFkaXVzKCdtJyl9O1xuICBiYWNrZ3JvdW5kOiAke2dldENvbG9yKCdmbG9hdGluZ0JhY2tncm91bmQnKX07XG4gICR7KHsgekluZGV4IH0pID0+IGB6LWluZGV4OiAke3pJbmRleH1gfTtcbiAgdHJhbnNpdGlvbi1wcm9wZXJ0eTogb3BhY2l0eTtcbiAgJHsoeyBpc09wZW4gfSkgPT5cbiAgICBpc09wZW5cbiAgICAgID8gYHRyYW5zaXRpb24tZHVyYXRpb246ICR7Z2V0VHJhbnNpdGlvbigneHhGYXN0Jyl9YFxuICAgICAgOiBgdHJhbnNpdGlvbi1kdXJhdGlvbjogJHtnZXRUcmFuc2l0aW9uKCd4RmFzdCcpfTsgb3BhY2l0eTogMDsgcG9pbnRlci1ldmVudHM6IG5vbmU7YH07XG5gO1xuXG5jb25zdCBwb3BvdmVyT2Zmc2V0cyA9IHtcbiAgeHM6IDggLyAyLFxuICBzOiA4ICogMSxcbiAgczI6IDggKiAxLjUsXG4gIG06IDggKiAyLFxuICBsOiA4ICogMyxcbiAgbDI6IDggKiA0LFxuICB4bDogOCAqIDUsXG4gIHhsMjogOCAqIDYsXG4gIHh4bDogOCAqIDcsXG59O1xuXG5leHBvcnQgY29uc3QgUG9wb3ZlciA9IGZvcndhcmRSZWYoXG4gIChcbiAgICB7XG4gICAgICBjaGlsZHJlbixcbiAgICAgIHBhZGRpbmcgPSAnbCcsXG4gICAgICBwbGFjZW1lbnQgPSAnYm90dG9tJyxcbiAgICAgIHdpZHRoID0gJzI1NnB4JyxcbiAgICAgIHRyaWdnZXIsXG4gICAgICBpc09wZW4sXG4gICAgICBvbkNsb3NlLFxuICAgICAgekluZGV4ID0gMSxcbiAgICAgIGhhc1BvcnRhbCA9IHRydWUsXG4gICAgICBvZmZzZXQ6IHBvcG92ZXJPZmZzZXQgPSAneHMnLFxuICAgICAgLi4ucHJvcHNcbiAgICB9LFxuICAgIHJlZixcbiAgKSA9PiB7XG4gICAgY29uc3QgZXNjUHJlc3MgPSB1c2VLZXlQcmVzcygnRXNjYXBlJyk7XG4gICAgY29uc3Qgd3JhcHBlclJlZiA9IHVzZVJlZihudWxsKTtcblxuICAgIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgICBpZiAoZXNjUHJlc3MpIG9uQ2xvc2UoKTtcbiAgICB9LCBbZXNjUHJlc3MsIG9uQ2xvc2VdKTtcblxuICAgIGNvbnN0IHsgeCwgeSwgcmVmZXJlbmNlLCBmbG9hdGluZywgc3RyYXRlZ3kgfSA9IHVzZUZsb2F0aW5nKHtcbiAgICAgIHBsYWNlbWVudDogcGxhY2VtZW50c01hcFtwbGFjZW1lbnRdLFxuICAgICAgbWlkZGxld2FyZTogW1xuICAgICAgICBvZmZzZXQocG9wb3Zlck9mZnNldHNbcG9wb3Zlck9mZnNldF0pLFxuICAgICAgICBmbGlwKCksXG4gICAgICAgIHNoaWZ0KHtcbiAgICAgICAgICBwYWRkaW5nOiA0LFxuICAgICAgICAgIGNyb3NzQXhpczogdHJ1ZSxcbiAgICAgICAgICBsaW1pdGVyOiBsaW1pdFNoaWZ0KHtcbiAgICAgICAgICAgIGNyb3NzQXhpczogZmFsc2UsXG4gICAgICAgICAgfSksXG4gICAgICAgIH0pLFxuICAgICAgXSxcbiAgICAgIHdoaWxlRWxlbWVudHNNb3VudGVkOiBhdXRvVXBkYXRlLFxuICAgIH0pO1xuXG4gICAgY29uc3QgUm9vdCA9IGhhc1BvcnRhbCA/IEZsb2F0aW5nUG9ydGFsIDogRnJhZ21lbnQ7XG4gICAgY29uc3QgbWVyZ2VkUmVmID0gbWVyZ2VSZWZzKFtyZWYsIHdyYXBwZXJSZWZdKTtcbiAgICAvLyB1c2VkIGZvciBjbGljayBvdXRzaWRlXG4gICAgY29uc3QgdHJpZ2dlclJlZiA9IHVzZVJlZihudWxsKTtcbiAgICBjb25zdCBtZXJnZWRUcmlnZ2VyUmVmID0gbWVyZ2VSZWZzKFtyZWZlcmVuY2UsIHRyaWdnZXIucmVmLCB0cmlnZ2VyUmVmXSk7XG5cbiAgICB1c2VPbkNsaWNrT3V0c2lkZShbd3JhcHBlclJlZiwgdHJpZ2dlclJlZl0sIG9uQ2xvc2UpO1xuXG4gICAgcmV0dXJuIChcbiAgICAgIDw+XG4gICAgICAgIHtjbG9uZUVsZW1lbnQodHJpZ2dlciwgeyByZWY6IG1lcmdlZFRyaWdnZXJSZWYgfSl9XG4gICAgICAgIDxSb290PlxuICAgICAgICAgIDxkaXYgcmVmPXttZXJnZWRSZWZ9PlxuICAgICAgICAgICAgPENoaWxkcmVuV3JhcHBlclxuICAgICAgICAgICAgICB3aWR0aD17d2lkdGh9XG4gICAgICAgICAgICAgIHBhZGRpbmc9e3BhZGRpbmd9XG4gICAgICAgICAgICAgIHpJbmRleD17ekluZGV4fVxuICAgICAgICAgICAgICBjbGFzc05hbWU9XCJncm4tY29udGV4dFwiXG4gICAgICAgICAgICAgIGlzT3Blbj17aXNPcGVufVxuICAgICAgICAgICAgICByZWY9e2Zsb2F0aW5nfVxuICAgICAgICAgICAgICBzdHlsZT17e1xuICAgICAgICAgICAgICAgIHBvc2l0aW9uOiBzdHJhdGVneSxcbiAgICAgICAgICAgICAgICB0b3A6IHkgPz8gMCxcbiAgICAgICAgICAgICAgICBsZWZ0OiB4ID8/IDAsXG4gICAgICAgICAgICAgIH19XG4gICAgICAgICAgICAgIHsuLi5wcm9wc31cbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICAgICAgPC9DaGlsZHJlbldyYXBwZXI+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvUm9vdD5cbiAgICAgIDwvPlxuICAgICk7XG4gIH0sXG4pO1xuXG5Qb3BvdmVyLnByb3BUeXBlcyA9IHtcbiAgcGFkZGluZzogdHlwZXMuZGltZW5zaW9uLFxuICB3aWR0aDogdHlwZXMuZGltZW5zaW9uLFxuICBwbGFjZW1lbnQ6IHR5cGVzLnBsYWNlbWVudCxcbiAgdHJpZ2dlcjogUHJvcFR5cGVzLm5vZGUsXG4gIHpJbmRleDogdHlwZXMuekluZGV4LFxuICBpc09wZW46IFByb3BUeXBlcy5ib29sLFxuICBvbkNsb3NlOiBQcm9wVHlwZXMuZnVuYy5pc1JlcXVpcmVkLFxuICBoYXNQb3J0YWw6IFByb3BUeXBlcy5ib29sLFxuICBvZmZzZXQ6IHR5cGVzLnNwYWNlcyxcbn07XG4iXX0= */"));
|
|
41
41
|
|
|
42
42
|
var popoverOffsets = {
|
|
43
43
|
xs: 8 / 2,
|
|
@@ -79,7 +79,10 @@ export var Popover = /*#__PURE__*/forwardRef(function (_ref5, ref) {
|
|
|
79
79
|
placement: placementsMap[placement],
|
|
80
80
|
middleware: [offset(popoverOffsets[popoverOffset]), flip(), shift({
|
|
81
81
|
padding: 4,
|
|
82
|
-
|
|
82
|
+
crossAxis: true,
|
|
83
|
+
limiter: limitShift({
|
|
84
|
+
crossAxis: false
|
|
85
|
+
})
|
|
83
86
|
})],
|
|
84
87
|
whileElementsMounted: autoUpdate
|
|
85
88
|
}),
|
package/es/styles/utilities.js
CHANGED
|
@@ -32,9 +32,9 @@ import { breakpoints, deviceShort } from '../variables';
|
|
|
32
32
|
var generateUtilityClassDeclarations = function generateUtilityClassDeclarations(propertySets) {
|
|
33
33
|
var css = '';
|
|
34
34
|
propertySets.forEach(function (set) {
|
|
35
|
-
set.
|
|
36
|
-
|
|
37
|
-
|
|
35
|
+
set.props.forEach(function (prop) {
|
|
36
|
+
var property = prop.property;
|
|
37
|
+
set.variables.forEach(function (variable) {
|
|
38
38
|
var cssValue = set.valueTransformer ? set.valueTransformer(variable) : variable;
|
|
39
39
|
var hasHover = prop.propName.includes('Hover');
|
|
40
40
|
var selector = ".".concat(propNameToShort(prop.propName), "-").concat(variable);
|
package/es/styles/variables.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var variables = "\n :root {\n --grn-unit: 8px;\n }\n\n :root {\n --grn-text-s: 12px;\n --grn-text-m:
|
|
1
|
+
var variables = "\n :root {\n --grn-unit: 8px;\n }\n\n :root {\n --grn-text-s: 12px;\n --grn-text-m: 14px;\n --grn-text-l: 18px;\n --grn-text-xl: 24px;\n --grn-text-xxl: 30px;\n }\n\n /* text size \u2715 ~1.2 */\n :root {\n --grn-icon-s: 14px;\n --grn-icon-m: 18px;\n --grn-icon-l: 22px;\n --grn-icon-xl: 28px;\n --grn-icon-xxl: 36px;\n }\n\n :root {\n --grn-weight-normal: 400;\n --grn-weight-medium: 500;\n }\n\n :root {\n --grn-space-xs: calc(var(--grn-unit) / 2);\n --grn-space-s: calc(var(--grn-unit) * 1);\n --grn-space-s2: calc(var(--grn-unit) * 1.5);\n --grn-space-m: calc(var(--grn-unit) * 2);\n --grn-space-l: calc(var(--grn-unit) * 3);\n --grn-space-l2: calc(var(--grn-unit) * 4);\n --grn-space-xl: calc(var(--grn-unit) * 5);\n --grn-space-xl2: calc(var(--grn-unit) * 6);\n --grn-space-xxl: calc(var(--grn-unit) * 7);\n }\n\n :root {\n --grn-radius-s: 3px;\n --grn-radius-m: 6px;\n --grn-radius-l: 10px;\n }\n\n :root {\n --grn-transition-slow: 400ms;\n --grn-transition-fast: 200ms;\n --grn-transition-xFast: 160ms;\n --grn-transition-xxFast: 80ms;\n }\n\n :root,\n [data-theme] {\n --grn-space-betweenFormTitleAndContent: var(--grn-space-l);\n --grn-space-betweenFormContents: var(--grn-space-m);\n --grn-space-betweenFormContentAndActions: var(--grn-space-xl);\n --grn-space-betweenFormControlAndLabel: var(--grn-space-s);\n --grn-space-fieldPaddingX: 12px;\n\n --grn-color-fieldBorder: var(--grn-color-fade3);\n --grn-color-fieldBorderHover: var(--grn-color-fade6);\n --grn-color-fieldBorderFocus: var(--grn-color-shade9);\n --grn-color-fieldBorderDisabled: var(--grn-color-shade5);\n --grn-color-fieldBackgroundDisabled: var(--grn-color-shade2);\n --grn-color-backdrop: hsl(var(--H) 15% 10% / 0.6);\n\n --grn-transition-leave: var(--grn-transition-slow);\n --grn-transition-hover: var(--grn-transition-fast);\n --grn-transition-active: var(--grn-transition-xxFast);\n }\n";
|
|
2
2
|
export default variables;
|
|
@@ -2,6 +2,10 @@ import "core-js/modules/es.object.values.js";
|
|
|
2
2
|
import "core-js/modules/es.object.to-string.js";
|
|
3
3
|
import "core-js/modules/web.dom-collections.for-each.js";
|
|
4
4
|
import "core-js/modules/es.array.concat.js";
|
|
5
|
+
import "core-js/modules/es.array.iterator.js";
|
|
6
|
+
import "core-js/modules/es.map.js";
|
|
7
|
+
import "core-js/modules/es.string.iterator.js";
|
|
8
|
+
import "core-js/modules/web.dom-collections.iterator.js";
|
|
5
9
|
import "core-js/modules/es.object.keys.js";
|
|
6
10
|
import "core-js/modules/es.string.trim.js";
|
|
7
11
|
import { breakpoints, deviceShort } from '../variables';
|
|
@@ -15,18 +19,23 @@ export var generateStyleAttributes = function generateStyleAttributes(props) {
|
|
|
15
19
|
var styles = {};
|
|
16
20
|
var styleConfigValues = Object.values(styleConfig);
|
|
17
21
|
styleConfigValues.forEach(function (propsSet) {
|
|
22
|
+
var variableChecker = propsSet.variableChecker,
|
|
23
|
+
valueTransformer = propsSet.valueTransformer;
|
|
18
24
|
propsSet.props.forEach(function (_ref) {
|
|
19
25
|
var propName = _ref.propName;
|
|
20
26
|
var value = props[propName];
|
|
21
|
-
|
|
22
|
-
var
|
|
27
|
+
if (!value) return;
|
|
28
|
+
var hasVariable = variableChecker && variableChecker(value);
|
|
23
29
|
if (hasVariable) return;
|
|
24
|
-
|
|
25
|
-
var
|
|
30
|
+
|
|
31
|
+
var processValue = function processValue(val) {
|
|
32
|
+
return valueTransformer ? valueTransformer(val) : val;
|
|
33
|
+
};
|
|
34
|
+
|
|
26
35
|
var propNameShort = propNameToShort(propName);
|
|
27
36
|
|
|
28
37
|
if (!isObject(value)) {
|
|
29
|
-
styles["--".concat(propNameShort)] =
|
|
38
|
+
styles["--".concat(propNameShort)] = processValue(value);
|
|
30
39
|
} else {
|
|
31
40
|
var def = value.default,
|
|
32
41
|
mobile = value.mobile,
|
|
@@ -36,9 +45,9 @@ export var generateStyleAttributes = function generateStyleAttributes(props) {
|
|
|
36
45
|
var tabletMediaValue = value[mediaQueries.tablet];
|
|
37
46
|
var mob = mobileMediaValue || mobile;
|
|
38
47
|
var tab = tabletMediaValue || tablet;
|
|
39
|
-
styles["--".concat(propNameShort, "-").concat(deviceShort.default)] =
|
|
40
|
-
styles["--".concat(propNameShort, "-").concat(deviceShort.mobile)] =
|
|
41
|
-
styles["--".concat(propNameShort, "-").concat(deviceShort.tablet)] =
|
|
48
|
+
styles["--".concat(propNameShort, "-").concat(deviceShort.default)] = processValue(def);
|
|
49
|
+
styles["--".concat(propNameShort, "-").concat(deviceShort.mobile)] = processValue(mob);
|
|
50
|
+
styles["--".concat(propNameShort, "-").concat(deviceShort.tablet)] = processValue(tab);
|
|
42
51
|
}
|
|
43
52
|
});
|
|
44
53
|
});
|
|
@@ -46,23 +55,23 @@ export var generateStyleAttributes = function generateStyleAttributes(props) {
|
|
|
46
55
|
};
|
|
47
56
|
export var generateClassNameAttributes = function generateClassNameAttributes(props) {
|
|
48
57
|
var classNames = [];
|
|
49
|
-
var
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
var propName = propItem.propName;
|
|
56
|
-
var value = props[propName];
|
|
57
|
-
var hasVariable = styleConfigItem.variableChecker ? styleConfigItem.variableChecker(value) : false;
|
|
58
|
-
if (!hasVariable) return;
|
|
59
|
-
if (value === null || value === undefined || value === '') return;
|
|
60
|
-
var className = "".concat(propNameToShort(propName), "-").concat(value);
|
|
61
|
-
classNames.push(className);
|
|
62
|
-
}
|
|
63
|
-
});
|
|
58
|
+
var styleConfigValues = Object.values(styleConfig); // Create a map for quick propName lookup
|
|
59
|
+
|
|
60
|
+
var styleConfigMap = new Map();
|
|
61
|
+
styleConfigValues.forEach(function (item) {
|
|
62
|
+
item.props.forEach(function (propItem) {
|
|
63
|
+
styleConfigMap.set(propItem.propName, item);
|
|
64
64
|
});
|
|
65
65
|
});
|
|
66
|
+
Object.keys(props).forEach(function (propName) {
|
|
67
|
+
var styleConfigItem = styleConfigMap.get(propName);
|
|
68
|
+
if (!styleConfigItem) return;
|
|
69
|
+
var value = props[propName];
|
|
70
|
+
var hasVariable = styleConfigItem.variableChecker ? styleConfigItem.variableChecker(value) : false;
|
|
71
|
+
if (!hasVariable || !value) return;
|
|
72
|
+
var className = "".concat(propNameToShort(propName), "-").concat(value);
|
|
73
|
+
classNames.push(className);
|
|
74
|
+
});
|
|
66
75
|
return classNames.join(' ').trim();
|
|
67
76
|
};
|
|
68
77
|
export var generateAttributes = function generateAttributes(_ref2) {
|
|
@@ -3,40 +3,18 @@ import "core-js/modules/es.object.keys.js";
|
|
|
3
3
|
import "core-js/modules/es.array.map.js";
|
|
4
4
|
import "core-js/modules/es.array.includes.js";
|
|
5
5
|
import "core-js/modules/es.string.includes.js";
|
|
6
|
-
import "core-js/modules/es.array.find.js";
|
|
7
6
|
import "core-js/modules/es.object.to-string.js";
|
|
7
|
+
import "core-js/modules/web.dom-collections.for-each.js";
|
|
8
8
|
import "core-js/modules/es.object.values.js";
|
|
9
|
-
import "core-js/modules/es.symbol.js";
|
|
10
|
-
import "core-js/modules/es.symbol.description.js";
|
|
11
|
-
import "core-js/modules/es.symbol.iterator.js";
|
|
12
|
-
import "core-js/modules/es.array.iterator.js";
|
|
13
|
-
import "core-js/modules/es.string.iterator.js";
|
|
14
|
-
import "core-js/modules/web.dom-collections.iterator.js";
|
|
15
|
-
import "core-js/modules/es.array.from.js";
|
|
16
|
-
import "core-js/modules/es.array.slice.js";
|
|
17
|
-
import "core-js/modules/es.regexp.exec.js";
|
|
18
|
-
|
|
19
|
-
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
20
|
-
|
|
21
|
-
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
22
|
-
|
|
23
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
24
|
-
|
|
25
|
-
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
26
|
-
|
|
27
|
-
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
28
|
-
|
|
29
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
30
|
-
|
|
31
9
|
import { alignSelfs, autoFlows, axisAlignments, borderWidths, contentPositions, cursors, flexDirections, flexWraps, overflows, positions, sides, textAlignments, textDisplays, textTransforms } from '../types';
|
|
32
10
|
import { vars } from '../variables';
|
|
33
11
|
import { getDimension, getSpace, getTextSize, isSpaceVar } from './responsive';
|
|
34
12
|
import { getColor, getRadius, getShadow, getTransition, getWeight, isColorVar, isRadiusVar, isShadowVar, isTrasitionVar } from './styles';
|
|
35
|
-
var spaces =
|
|
36
|
-
var colors =
|
|
13
|
+
var spaces = Object.keys(vars.spaces).concat(Object.keys(vars.spaceUtils));
|
|
14
|
+
var colors = Object.keys(vars.colors).concat(Object.keys(vars.colorUtils));
|
|
37
15
|
var shadows = Object.keys(vars.shadows);
|
|
38
16
|
var radii = Object.keys(vars.radii);
|
|
39
|
-
var transitions =
|
|
17
|
+
var transitions = Object.keys(vars.transitions).concat(Object.keys(vars.transitionUtils));
|
|
40
18
|
var sizes = Object.keys(vars.texts);
|
|
41
19
|
var weights = Object.keys(vars.weights);
|
|
42
20
|
|
|
@@ -521,18 +499,12 @@ export var styleConfig = {
|
|
|
521
499
|
isResponsive: true
|
|
522
500
|
}
|
|
523
501
|
};
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
var props = _ref.props;
|
|
529
|
-
return props.find(function (_ref2) {
|
|
530
|
-
var prop = _ref2.propName;
|
|
531
|
-
return prop === propName;
|
|
532
|
-
});
|
|
502
|
+
var propNameToShortMap = {};
|
|
503
|
+
Object.values(styleConfig).forEach(function (config) {
|
|
504
|
+
config.props.forEach(function (prop) {
|
|
505
|
+
propNameToShortMap[prop.propName] = prop.short;
|
|
533
506
|
});
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
})) === null || _prop$props$find === void 0 ? void 0 : _prop$props$find.short;
|
|
507
|
+
});
|
|
508
|
+
export var propNameToShort = function propNameToShort(propName) {
|
|
509
|
+
return propNameToShortMap[propName] || null;
|
|
538
510
|
};
|