@symbo.ls/scratch 3.8.9 → 3.14.1

package/README.md

@@ -1,10 +1,10 @@
 # Scratch framework
 
-Scratch is CSS framework and methodology to build web, mobile and TV applications with one code base. 
+Design system factory for Symbols. Receives a configuration and outputs resolved design tokens (colors, themes, fonts, spacing, media queries). In v3.14, Scratch feeds into the atomic CSS engine (`@symbo.ls/css`) for class generation.
 
 [![npm version](https://badge.fury.io/js/%40rackai%2Fscratch.svg)](https://badge.fury.io/js/%40rackai%2Fscratch)
 
-Recevies a configuration and outputs the system of design related properties. It also applies reset by default and receives a few options:
+Receives a configuration and outputs the system of design related properties. It also applies reset by default and receives a few options:
 
 | option | default | description |
 | --- | --- | --- |

package/dist/cjs/defaultConfig/animation.js

@@ -16,9 +16,11 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/animation.js
 var animation_exports = {};
 __export(animation_exports, {
-  animation: () => animation
+  ANIMATION: () => ANIMATION
 });
 module.exports = __toCommonJS(animation_exports);
-const animation = {};
+var ANIMATION = {};

package/dist/cjs/defaultConfig/cases.js

@@ -16,9 +16,11 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/cases.js
 var cases_exports = {};
 __export(cases_exports, {
-  cases: () => cases
+  CASES: () => CASES
 });
 module.exports = __toCommonJS(cases_exports);
-const cases = {};
+var CASES = {};

package/dist/cjs/defaultConfig/class.js

@@ -16,10 +16,12 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/class.js
 var class_exports = {};
 __export(class_exports, {
   CLASS: () => CLASS
 });
 module.exports = __toCommonJS(class_exports);
-const defaultProps = {};
-const CLASS = defaultProps;
+var defaultProps = {};
+var CLASS = defaultProps;

package/dist/cjs/defaultConfig/color.js

@@ -16,16 +16,13 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/color.js
 var color_exports = {};
 __export(color_exports, {
-  color: () => color,
-  gradient: () => gradient
+  COLOR: () => COLOR,
+  GRADIENT: () => GRADIENT
 });
 module.exports = __toCommonJS(color_exports);
-var proto = {
-  // eslint-disable-line
-  name: "",
-  value: ""
-};
-const color = {};
-const gradient = {};
+var COLOR = {};
+var GRADIENT = {};

package/dist/cjs/defaultConfig/document.js

@@ -16,9 +16,11 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/document.js
 var document_exports = {};
 __export(document_exports, {
-  document: () => document
+  DOCUMENT: () => DOCUMENT
 });
 module.exports = __toCommonJS(document_exports);
-const document = {};
+var DOCUMENT = {};

package/dist/cjs/defaultConfig/font-family.js

@@ -16,23 +16,19 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/font-family.js
 var font_family_exports = {};
 __export(font_family_exports, {
-  font_face: () => font_face,
-  font_family: () => font_family,
-  font_family_types: () => font_family_types
+  FONT_FACE: () => FONT_FACE,
+  FONT_FAMILY: () => FONT_FAMILY,
+  FONT_FAMILY_TYPES: () => FONT_FAMILY_TYPES
 });
 module.exports = __toCommonJS(font_family_exports);
-var defaultFont = {
-  // eslint-disable-line
-  name: "",
-  family: "",
-  type: ""
-};
-const font_family = {};
-const font_family_types = {
+var FONT_FAMILY = {};
+var FONT_FAMILY_TYPES = {
   "sans-serif": "Helvetica, Arial, sans-serif, --system-default",
   serif: "Times New Roman, Georgia, serif, --system-default",
   monospace: "Courier New, monospace, --system-default"
 };
-const font_face = {};
+var FONT_FACE = {};

package/dist/cjs/defaultConfig/font.js

@@ -16,18 +16,11 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/font.js
 var font_exports = {};
 __export(font_exports, {
-  font: () => font
+  FONT: () => FONT
 });
 module.exports = __toCommonJS(font_exports);
-var defFont = {
-  // eslint-disable-line
-  name: "",
-  url: "",
-  fontStyle: "",
-  fontWeight: 500,
-  fontStretch: "normal",
-  fontOpticalSizing: "auto"
-};
-const font = {};
+var FONT = {};

package/dist/cjs/defaultConfig/grid.js

@@ -16,10 +16,12 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/grid.js
 var grid_exports = {};
 __export(grid_exports, {
-  grid: () => grid
+  GRID: () => GRID
 });
 module.exports = __toCommonJS(grid_exports);
-const defaultProps = {};
-const grid = defaultProps;
+var defaultProps = {};
+var GRID = defaultProps;

package/dist/cjs/defaultConfig/icons.js

@@ -16,11 +16,13 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/icons.js
 var icons_exports = {};
 __export(icons_exports, {
-  icons: () => icons,
-  semantic_icons: () => semantic_icons
+  ICONS: () => ICONS,
+  SEMANTIC_ICONS: () => SEMANTIC_ICONS
 });
 module.exports = __toCommonJS(icons_exports);
-const icons = {};
-const semantic_icons = {};
+var ICONS = {};
+var SEMANTIC_ICONS = {};

package/dist/cjs/defaultConfig/index.js

@@ -15,32 +15,208 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/index.js
 var defaultConfig_exports = {};
 __export(defaultConfig_exports, {
-  reset: () => reset,
-  vars: () => vars
+  ANIMATION: () => ANIMATION,
+  BREAKPOINTS: () => BREAKPOINTS,
+  CASES: () => CASES,
+  CLASS: () => CLASS,
+  COLOR: () => COLOR,
+  DEVICES: () => DEVICES,
+  DOCUMENT: () => DOCUMENT,
+  FONT: () => FONT,
+  FONT_FACE: () => FONT_FACE,
+  FONT_FAMILY: () => FONT_FAMILY,
+  FONT_FAMILY_TYPES: () => FONT_FAMILY_TYPES,
+  GRADIENT: () => GRADIENT,
+  GRID: () => GRID,
+  ICONS: () => ICONS,
+  MEDIA: () => MEDIA,
+  RESET: () => RESET,
+  SEMANTIC_ICONS: () => SEMANTIC_ICONS,
+  SEQUENCE: () => SEQUENCE,
+  SHADOW: () => SHADOW,
+  SPACING: () => SPACING,
+  SVG: () => SVG,
+  SVG_DATA: () => SVG_DATA,
+  TEMPLATES: () => TEMPLATES,
+  THEME: () => THEME,
+  TIMING: () => TIMING,
+  TYPOGRAPHY: () => TYPOGRAPHY,
+  UNIT: () => UNIT
 });
 module.exports = __toCommonJS(defaultConfig_exports);
-__reExport(defaultConfig_exports, require("./sequence.js"), module.exports);
-__reExport(defaultConfig_exports, require("./unit.js"), module.exports);
-__reExport(defaultConfig_exports, require("./typography.js"), module.exports);
-__reExport(defaultConfig_exports, require("./font.js"), module.exports);
-__reExport(defaultConfig_exports, require("./font-family.js"), module.exports);
-__reExport(defaultConfig_exports, require("./media.js"), module.exports);
-__reExport(defaultConfig_exports, require("./spacing.js"), module.exports);
-__reExport(defaultConfig_exports, require("./color.js"), module.exports);
-__reExport(defaultConfig_exports, require("./theme.js"), module.exports);
-__reExport(defaultConfig_exports, require("./shadow.js"), module.exports);
-__reExport(defaultConfig_exports, require("./icons.js"), module.exports);
-__reExport(defaultConfig_exports, require("./timing.js"), module.exports);
-__reExport(defaultConfig_exports, require("./document.js"), module.exports);
-__reExport(defaultConfig_exports, require("./responsive.js"), module.exports);
-__reExport(defaultConfig_exports, require("./animation.js"), module.exports);
-__reExport(defaultConfig_exports, require("./svg.js"), module.exports);
-__reExport(defaultConfig_exports, require("./templates.js"), module.exports);
-__reExport(defaultConfig_exports, require("./grid.js"), module.exports);
-__reExport(defaultConfig_exports, require("./class.js"), module.exports);
-const reset = {};
-const vars = {};
+
+// src/defaultConfig/sequence.js
+var SEQUENCE = {
+  "minor-second": 1.067,
+  "major-second": 1.125,
+  "minor-third": 1.2,
+  "major-third": 1.25,
+  "perfect-fourth": 1.333,
+  "augmented-fourth": 1.414,
+  "perfect-fifth": 1.5,
+  "minor-sixth": 1.6,
+  phi: 1.618,
+  // golden-ratio
+  "major-sixth": 1.667,
+  "square-root-3": 1.732,
+  // theodorus
+  "minor-seventh": 1.778,
+  "major-seventh": 1.875,
+  octave: 2,
+  "square-root-5": 2.23,
+  // pythagoras
+  "major-tenth": 2.5,
+  "major-eleventh": 2.667,
+  "major-twelfth": 3,
+  pi: 3.14,
+  // archimedes
+  "double-octave": 4
+};
+
+// src/defaultConfig/unit.js
+var UNIT = {
+  default: "em"
+};
+
+// src/defaultConfig/typography.js
+var defaultProps = {
+  browserDefault: 16,
+  base: 16,
+  type: "font-size",
+  ratio: SEQUENCE["minor-third"],
+  range: [-3, 12],
+  h1Matches: 6,
+  lineHeight: 1.5,
+  subSequence: true,
+  mediaRegenerate: false,
+  unit: "em",
+  templates: {},
+  sequence: {},
+  scales: {},
+  vars: {}
+};
+var TYPOGRAPHY = defaultProps;
+
+// src/defaultConfig/font.js
+var FONT = {};
+
+// src/defaultConfig/font-family.js
+var FONT_FAMILY = {};
+var FONT_FAMILY_TYPES = {
+  "sans-serif": "Helvetica, Arial, sans-serif, --system-default",
+  serif: "Times New Roman, Georgia, serif, --system-default",
+  monospace: "Courier New, monospace, --system-default"
+};
+var FONT_FACE = {};
+
+// src/defaultConfig/media.js
+var MEDIA = {
+  tv: "(min-width: 2780px)",
+  light: "(prefers-color-scheme: light)",
+  dark: "(prefers-color-scheme: dark)",
+  print: "print"
+};
+
+// src/defaultConfig/spacing.js
+var defaultProps2 = {
+  base: TYPOGRAPHY.base,
+  type: "spacing",
+  ratio: SEQUENCE.phi,
+  range: [-5, 15],
+  subSequence: true,
+  mediaRegenerate: false,
+  unit: "em",
+  sequence: {},
+  scales: {},
+  vars: {}
+};
+var SPACING = defaultProps2;
+
+// src/defaultConfig/color.js
+var COLOR = {};
+var GRADIENT = {};
+
+// src/defaultConfig/theme.js
+var THEME = {};
+
+// src/defaultConfig/shadow.js
+var SHADOW = {};
+
+// src/defaultConfig/icons.js
+var ICONS = {};
+var SEMANTIC_ICONS = {};
+
+// src/defaultConfig/timing.js
+var defaultProps3 = {
+  default: 150,
+  base: 150,
+  type: "timing",
+  ratio: SEQUENCE["perfect-fourth"],
+  range: [-3, 12],
+  mediaRegenerate: false,
+  unit: "ms",
+  sequence: {},
+  scales: {},
+  vars: {}
+};
+var TIMING = defaultProps3;
+
+// src/defaultConfig/document.js
+var DOCUMENT = {};
+
+// src/defaultConfig/responsive.js
+var BREAKPOINTS = {
+  screenL: 1920,
+  screenM: 1680,
+  screenS: 1440,
+  tabletL: 1366,
+  tabletM: 1280,
+  tabletS: 1024,
+  mobileL: 768,
+  mobileM: 560,
+  mobileS: 480,
+  mobileXS: 375
+};
+var DEVICES = {
+  screenXXL: [2560, 1440],
+  screenXL: [2240, 1260],
+  screenL: [1920, 1024],
+  screenM: [1680, 1024],
+  screenS: [1440, 720],
+  tabletL: [1366, 926],
+  tabletM: [1280, 768],
+  tabletS: [1024, 768],
+  mobileL: [768, 375],
+  mobileM: [560, 768],
+  mobileS: [480, 768],
+  mobileXS: [375, 768]
+};
+
+// src/defaultConfig/cases.js
+var CASES = {};
+
+// src/defaultConfig/animation.js
+var ANIMATION = {};
+
+// src/defaultConfig/svg.js
+var SVG = {};
+var SVG_DATA = {};
+
+// src/defaultConfig/templates.js
+var TEMPLATES = {};
+
+// src/defaultConfig/grid.js
+var defaultProps4 = {};
+var GRID = defaultProps4;
+
+// src/defaultConfig/class.js
+var defaultProps5 = {};
+var CLASS = defaultProps5;
+
+// src/defaultConfig/index.js
+var RESET = {};

package/dist/cjs/defaultConfig/media.js

@@ -16,12 +16,14 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/media.js
 var media_exports = {};
 __export(media_exports, {
-  media: () => media
+  MEDIA: () => MEDIA
 });
 module.exports = __toCommonJS(media_exports);
-const media = {
+var MEDIA = {
   tv: "(min-width: 2780px)",
   light: "(prefers-color-scheme: light)",
   dark: "(prefers-color-scheme: dark)",

package/dist/cjs/defaultConfig/responsive.js

@@ -16,13 +16,15 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/responsive.js
 var responsive_exports = {};
 __export(responsive_exports, {
-  breakpoints: () => breakpoints,
-  devices: () => devices
+  BREAKPOINTS: () => BREAKPOINTS,
+  DEVICES: () => DEVICES
 });
 module.exports = __toCommonJS(responsive_exports);
-const breakpoints = {
+var BREAKPOINTS = {
   screenL: 1920,
   screenM: 1680,
   screenS: 1440,
@@ -34,7 +36,7 @@ const breakpoints = {
   mobileS: 480,
   mobileXS: 375
 };
-const devices = {
+var DEVICES = {
   screenXXL: [2560, 1440],
   screenXL: [2240, 1260],
   screenL: [1920, 1024],

package/dist/cjs/defaultConfig/sequence.js

@@ -16,12 +16,14 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/sequence.js
 var sequence_exports = {};
 __export(sequence_exports, {
-  sequence: () => sequence
+  SEQUENCE: () => SEQUENCE
 });
 module.exports = __toCommonJS(sequence_exports);
-const sequence = {
+var SEQUENCE = {
   "minor-second": 1.067,
   "major-second": 1.125,
   "minor-third": 1.2,

package/dist/cjs/defaultConfig/shadow.js

@@ -16,9 +16,11 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/shadow.js
 var shadow_exports = {};
 __export(shadow_exports, {
-  shadow: () => shadow
+  SHADOW: () => SHADOW
 });
 module.exports = __toCommonJS(shadow_exports);
-const shadow = {};
+var SHADOW = {};

package/dist/cjs/defaultConfig/spacing.js

@@ -16,17 +16,66 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/spacing.js
 var spacing_exports = {};
 __export(spacing_exports, {
-  spacing: () => spacing
+  SPACING: () => SPACING
 });
 module.exports = __toCommonJS(spacing_exports);
-var import_sequence = require("./sequence.js");
-var import_typography = require("./typography.js");
-const defaultProps = {
-  base: import_typography.typography.base,
+
+// src/defaultConfig/sequence.js
+var SEQUENCE = {
+  "minor-second": 1.067,
+  "major-second": 1.125,
+  "minor-third": 1.2,
+  "major-third": 1.25,
+  "perfect-fourth": 1.333,
+  "augmented-fourth": 1.414,
+  "perfect-fifth": 1.5,
+  "minor-sixth": 1.6,
+  phi: 1.618,
+  // golden-ratio
+  "major-sixth": 1.667,
+  "square-root-3": 1.732,
+  // theodorus
+  "minor-seventh": 1.778,
+  "major-seventh": 1.875,
+  octave: 2,
+  "square-root-5": 2.23,
+  // pythagoras
+  "major-tenth": 2.5,
+  "major-eleventh": 2.667,
+  "major-twelfth": 3,
+  pi: 3.14,
+  // archimedes
+  "double-octave": 4
+};
+
+// src/defaultConfig/typography.js
+var defaultProps = {
+  browserDefault: 16,
+  base: 16,
+  type: "font-size",
+  ratio: SEQUENCE["minor-third"],
+  range: [-3, 12],
+  h1Matches: 6,
+  lineHeight: 1.5,
+  subSequence: true,
+  mediaRegenerate: false,
+  unit: "em",
+  templates: {},
+  sequence: {},
+  scales: {},
+  vars: {}
+};
+var TYPOGRAPHY = defaultProps;
+
+// src/defaultConfig/spacing.js
+var defaultProps2 = {
+  base: TYPOGRAPHY.base,
   type: "spacing",
-  ratio: import_sequence.sequence.phi,
+  ratio: SEQUENCE.phi,
   range: [-5, 15],
   subSequence: true,
   mediaRegenerate: false,
@@ -35,4 +84,4 @@ const defaultProps = {
   scales: {},
   vars: {}
 };
-const spacing = defaultProps;
+var SPACING = defaultProps2;

package/dist/cjs/defaultConfig/svg.js

@@ -16,11 +16,13 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/svg.js
 var svg_exports = {};
 __export(svg_exports, {
-  svg: () => svg,
-  svg_data: () => svg_data
+  SVG: () => SVG,
+  SVG_DATA: () => SVG_DATA
 });
 module.exports = __toCommonJS(svg_exports);
-const svg = {};
-const svg_data = {};
+var SVG = {};
+var SVG_DATA = {};

package/dist/cjs/defaultConfig/templates.js

@@ -16,9 +16,11 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/templates.js
 var templates_exports = {};
 __export(templates_exports, {
-  templates: () => templates
+  TEMPLATES: () => TEMPLATES
 });
 module.exports = __toCommonJS(templates_exports);
-const templates = {};
+var TEMPLATES = {};

package/dist/cjs/defaultConfig/theme.js

@@ -16,21 +16,11 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/defaultConfig/theme.js
 var theme_exports = {};
 __export(theme_exports, {
-  theme: () => theme
+  THEME: () => THEME
 });
 module.exports = __toCommonJS(theme_exports);
-const themeA = {
-  // eslint-disable-line no-unused-vars
-  text: "blue",
-  background: "white",
-  border: "black",
-  // .opacity(0.2),
-  active: {},
-  helpers: [],
-  themes: {},
-  inverse: {}
-  // schemeAInverse
-};
-const theme = {};
+var THEME = {};