@symbo.ls/scratch 3.6.8 → 3.7.3
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/defaultConfig/animation.js +2 -2
- package/dist/cjs/defaultConfig/cases.js +2 -2
- package/dist/cjs/defaultConfig/color.js +4 -4
- package/dist/cjs/defaultConfig/document.js +2 -2
- package/dist/cjs/defaultConfig/font-family.js +6 -6
- package/dist/cjs/defaultConfig/font.js +2 -2
- package/dist/cjs/defaultConfig/grid.js +2 -2
- package/dist/cjs/defaultConfig/icons.js +4 -4
- package/dist/cjs/defaultConfig/index.js +2 -2
- package/dist/cjs/defaultConfig/media.js +2 -2
- package/dist/cjs/defaultConfig/responsive.js +4 -4
- package/dist/cjs/defaultConfig/sequence.js +2 -2
- package/dist/cjs/defaultConfig/shadow.js +2 -7
- package/dist/cjs/defaultConfig/spacing.js +4 -4
- package/dist/cjs/defaultConfig/svg.js +4 -4
- package/dist/cjs/defaultConfig/templates.js +2 -2
- package/dist/cjs/defaultConfig/theme.js +2 -2
- package/dist/cjs/defaultConfig/timing.js +3 -3
- package/dist/cjs/defaultConfig/typography.js +3 -3
- package/dist/cjs/defaultConfig/unit.js +2 -2
- package/dist/cjs/factory.js +6 -0
- package/dist/cjs/set.js +8 -4
- package/dist/cjs/system/color.js +4 -4
- package/dist/cjs/system/document.js +1 -1
- package/dist/cjs/system/font.js +2 -2
- package/dist/cjs/system/reset.js +2 -2
- package/dist/cjs/system/shadow.js +2 -2
- package/dist/cjs/system/spacing.js +3 -3
- package/dist/cjs/system/svg.js +5 -5
- package/dist/cjs/system/theme.js +4 -4
- package/dist/cjs/system/timing.js +3 -3
- package/dist/cjs/system/typography.js +3 -3
- package/dist/cjs/transforms/index.js +1 -1
- package/dist/cjs/utils/sequence.js +1 -1
- package/dist/cjs/utils/var.js +3 -3
- package/dist/esm/defaultConfig/animation.js +2 -2
- package/dist/esm/defaultConfig/cases.js +2 -2
- package/dist/esm/defaultConfig/color.js +4 -4
- package/dist/esm/defaultConfig/document.js +2 -2
- package/dist/esm/defaultConfig/font-family.js +6 -6
- package/dist/esm/defaultConfig/font.js +2 -2
- package/dist/esm/defaultConfig/grid.js +2 -2
- package/dist/esm/defaultConfig/icons.js +4 -4
- package/dist/esm/defaultConfig/index.js +2 -2
- package/dist/esm/defaultConfig/media.js +2 -2
- package/dist/esm/defaultConfig/responsive.js +4 -4
- package/dist/esm/defaultConfig/sequence.js +2 -2
- package/dist/esm/defaultConfig/shadow.js +2 -7
- package/dist/esm/defaultConfig/spacing.js +6 -6
- package/dist/esm/defaultConfig/svg.js +4 -4
- package/dist/esm/defaultConfig/templates.js +2 -2
- package/dist/esm/defaultConfig/theme.js +2 -2
- package/dist/esm/defaultConfig/timing.js +4 -4
- package/dist/esm/defaultConfig/typography.js +4 -4
- package/dist/esm/defaultConfig/unit.js +2 -2
- package/dist/esm/factory.js +6 -0
- package/dist/esm/set.js +8 -4
- package/dist/esm/system/color.js +4 -4
- package/dist/esm/system/document.js +1 -1
- package/dist/esm/system/font.js +2 -2
- package/dist/esm/system/reset.js +2 -2
- package/dist/esm/system/shadow.js +2 -2
- package/dist/esm/system/spacing.js +3 -3
- package/dist/esm/system/svg.js +5 -5
- package/dist/esm/system/theme.js +4 -4
- package/dist/esm/system/timing.js +3 -3
- package/dist/esm/system/typography.js +3 -3
- package/dist/esm/transforms/index.js +1 -1
- package/dist/esm/utils/sequence.js +1 -1
- package/dist/esm/utils/var.js +3 -3
- package/dist/iife/index.js +335 -325
- package/package.json +3 -3
- package/src/defaultConfig/animation.js +1 -1
- package/src/defaultConfig/cases.js +1 -1
- package/src/defaultConfig/color.js +2 -2
- package/src/defaultConfig/document.js +1 -1
- package/src/defaultConfig/font-family.js +3 -3
- package/src/defaultConfig/font.js +1 -1
- package/src/defaultConfig/grid.js +1 -1
- package/src/defaultConfig/icons.js +2 -2
- package/src/defaultConfig/index.js +1 -1
- package/src/defaultConfig/media.js +1 -1
- package/src/defaultConfig/responsive.js +2 -2
- package/src/defaultConfig/sequence.js +1 -1
- package/src/defaultConfig/shadow.js +1 -6
- package/src/defaultConfig/spacing.js +5 -5
- package/src/defaultConfig/svg.js +2 -2
- package/src/defaultConfig/templates.js +1 -1
- package/src/defaultConfig/theme.js +1 -1
- package/src/defaultConfig/timing.js +3 -3
- package/src/defaultConfig/typography.js +3 -3
- package/src/defaultConfig/unit.js +1 -1
- package/src/factory.js +10 -2
- package/src/set.js +8 -4
- package/src/system/color.js +4 -4
- package/src/system/document.js +1 -1
- package/src/system/font.js +2 -2
- package/src/system/reset.js +2 -2
- package/src/system/shadow.js +2 -2
- package/src/system/spacing.js +3 -3
- package/src/system/svg.js +5 -5
- package/src/system/theme.js +6 -4
- package/src/system/timing.js +3 -3
- package/src/system/typography.js +3 -3
- package/src/transforms/index.js +1 -1
- package/src/utils/sequence.js +1 -1
- package/src/utils/var.js +3 -3
|
@@ -18,7 +18,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var animation_exports = {};
|
|
20
20
|
__export(animation_exports, {
|
|
21
|
-
|
|
21
|
+
animation: () => animation
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(animation_exports);
|
|
24
|
-
const
|
|
24
|
+
const animation = {};
|
|
@@ -18,7 +18,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var cases_exports = {};
|
|
20
20
|
__export(cases_exports, {
|
|
21
|
-
|
|
21
|
+
cases: () => cases
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(cases_exports);
|
|
24
|
-
const
|
|
24
|
+
const cases = {};
|
|
@@ -18,8 +18,8 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var color_exports = {};
|
|
20
20
|
__export(color_exports, {
|
|
21
|
-
|
|
22
|
-
|
|
21
|
+
color: () => color,
|
|
22
|
+
gradient: () => gradient
|
|
23
23
|
});
|
|
24
24
|
module.exports = __toCommonJS(color_exports);
|
|
25
25
|
var proto = {
|
|
@@ -27,5 +27,5 @@ var proto = {
|
|
|
27
27
|
name: "",
|
|
28
28
|
value: ""
|
|
29
29
|
};
|
|
30
|
-
const
|
|
31
|
-
const
|
|
30
|
+
const color = {};
|
|
31
|
+
const gradient = {};
|
|
@@ -18,7 +18,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var document_exports = {};
|
|
20
20
|
__export(document_exports, {
|
|
21
|
-
|
|
21
|
+
document: () => document
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(document_exports);
|
|
24
|
-
const
|
|
24
|
+
const document = {};
|
|
@@ -18,9 +18,9 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var font_family_exports = {};
|
|
20
20
|
__export(font_family_exports, {
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
21
|
+
font_face: () => font_face,
|
|
22
|
+
font_family: () => font_family,
|
|
23
|
+
font_family_types: () => font_family_types
|
|
24
24
|
});
|
|
25
25
|
module.exports = __toCommonJS(font_family_exports);
|
|
26
26
|
var defaultFont = {
|
|
@@ -29,10 +29,10 @@ var defaultFont = {
|
|
|
29
29
|
family: "",
|
|
30
30
|
type: ""
|
|
31
31
|
};
|
|
32
|
-
const
|
|
33
|
-
const
|
|
32
|
+
const font_family = {};
|
|
33
|
+
const font_family_types = {
|
|
34
34
|
"sans-serif": "Helvetica, Arial, sans-serif, --system-default",
|
|
35
35
|
serif: "Times New Roman, Georgia, serif, --system-default",
|
|
36
36
|
monospace: "Courier New, monospace, --system-default"
|
|
37
37
|
};
|
|
38
|
-
const
|
|
38
|
+
const font_face = {};
|
|
@@ -18,7 +18,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var font_exports = {};
|
|
20
20
|
__export(font_exports, {
|
|
21
|
-
|
|
21
|
+
font: () => font
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(font_exports);
|
|
24
24
|
var defFont = {
|
|
@@ -30,4 +30,4 @@ var defFont = {
|
|
|
30
30
|
fontStretch: "normal",
|
|
31
31
|
fontOpticalSizing: "auto"
|
|
32
32
|
};
|
|
33
|
-
const
|
|
33
|
+
const font = {};
|
|
@@ -18,8 +18,8 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var grid_exports = {};
|
|
20
20
|
__export(grid_exports, {
|
|
21
|
-
|
|
21
|
+
grid: () => grid
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(grid_exports);
|
|
24
24
|
const defaultProps = {};
|
|
25
|
-
const
|
|
25
|
+
const grid = defaultProps;
|
|
@@ -18,9 +18,9 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var icons_exports = {};
|
|
20
20
|
__export(icons_exports, {
|
|
21
|
-
|
|
22
|
-
|
|
21
|
+
icons: () => icons,
|
|
22
|
+
semantic_icons: () => semantic_icons
|
|
23
23
|
});
|
|
24
24
|
module.exports = __toCommonJS(icons_exports);
|
|
25
|
-
const
|
|
26
|
-
const
|
|
25
|
+
const icons = {};
|
|
26
|
+
const semantic_icons = {};
|
|
@@ -19,7 +19,7 @@ var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "defau
|
|
|
19
19
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
20
|
var defaultConfig_exports = {};
|
|
21
21
|
__export(defaultConfig_exports, {
|
|
22
|
-
|
|
22
|
+
reset: () => reset
|
|
23
23
|
});
|
|
24
24
|
module.exports = __toCommonJS(defaultConfig_exports);
|
|
25
25
|
__reExport(defaultConfig_exports, require("./sequence.js"), module.exports);
|
|
@@ -42,4 +42,4 @@ __reExport(defaultConfig_exports, require("./svg.js"), module.exports);
|
|
|
42
42
|
__reExport(defaultConfig_exports, require("./templates.js"), module.exports);
|
|
43
43
|
__reExport(defaultConfig_exports, require("./grid.js"), module.exports);
|
|
44
44
|
__reExport(defaultConfig_exports, require("./class.js"), module.exports);
|
|
45
|
-
const
|
|
45
|
+
const reset = {};
|
|
@@ -18,10 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var media_exports = {};
|
|
20
20
|
__export(media_exports, {
|
|
21
|
-
|
|
21
|
+
media: () => media
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(media_exports);
|
|
24
|
-
const
|
|
24
|
+
const media = {
|
|
25
25
|
tv: "(min-width: 2780px)",
|
|
26
26
|
light: "(prefers-color-scheme: light)",
|
|
27
27
|
dark: "(prefers-color-scheme: dark)",
|
|
@@ -18,11 +18,11 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var responsive_exports = {};
|
|
20
20
|
__export(responsive_exports, {
|
|
21
|
-
|
|
22
|
-
|
|
21
|
+
breakpoints: () => breakpoints,
|
|
22
|
+
devices: () => devices
|
|
23
23
|
});
|
|
24
24
|
module.exports = __toCommonJS(responsive_exports);
|
|
25
|
-
const
|
|
25
|
+
const breakpoints = {
|
|
26
26
|
screenL: 1920,
|
|
27
27
|
screenM: 1680,
|
|
28
28
|
screenS: 1440,
|
|
@@ -34,7 +34,7 @@ const BREAKPOINTS = {
|
|
|
34
34
|
mobileS: 480,
|
|
35
35
|
mobileXS: 375
|
|
36
36
|
};
|
|
37
|
-
const
|
|
37
|
+
const devices = {
|
|
38
38
|
screenXXL: [2560, 1440],
|
|
39
39
|
screenXL: [2240, 1260],
|
|
40
40
|
screenL: [1920, 1024],
|
|
@@ -18,10 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var sequence_exports = {};
|
|
20
20
|
__export(sequence_exports, {
|
|
21
|
-
|
|
21
|
+
sequence: () => sequence
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(sequence_exports);
|
|
24
|
-
const
|
|
24
|
+
const sequence = {
|
|
25
25
|
"minor-second": 1.067,
|
|
26
26
|
"major-second": 1.125,
|
|
27
27
|
"minor-third": 1.2,
|
|
@@ -18,12 +18,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var shadow_exports = {};
|
|
20
20
|
__export(shadow_exports, {
|
|
21
|
-
|
|
21
|
+
shadow: () => shadow
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(shadow_exports);
|
|
24
|
-
const shadow = {
|
|
25
|
-
// eslint-disable-line
|
|
26
|
-
name: "primaryShadow",
|
|
27
|
-
boxShadow: "gray12, 0 0px 50px 50px"
|
|
28
|
-
};
|
|
29
|
-
const SHADOW = {};
|
|
24
|
+
const shadow = {};
|
|
@@ -18,15 +18,15 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var spacing_exports = {};
|
|
20
20
|
__export(spacing_exports, {
|
|
21
|
-
|
|
21
|
+
spacing: () => spacing
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(spacing_exports);
|
|
24
24
|
var import_sequence = require("./sequence.js");
|
|
25
25
|
var import_typography = require("./typography.js");
|
|
26
26
|
const defaultProps = {
|
|
27
|
-
base: import_typography.
|
|
27
|
+
base: import_typography.typography.base,
|
|
28
28
|
type: "spacing",
|
|
29
|
-
ratio: import_sequence.
|
|
29
|
+
ratio: import_sequence.sequence.phi,
|
|
30
30
|
range: [-5, 15],
|
|
31
31
|
subSequence: true,
|
|
32
32
|
mediaRegenerate: false,
|
|
@@ -35,4 +35,4 @@ const defaultProps = {
|
|
|
35
35
|
scales: {},
|
|
36
36
|
vars: {}
|
|
37
37
|
};
|
|
38
|
-
const
|
|
38
|
+
const spacing = defaultProps;
|
|
@@ -18,9 +18,9 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var svg_exports = {};
|
|
20
20
|
__export(svg_exports, {
|
|
21
|
-
|
|
22
|
-
|
|
21
|
+
svg: () => svg,
|
|
22
|
+
svg_data: () => svg_data
|
|
23
23
|
});
|
|
24
24
|
module.exports = __toCommonJS(svg_exports);
|
|
25
|
-
const
|
|
26
|
-
const
|
|
25
|
+
const svg = {};
|
|
26
|
+
const svg_data = {};
|
|
@@ -18,7 +18,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var templates_exports = {};
|
|
20
20
|
__export(templates_exports, {
|
|
21
|
-
|
|
21
|
+
templates: () => templates
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(templates_exports);
|
|
24
|
-
const
|
|
24
|
+
const templates = {};
|
|
@@ -18,7 +18,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var theme_exports = {};
|
|
20
20
|
__export(theme_exports, {
|
|
21
|
-
|
|
21
|
+
theme: () => theme
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(theme_exports);
|
|
24
24
|
const themeA = {
|
|
@@ -33,4 +33,4 @@ const themeA = {
|
|
|
33
33
|
inverse: {}
|
|
34
34
|
// schemeAInverse
|
|
35
35
|
};
|
|
36
|
-
const
|
|
36
|
+
const theme = {};
|
|
@@ -18,7 +18,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var timing_exports = {};
|
|
20
20
|
__export(timing_exports, {
|
|
21
|
-
|
|
21
|
+
timing: () => timing
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(timing_exports);
|
|
24
24
|
var import_sequence = require("./sequence");
|
|
@@ -26,7 +26,7 @@ const defaultProps = {
|
|
|
26
26
|
default: 150,
|
|
27
27
|
base: 150,
|
|
28
28
|
type: "timing",
|
|
29
|
-
ratio: import_sequence.
|
|
29
|
+
ratio: import_sequence.sequence["perfect-fourth"],
|
|
30
30
|
range: [-3, 12],
|
|
31
31
|
mediaRegenerate: false,
|
|
32
32
|
unit: "ms",
|
|
@@ -34,4 +34,4 @@ const defaultProps = {
|
|
|
34
34
|
scales: {},
|
|
35
35
|
vars: {}
|
|
36
36
|
};
|
|
37
|
-
const
|
|
37
|
+
const timing = defaultProps;
|
|
@@ -18,7 +18,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var typography_exports = {};
|
|
20
20
|
__export(typography_exports, {
|
|
21
|
-
|
|
21
|
+
typography: () => typography
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(typography_exports);
|
|
24
24
|
var import_sequence = require("./sequence.js");
|
|
@@ -26,7 +26,7 @@ const defaultProps = {
|
|
|
26
26
|
browserDefault: 16,
|
|
27
27
|
base: 16,
|
|
28
28
|
type: "font-size",
|
|
29
|
-
ratio: import_sequence.
|
|
29
|
+
ratio: import_sequence.sequence["minor-third"],
|
|
30
30
|
range: [-3, 12],
|
|
31
31
|
h1Matches: 6,
|
|
32
32
|
lineHeight: 1.5,
|
|
@@ -38,4 +38,4 @@ const defaultProps = {
|
|
|
38
38
|
scales: {},
|
|
39
39
|
vars: {}
|
|
40
40
|
};
|
|
41
|
-
const
|
|
41
|
+
const typography = defaultProps;
|
|
@@ -18,9 +18,9 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var unit_exports = {};
|
|
20
20
|
__export(unit_exports, {
|
|
21
|
-
|
|
21
|
+
unit: () => unit
|
|
22
22
|
});
|
|
23
23
|
module.exports = __toCommonJS(unit_exports);
|
|
24
|
-
const
|
|
24
|
+
const unit = {
|
|
25
25
|
default: "em"
|
|
26
26
|
};
|
package/dist/cjs/factory.js
CHANGED
|
@@ -43,10 +43,16 @@ const CSS_VARS = {};
|
|
|
43
43
|
const CSS_MEDIA_VARS = {};
|
|
44
44
|
const _CONF = CONF;
|
|
45
45
|
const _confLower = {};
|
|
46
|
+
const toCamel = (s) => s.replace(/_([a-z])/g, (_, c) => c.toUpperCase());
|
|
47
|
+
const toUpper = (s) => s.replace(/([A-Z])/g, "_$1").toUpperCase();
|
|
46
48
|
for (const key in _CONF) {
|
|
47
49
|
const lower = key.toLowerCase();
|
|
48
50
|
_confLower[lower] = _CONF[key];
|
|
51
|
+
const camel = toCamel(lower);
|
|
52
|
+
if (camel !== lower) _confLower[camel] = _CONF[key];
|
|
49
53
|
if (lower !== key) _confLower[key] = _CONF[key];
|
|
54
|
+
const upper = toUpper(key);
|
|
55
|
+
if (upper !== key) _confLower[upper] = _CONF[key];
|
|
50
56
|
}
|
|
51
57
|
const CONFIG = {
|
|
52
58
|
verbose: false,
|
package/dist/cjs/set.js
CHANGED
|
@@ -37,9 +37,11 @@ const VALUE_TRANSFORMERS = {
|
|
|
37
37
|
gradient: import_system.setGradient,
|
|
38
38
|
font: import_system.setFont,
|
|
39
39
|
font_family: import_system.setFontFamily,
|
|
40
|
+
fontfamily: import_system.setFontFamily,
|
|
40
41
|
theme: import_system.setTheme,
|
|
41
42
|
icons: import_system.setSvgIcon,
|
|
42
43
|
semantic_icons: setSameValue,
|
|
44
|
+
semanticicons: setSameValue,
|
|
43
45
|
svg: import_system.setSVG,
|
|
44
46
|
svg_data: setSameValue,
|
|
45
47
|
typography: setSameValue,
|
|
@@ -96,6 +98,7 @@ const set = (recivedConfig, options = SET_OPTIONS) => {
|
|
|
96
98
|
globalTheme,
|
|
97
99
|
useDocumentTheme,
|
|
98
100
|
useDefaultConfig,
|
|
101
|
+
semanticIcons,
|
|
99
102
|
SEMANTIC_ICONS,
|
|
100
103
|
semantic_icons,
|
|
101
104
|
files,
|
|
@@ -115,9 +118,10 @@ const set = (recivedConfig, options = SET_OPTIONS) => {
|
|
|
115
118
|
if (globalTheme !== void 0) CONFIG.globalTheme = globalTheme;
|
|
116
119
|
if (recivedConfig.useThemeSuffixedVars !== void 0) CONFIG.useThemeSuffixedVars = recivedConfig.useThemeSuffixedVars;
|
|
117
120
|
if (useDefaultConfig !== void 0) CONFIG.useDefaultConfig = useDefaultConfig;
|
|
118
|
-
const _semanticIcons = SEMANTIC_ICONS || semantic_icons;
|
|
121
|
+
const _semanticIcons = semanticIcons || SEMANTIC_ICONS || semantic_icons;
|
|
119
122
|
if (_semanticIcons !== void 0) {
|
|
120
123
|
CONFIG.semantic_icons = _semanticIcons;
|
|
124
|
+
CONFIG.semanticIcons = CONFIG.semantic_icons;
|
|
121
125
|
CONFIG.SEMANTIC_ICONS = CONFIG.semantic_icons;
|
|
122
126
|
}
|
|
123
127
|
if (CONFIG.verbose) console.log(CONFIG);
|
|
@@ -135,21 +139,21 @@ const set = (recivedConfig, options = SET_OPTIONS) => {
|
|
|
135
139
|
if (lower !== key && keySet.has(lower)) return;
|
|
136
140
|
return setEach(key, config[key]);
|
|
137
141
|
});
|
|
138
|
-
if (config.
|
|
142
|
+
if (config.typography || config.TYPOGRAPHY) {
|
|
139
143
|
try {
|
|
140
144
|
(0, import_system.applyTypographySequence)();
|
|
141
145
|
} catch (e) {
|
|
142
146
|
if (CONFIG.verbose) console.warn("Error applying typography sequence", e);
|
|
143
147
|
}
|
|
144
148
|
}
|
|
145
|
-
if (config.
|
|
149
|
+
if (config.spacing || config.SPACING) {
|
|
146
150
|
try {
|
|
147
151
|
(0, import_system.applySpacingSequence)();
|
|
148
152
|
} catch (e) {
|
|
149
153
|
if (CONFIG.verbose) console.warn("Error applying spacing sequence", e);
|
|
150
154
|
}
|
|
151
155
|
}
|
|
152
|
-
if (config.
|
|
156
|
+
if (config.timing || config.TIMING) {
|
|
153
157
|
try {
|
|
154
158
|
(0, import_system.applyTimingSequence)();
|
|
155
159
|
} catch (e) {
|
package/dist/cjs/system/color.js
CHANGED
|
@@ -47,7 +47,7 @@ const getColor = (value, key, config) => {
|
|
|
47
47
|
alpha = parsed.alpha;
|
|
48
48
|
tone = parsed.tone;
|
|
49
49
|
}
|
|
50
|
-
const { COLOR, GRADIENT } = CONFIG;
|
|
50
|
+
const { color: COLOR, gradient: GRADIENT } = CONFIG;
|
|
51
51
|
let val = COLOR[name] || GRADIENT[name];
|
|
52
52
|
if (!val) {
|
|
53
53
|
if (CONFIG.verbose) console.warn("Can't find color ", name);
|
|
@@ -88,7 +88,7 @@ const getMediaColor = (value, globalTheme, config) => {
|
|
|
88
88
|
if (parsed.cssVar) return `var(${parsed.cssVar})`;
|
|
89
89
|
name = parsed.name;
|
|
90
90
|
}
|
|
91
|
-
const { COLOR, GRADIENT } = CONFIG;
|
|
91
|
+
const { color: COLOR, gradient: GRADIENT } = CONFIG;
|
|
92
92
|
const val = COLOR[name] || GRADIENT[name];
|
|
93
93
|
const isObj = (0, import_utils.isObject)(val);
|
|
94
94
|
if (isObj && val.value) return getColor(value, `@${globalTheme}`, config);
|
|
@@ -97,7 +97,7 @@ const getMediaColor = (value, globalTheme, config) => {
|
|
|
97
97
|
else {
|
|
98
98
|
const obj = {};
|
|
99
99
|
for (const mediaName in val) {
|
|
100
|
-
const query = CONFIG.
|
|
100
|
+
const query = CONFIG.media[mediaName.slice(1)];
|
|
101
101
|
const media = "@media " + (query === "print" ? `${query}` : `screen and ${query}`);
|
|
102
102
|
obj[media] = getColor(value, mediaName, config);
|
|
103
103
|
}
|
|
@@ -115,7 +115,7 @@ const setColor = (val, key, suffix) => {
|
|
|
115
115
|
val = getColor(rawRef);
|
|
116
116
|
if (!(val.includes("rgb") || val.includes("var") || val.includes("#"))) {
|
|
117
117
|
const parts = rawRef.split(" ");
|
|
118
|
-
const refColor = CONFIG.
|
|
118
|
+
const refColor = CONFIG.color[parts[0]];
|
|
119
119
|
if (refColor && refColor.value) {
|
|
120
120
|
let rgb2 = refColor.rgb;
|
|
121
121
|
const alpha2 = parts[1] !== void 0 ? parts[1] : "1";
|
|
@@ -26,7 +26,7 @@ var import_factory = require("../factory.js");
|
|
|
26
26
|
var import_utils2 = require("../utils");
|
|
27
27
|
const applyDocument = () => {
|
|
28
28
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
29
|
-
const { DOCUMENT, FONT_FAMILY, THEME, TYPOGRAPHY } = CONFIG;
|
|
29
|
+
const { document: DOCUMENT, font_family: FONT_FAMILY, theme: THEME, typography: TYPOGRAPHY } = CONFIG;
|
|
30
30
|
return (0, import_utils.merge)(DOCUMENT, {
|
|
31
31
|
theme: THEME.document,
|
|
32
32
|
fontFamily: (0, import_utils2.getDefaultOrFirstKey)(FONT_FAMILY),
|
package/dist/cjs/system/font.js
CHANGED
|
@@ -52,12 +52,12 @@ const setFont = (val, key) => {
|
|
|
52
52
|
};
|
|
53
53
|
const getFontFamily = (key, factory) => {
|
|
54
54
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
55
|
-
const { FONT_FAMILY } = CONFIG;
|
|
55
|
+
const { font_family: FONT_FAMILY } = CONFIG;
|
|
56
56
|
return (0, import_utils2.getDefaultOrFirstKey)(factory || FONT_FAMILY, key);
|
|
57
57
|
};
|
|
58
58
|
const setFontFamily = (val, key) => {
|
|
59
59
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
60
|
-
const { FONT_FAMILY, FONT_FAMILY_TYPES } = CONFIG;
|
|
60
|
+
const { font_family: FONT_FAMILY, font_family_types: FONT_FAMILY_TYPES } = CONFIG;
|
|
61
61
|
let { value, type } = val;
|
|
62
62
|
if (val.isDefault) FONT_FAMILY.default = key;
|
|
63
63
|
if ((0, import_utils.isObject)(value)) value = (0, import_smbls_utils.arrayzeValue)(value);
|
package/dist/cjs/system/reset.js
CHANGED
|
@@ -26,7 +26,7 @@ var import_factory = require("../factory.js");
|
|
|
26
26
|
var import_theme = require("./theme.js");
|
|
27
27
|
const applyReset = (reset = {}) => {
|
|
28
28
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
29
|
-
const { RESET, TYPOGRAPHY, DOCUMENT } = CONFIG;
|
|
29
|
+
const { reset: RESET, typography: TYPOGRAPHY, document: DOCUMENT } = CONFIG;
|
|
30
30
|
if (RESET) {
|
|
31
31
|
if (RESET[":root"]) {
|
|
32
32
|
const configReset = RESET;
|
|
@@ -66,7 +66,7 @@ const applyReset = (reset = {}) => {
|
|
|
66
66
|
height: "100%",
|
|
67
67
|
margin: 0,
|
|
68
68
|
fontFamily: DOCUMENT.fontFamily,
|
|
69
|
-
fontSize: TYPOGRAPHY.base / TYPOGRAPHY.browserDefault + CONFIG.
|
|
69
|
+
fontSize: TYPOGRAPHY.base / TYPOGRAPHY.browserDefault + CONFIG.unit.default,
|
|
70
70
|
...templates,
|
|
71
71
|
...body
|
|
72
72
|
},
|
|
@@ -81,7 +81,7 @@ const getShadow = (value, globalTheme) => {
|
|
|
81
81
|
}
|
|
82
82
|
if ((0, import_color2.isCSSVar)(value)) return `var(${value})`;
|
|
83
83
|
const [name] = (0, import_utils.isArray)(value) ? value : value.split(" ");
|
|
84
|
-
const
|
|
84
|
+
const SHADOW = CONFIG.shadow;
|
|
85
85
|
const val = SHADOW[name];
|
|
86
86
|
const isObj = (0, import_utils.isObject)(val);
|
|
87
87
|
if (!val) {
|
|
@@ -96,7 +96,7 @@ const getShadow = (value, globalTheme) => {
|
|
|
96
96
|
if (isObj) {
|
|
97
97
|
const obj = {};
|
|
98
98
|
for (const mediaName in val) {
|
|
99
|
-
const query = CONFIG.
|
|
99
|
+
const query = CONFIG.media[mediaName.slice(1)];
|
|
100
100
|
const media = "@media " + (query === "print" ? `${query}` : `screen and ${query}`);
|
|
101
101
|
obj[media] = val.value;
|
|
102
102
|
}
|
|
@@ -60,14 +60,14 @@ const checkIfBoxSize = (propertyName) => {
|
|
|
60
60
|
};
|
|
61
61
|
const applySpacingSequence = () => {
|
|
62
62
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
63
|
-
const { SPACING } = CONFIG;
|
|
63
|
+
const { spacing: SPACING } = CONFIG;
|
|
64
64
|
(0, import_utils2.generateSequence)(SPACING);
|
|
65
65
|
(0, import_utils2.applySequenceVars)(SPACING);
|
|
66
66
|
runThroughMedia(SPACING);
|
|
67
67
|
};
|
|
68
68
|
const getSequence = (sequenceProps) => {
|
|
69
69
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
70
|
-
const { SPACING } = CONFIG;
|
|
70
|
+
const { spacing: SPACING } = CONFIG;
|
|
71
71
|
if (!sequenceProps || !sequenceProps.sequence) return SPACING;
|
|
72
72
|
const hasGenerated = Object.keys(sequenceProps.sequence).length > 0;
|
|
73
73
|
return hasGenerated ? sequenceProps : (0, import_utils2.generateSequence)(sequenceProps);
|
|
@@ -108,7 +108,7 @@ const getSpacingByKey = (value, propertyName = "padding", sequenceProps, fnPrefi
|
|
|
108
108
|
};
|
|
109
109
|
const getSpacingBasedOnRatio = (props, propertyName, val, fnPrefix) => {
|
|
110
110
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
111
|
-
const { SPACING } = CONFIG;
|
|
111
|
+
const { spacing: SPACING } = CONFIG;
|
|
112
112
|
let value = val || props[propertyName];
|
|
113
113
|
if (!fnPrefix && (0, import_utils.isString)(value) && value.includes("(")) {
|
|
114
114
|
const fnArr = (0, import_utils2.getFnPrefixAndValue)(value);
|
package/dist/cjs/system/svg.js
CHANGED
|
@@ -43,21 +43,21 @@ const setSVG = (val, key) => {
|
|
|
43
43
|
};
|
|
44
44
|
const appendSVGSprite = (LIBRARY, options = DEF_OPTIONS) => {
|
|
45
45
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
46
|
-
const lib = Object.keys(LIBRARY).length ? {} : CONFIG.
|
|
47
|
-
for (const key in LIBRARY) lib[key] = CONFIG.
|
|
46
|
+
const lib = Object.keys(LIBRARY).length ? {} : CONFIG.svg;
|
|
47
|
+
for (const key in LIBRARY) lib[key] = CONFIG.svg[key];
|
|
48
48
|
appendSVG(lib, options);
|
|
49
49
|
};
|
|
50
50
|
const setSvgIcon = (val, key) => {
|
|
51
51
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
52
|
-
if (CONFIG.useIconSprite && !CONFIG.
|
|
52
|
+
if (CONFIG.useIconSprite && !CONFIG.semantic_icons?.[key]) {
|
|
53
53
|
return setSVG(val, key);
|
|
54
54
|
}
|
|
55
55
|
return val;
|
|
56
56
|
};
|
|
57
57
|
const appendSvgIconsSprite = (LIBRARY, options = DEF_OPTIONS) => {
|
|
58
58
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
59
|
-
const lib = Object.keys(LIBRARY).length ? {} : CONFIG.
|
|
60
|
-
for (const key in LIBRARY) lib[key] = CONFIG.
|
|
59
|
+
const lib = Object.keys(LIBRARY).length ? {} : CONFIG.icons;
|
|
60
|
+
for (const key in LIBRARY) lib[key] = CONFIG.icons[key];
|
|
61
61
|
appendSVG(lib, options);
|
|
62
62
|
};
|
|
63
63
|
const createSVGSpriteElement = (options = { isRoot: true }) => {
|
package/dist/cjs/system/theme.js
CHANGED
|
@@ -47,7 +47,7 @@ const getThemeValue = (theme) => {
|
|
|
47
47
|
const getTheme = (value, modifier) => {
|
|
48
48
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
49
49
|
if (CONFIG.useVariable) return getMediaTheme(value, modifier);
|
|
50
|
-
const
|
|
50
|
+
const THEME = CONFIG.theme;
|
|
51
51
|
if ((0, import_utils.isString)(value)) {
|
|
52
52
|
const [theme, subtheme] = value.split(" ");
|
|
53
53
|
const isOurTheme = THEME[theme];
|
|
@@ -118,7 +118,7 @@ const setHelpers = (theme, value) => {
|
|
|
118
118
|
const keys = Object.keys(helpers);
|
|
119
119
|
keys.map((key) => {
|
|
120
120
|
const helper = helpers[key];
|
|
121
|
-
if ((0, import_utils.isString)(helper)) helpers[key] = CONFIG.
|
|
121
|
+
if ((0, import_utils.isString)(helper)) helpers[key] = CONFIG.theme[helper];
|
|
122
122
|
else getThemeValue(helpers[key]);
|
|
123
123
|
return theme;
|
|
124
124
|
});
|
|
@@ -251,7 +251,7 @@ const setMediaTheme = (val, key, suffix, prefers) => {
|
|
|
251
251
|
}
|
|
252
252
|
}
|
|
253
253
|
if ((0, import_utils.isString)(val) && (0, import_color2.isCSSVar)(val)) {
|
|
254
|
-
const
|
|
254
|
+
const THEME = CONFIG.theme;
|
|
255
255
|
const value = THEME[val.slice(2)];
|
|
256
256
|
const getReferenced = getMediaTheme(value, prefers);
|
|
257
257
|
return getReferenced;
|
|
@@ -300,7 +300,7 @@ const getMediaTheme = (value, modifier) => {
|
|
|
300
300
|
return;
|
|
301
301
|
}
|
|
302
302
|
const [themeName, ...themeModifiers] = (0, import_utils.isArray)(value) ? value : value.split(" ");
|
|
303
|
-
let themeValue = activeConfig.
|
|
303
|
+
let themeValue = activeConfig.theme[themeName];
|
|
304
304
|
if (themeValue && themeModifiers.length) {
|
|
305
305
|
themeValue = findModifier(themeValue, themeModifiers);
|
|
306
306
|
} else if (themeValue && modifier) {
|
|
@@ -28,18 +28,18 @@ var import_factory = require("../factory.js");
|
|
|
28
28
|
var import_utils = require("../utils");
|
|
29
29
|
const applyTimingSequence = () => {
|
|
30
30
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
31
|
-
const { TIMING } = CONFIG;
|
|
31
|
+
const { timing: TIMING } = CONFIG;
|
|
32
32
|
(0, import_utils.generateSequence)(TIMING);
|
|
33
33
|
(0, import_utils.applySequenceVars)(TIMING);
|
|
34
34
|
};
|
|
35
35
|
const getTimingFunction = (value) => {
|
|
36
36
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
37
|
-
const { TIMING } = CONFIG;
|
|
37
|
+
const { timing: TIMING } = CONFIG;
|
|
38
38
|
return TIMING[value] || TIMING[(0, import_smbls_utils.toCamelCase)(value)] || value;
|
|
39
39
|
};
|
|
40
40
|
const getTimingByKey = (value, property = "timing") => {
|
|
41
41
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
42
|
-
const { TIMING } = CONFIG;
|
|
42
|
+
const { timing: TIMING } = CONFIG;
|
|
43
43
|
return (0, import_utils.getSequenceValuePropertyPair)(
|
|
44
44
|
value,
|
|
45
45
|
property,
|
|
@@ -29,7 +29,7 @@ var import_factory = require("../factory.js");
|
|
|
29
29
|
var import_utils2 = require("../utils");
|
|
30
30
|
const runThroughMedia = (FACTORY) => {
|
|
31
31
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
32
|
-
const { TYPOGRAPHY, MEDIA } = CONFIG;
|
|
32
|
+
const { typography: TYPOGRAPHY, media: MEDIA } = CONFIG;
|
|
33
33
|
for (const prop in FACTORY) {
|
|
34
34
|
const isPropMedia = prop.slice(0, 1) === "@";
|
|
35
35
|
const mediaValue = FACTORY[prop];
|
|
@@ -86,7 +86,7 @@ const applyHeadings = (props) => {
|
|
|
86
86
|
};
|
|
87
87
|
const applyTypographySequence = () => {
|
|
88
88
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
89
|
-
const { TYPOGRAPHY } = CONFIG;
|
|
89
|
+
const { typography: TYPOGRAPHY } = CONFIG;
|
|
90
90
|
(0, import_utils2.generateSequence)(TYPOGRAPHY);
|
|
91
91
|
applyHeadings(TYPOGRAPHY);
|
|
92
92
|
(0, import_utils2.applySequenceVars)(TYPOGRAPHY);
|
|
@@ -94,6 +94,6 @@ const applyTypographySequence = () => {
|
|
|
94
94
|
};
|
|
95
95
|
const getFontSizeByKey = (value) => {
|
|
96
96
|
const CONFIG = (0, import_factory.getActiveConfig)();
|
|
97
|
-
const { TYPOGRAPHY } = CONFIG;
|
|
97
|
+
const { typography: TYPOGRAPHY } = CONFIG;
|
|
98
98
|
return (0, import_utils2.getSequenceValuePropertyPair)(value, "fontSize", TYPOGRAPHY);
|
|
99
99
|
};
|