@openedx/paragon 22.0.0-alpha.24 → 22.1.0

package/tokens/css-utilities.js

@@ -1,56 +0,0 @@
-/**
- * Implements bg-variant mixin from bootstrap. Creates utility classes for background colors based on theme color.
- */
-function bgVariant(token) {
-  const { attributes: { type, item }, name, actions } = token;
-  const parent = `.bg-${type}${item === 'base' ? '' : `-${item}`}`;
-  return `${parent} {
-  background-color: ${`var(--${name})`} !important;
-}
-
-a${parent}:hover,
-a${parent}:focus,
-button${parent}:hover,
-button${parent}:focus {
-  background-color: ${actions.default} !important;
-}
-
-`;
-}
-
-/**
- * Implements text-emphasis-variant mixin from bootstrap. Creates utility classes for text colors based on theme color.
- */
-function textEmphasisVariant(token) {
-  const { attributes: { type, item }, name, actions } = token;
-  const parent = `.text-${type}${item === 'base' ? '' : `-${item}`}`;
-  return `${parent} {
-  color: ${`var(--${name})`} !important;
-}
-
-a${parent}:hover,
-a${parent}:focus {
-  color: ${actions.default} !important;
-}
-
-`;
-}
-
-/**
- * Creates utility class for border color.
- */
-function borderColor(token) {
-  const { attributes: { type, item }, name } = token;
-  const className = `.border-${type}${item === 'base' ? '' : `-${item}`}`;
-  return `${className} {
-  border-color: ${`var(--${name})`} !important;
-}
-
-`;
-}
-
-module.exports = {
-  bgVariant,
-  textEmphasisVariant,
-  borderColor,
-};

package/tokens/map-scss-to-css.js

@@ -1,24 +0,0 @@
-const fs = require('fs');
-const path = require('path');
-const { getSCSStoCSSMap, getFilesWithExtension } = require('./utils');
-
-const BASE_PATH = path.resolve(__dirname, './src');
-const TOKEN_PREFIX = '--pgn';
-
-function mapSCSStoCSS(sourcePath) {
-  const SCSStoCSSMap = {};
-  const tokenPaths = getFilesWithExtension(BASE_PATH, '.json');
-  if (sourcePath) {
-    tokenPaths.push(...getFilesWithExtension(sourcePath, '.json'));
-  }
-
-  tokenPaths.forEach(tokenFile => {
-    const tokenContent = fs.readFileSync(tokenFile, 'utf-8');
-    const parsed = JSON.parse(tokenContent);
-    getSCSStoCSSMap(TOKEN_PREFIX, parsed, SCSStoCSSMap);
-  });
-
-  return SCSStoCSSMap;
-}
-
-module.exports = mapSCSStoCSS;

package/tokens/replace-variables.js

@@ -1,32 +0,0 @@
-#!/usr/bin/env node
-const { program, Option } = require('commander');
-const { transformInPath } = require('./utils');
-const mapSCSStoCSS = require('./map-scss-to-css');
-
-program
-  .version('0.0.1')
-  .description('CLI to replace SCSS variables usages or definitions to CSS variables and vice versa in .scss files.')
-  .requiredOption('-p, --filePath <filePath>', 'Path to the file or directory where to replace variables.')
-  .addOption(new Option('-s, --source <sourcePath>', 'Type of replacement: usage or definition. If set to "definition" the command will only update SCSS variables definitions with CSS variables, if set to "usage" - all occurrences of SCSS variables will we replaced'))
-  .addOption(new Option('-t, --replacementType <replacementType>', 'Type of replacement: usage or definition. If set to "definition" the command will only update SCSS variables definitions with CSS variables, if set to "usage" - all occurrences of SCSS variables will we replaced')
-    .choices(['usage', 'definition'])
-    .default('definition'))
-  .addOption(new Option('-d, --direction <name>', 'Map direction: css-to-scss or scss-to-css, if replacement type parameter is set to "definition" this has no effect.')
-    .choices(['scss-to-css', 'css-to-scss'])
-    .default('scss-to-css'))
-  .action(async (options) => {
-    const {
-      direction,
-      filePath,
-      replacementType,
-      source,
-    } = options;
-    const variablesMap = mapSCSStoCSS(source);
-    if (replacementType === 'usage') {
-      await transformInPath(filePath, variablesMap, 'usage', [], direction);
-    } else {
-      await transformInPath(filePath, variablesMap);
-    }
-  });
-
-program.parse(process.argv);

package/tokens/sass-helpers.js

@@ -1,98 +0,0 @@
-const path = require('path');
-const fs = require('fs');
-const chroma = require('chroma-js');
-const chalk = require('chalk');
-
-/**
- * Javascript version of bootstrap's color-yiq function. Decides whether to return light color variant or dark one
- * based on contrast value of the input color
- *
- * @param {Object} args
- * @param {Object} args.tokenName - Name of design token, used to log warnings
- * @param {Object} args.backgroundColor - chroma-js color instance
- * @param {String} args.light - light color variant from ./src/themes/{themeVariant}/global/other.json
- * @param {String} args.dark - dark color variant from ./src/themes/{themeVariant}/global/other.json
- * @param {Number} args.threshold - contrast threshold from ./src/core/global/other.json
- * @param {String} [args.themeVariant] - theme variant name that will be used to find default contrast colors
- *
- * @return chroma-js color instance (one of dark or light variants)
- */
-function colorYiq({
-  tokenName,
-  backgroundColor,
-  light,
-  dark,
-  threshold,
-  themeVariant = 'light',
-}) {
-  const defaultThresholdFile = fs.readFileSync(path.resolve(__dirname, 'src/core/global', 'other.json'), 'utf8');
-  const defaultThreshold = JSON.parse(defaultThresholdFile)['yiq-contrasted-threshold'];
-
-  const defaultColorsFile = fs.readFileSync(path.resolve(__dirname, `src/themes/${themeVariant}/global`, 'other.json'), 'utf8');
-  const {
-    'yiq-text-dark': defaultDark,
-    'yiq-text-light': defaultLight,
-  } = JSON.parse(defaultColorsFile);
-
-  const contrastThreshold = threshold || defaultThreshold;
-  const lightColor = light || defaultLight;
-  const darkColor = dark || defaultDark;
-
-  const [r, g, b] = backgroundColor.rgb();
-  const yiq = ((r * 299) + (g * 587) + (b * 114)) * 0.001;
-
-  let result = yiq >= contrastThreshold ? chroma(darkColor) : chroma(lightColor);
-
-  const maxAttempts = 10; // maximum number of attempts to darken/brighten color to pass contrast ratio
-  if (yiq >= contrastThreshold) {
-    // check whether the resulting combination of colors passes a11y contrast ratio of 4:5:1
-    // if not - darken resulting color until it does until maxAttempts is reached.
-    let numDarkenAttempts = 1;
-    while (chroma.contrast(backgroundColor, result) < 4.5 && numDarkenAttempts <= maxAttempts) {
-      result = result.darken(0.1);
-      numDarkenAttempts += 1;
-      if (numDarkenAttempts === maxAttempts) {
-        const title = `[a11y] Warning: Failed to sufficiently darken token ${chalk.keyword('orange').bold(tokenName)} to pass contrast ratio of 4.5:1.`;
-        const warningMetadata = [
-          `Background color: ${backgroundColor.hex()}`,
-          `Attempted foreground color: ${result.hex()}`,
-        ].join('\n    ');
-        const warn = `${title}\n    ${warningMetadata}`;
-        // eslint-disable-next-line no-console
-        console.log(chalk.keyword('yellow').bold(warn));
-      }
-    }
-    return result;
-  }
-
-  // check whether the resulting combination of colors passes a11y contrast ratio of 4:5:1
-  // if not - brighten resulting color until it does until maxAttempts is reached.
-  let numBrightenAttempts = 1;
-  while (chroma.contrast(backgroundColor, result) < 4.5 && numBrightenAttempts <= maxAttempts) {
-    result = result.brighten(0.1);
-    numBrightenAttempts += 1;
-    if (numBrightenAttempts === maxAttempts) {
-      const title = `[a11y] Warning: Failed to sufficiently brighten token ${chalk.keyword('orange').bold(tokenName)} to pass contrast ratio of 4.5:1.`;
-      const warningMetadata = [
-        `Background color: ${backgroundColor.hex()}`,
-        `Attempted foreground color: ${result.hex()}`,
-      ].join('\n    ');
-      const warn = `${title}\n    ${warningMetadata}`;
-      // eslint-disable-next-line no-console
-      console.log(chalk.keyword('yellow').bold(warn));
-    }
-  }
-  return result;
-}
-
-/**
- * Overrides chroma-js's lighten / darken functions to behave the same way SASS functions do.
- */
-const lighten = (color, hslPercent) => color.set('hsl.l', color.get('hsl.l') + hslPercent);
-const darken = (color, hslPercent) => lighten(color, -hslPercent);
-
-module.exports = {
-  colorYiq,
-  darken,
-  lighten,
-};

package/tokens/src/core/alias/size.json

@@ -1,15 +0,0 @@
-{
-  "size": {
-    "border": {
-      "width": { "value": "1px", "type": "dimension", "source": "$border-width", "description": "Default border width." },
-      "radius": {
-        "base": { "value": "6px", "type": "dimension", "source": "$border-radius", "description": "Default border radius." },
-        "lg": { "value": "7px", "type": "dimension", "source": "$border-radius-lg", "description": "Large border radius." },
-        "sm": { "value": "4px", "type": "dimension", "source": "$border-radius-sm", "description": "Small border radius." }
-      }
-    },
-    "rounded": {
-      "pill": { "value": "50rem", "type": "dimension", "source": "$rounded-pill", "description": "Pill border radius." }
-    }
-  }
-}

package/tokens/src/core/components/ActionRow.json

@@ -1,10 +0,0 @@
-{
-  "spacing": {
-    "action-row": {
-      "gap": {
-        "x": { "value": ".5rem", "type": "dimension", "source": "$action-row-gap-x" },
-        "y": { "value": ".5rem", "type": "dimension", "source": "$action-row-gap-y" }
-      }
-    }
-  }
-}

package/tokens/src/core/components/Alert.json

@@ -1,30 +0,0 @@
-{
-  "spacing": {
-    "alert": {
-      "padding": {
-        "y": { "value": "1.5rem", "type": "dimension", "source": "$alert-padding-y" },
-        "x": { "value": "1.5rem", "type": "dimension", "source": "$alert-padding-x" }
-      },
-      "margin-bottom": { "value": "1rem", "type": "dimension", "source": "$alert-margin-bottom" },
-      "actions-gap": { "value": "{spacing.spacer.3}", "type": "dimension", "source": "$alert-actions-gap" },
-      "icon-space": { "value": ".8rem", "type": "dimension", "source": "$alert-icon-space" }
-    }
-  },
-  "typography": {
-    "alert": {
-      "font": {
-        "weight-link": { "value": "{typography.font.weight.normal}", "type": "fontWeight", "source": "$alert-link-font-weight" },
-        "size": { "value": ".875rem", "type": "dimension", "source": "$alert-font-size" }
-      },
-      "line-height": { "value": "1.5rem", "type": "dimension", "source": "$alert-line-height" }
-    }
-  },
-  "size": {
-    "alert": {
-      "border": {
-        "radius": { "value": "{size.border.radius.base}", "type": "dimension", "source": "$alert-border-radius" },
-        "width": { "value": "0", "type": "dimension", "source": "$alert-border-width" }
-      }
-    }
-  }
-}

package/tokens/src/core/components/Annotation.json

@@ -1,25 +0,0 @@
-{
-  "spacing": {
-    "annotation": {
-      "padding": { "value": ".5rem", "type": "dimension", "source": "$annotation-padding" },
-      "arrow-side": {
-        "margin": { "value": ".25rem", "type": "dimension", "source": "$annotation-arrow-side-margin" }
-      }
-    }
-  },
-  "typography": {
-    "annotation": {
-      "font-size": { "value": "{typography.font.size.sm}", "type": "dimension", "source": "$annotation-font-size" },
-      "line-height": { "value": "{typography.line-height.sm}", "type": "dimension", "source": "$annotation-line-height" }
-    }
-  },
-  "size": {
-    "annotation": {
-      "arrow-border": {
-        "width": { "value": ".5rem", "type": "dimension", "source": "$annotation-arrow-border-width" }
-      },
-      "max-width": { "value": "18.75rem", "type": "dimension", "source": "$annotation-max-width" },
-      "border-radius": { "value": ".25rem", "type": "dimension", "source": "$annotation-border-radius" }
-    }
-  }
-}

package/tokens/src/core/components/Avatar.json

@@ -1,17 +0,0 @@
-{
-  "size": {
-    "avatar": {
-      "base": { "value": "3rem", "type": "dimension", "source": "$avatar-size" },
-      "xs": { "value": "1.5rem", "type": "dimension", "source": "$avatar-size-xs" },
-      "sm": { "value": "2.25rem", "type": "dimension", "source": "$avatar-size-sm" },
-      "lg": { "value": "4rem", "type": "dimension", "source": "$avatar-size-lg" },
-      "xl": { "value": "6rem", "type": "dimension", "source": "$avatar-size-xl" },
-      "xxl": { "value": "11.5rem", "type": "dimension", "source": "$avatar-size-xxl" },
-      "huge": { "value": "18.75rem", "type": "dimension", "source": "$avatar-size-huge" },
-      "border": {
-        "base": { "value": "1px", "type": "dimension", "source": "$avatar-border" },
-        "radius": { "value": "100%", "type": "percentage", "source": "$avatar-border-radius" }
-      }
-    }
-  }
-}

package/tokens/src/core/components/AvatarButton.json

@@ -1,11 +0,0 @@
-{
-  "spacing": {
-    "avatar-button": {
-      "padding-left": {
-        "base": { "value": ".25em", "type": "dimension", "source": "$avatar-button-padding-left" },
-        "sm": { "value": ".25em", "type": "dimension", "source": "$avatar-button-padding-left-sm" },
-        "lg": { "value": ".25em", "type": "dimension", "source": "$avatar-button-padding-left-lg" }
-      }
-    }
-  }
-}

package/tokens/src/core/components/Badge.json

@@ -1,33 +0,0 @@
-{
-  "spacing": {
-    "badge": {
-      "padding": {
-        "x": {
-          "base": { "value": ".5rem", "type": "dimension", "source": "$badge-padding-x" },
-          "pill": { "value": ".6em", "type": "dimension", "source": "$badge-pill-padding-x" }
-        },
-        "y": { "value": ".125rem", "type": "dimension", "source": "$badge-padding-y" }
-      }
-    }
-  },
-  "typography": {
-    "badge": {
-      "font": {
-        "size": { "value": "75%", "type": "percentage", "source": "$badge-font-size" },
-        "weight": { "value": "{typography.font.weight.bold}", "type": "fontWeight", "source": "$badge-font-weight" }
-      }
-    }
-  },
-  "size": {
-    "badge": {
-      "border-radius": {
-        "base": { "value": ".25rem", "type": "dimension", "source": "$badge-border-radius" },
-        "pill": { "value": "10rem", "type": "dimension", "source": "$badge-pill-border-radius" }
-      },
-      "focus-width": { "value": "{size.input.btn.focus-width}", "type": "dimension", "source": "$badge-focus-width" }
-    }
-  },
-  "transition": {
-    "badge": { "value": "none", "type": "transition", "source": "$badge-transition" }
-  }
-}

package/tokens/src/core/components/Breadcrumb.json

@@ -1,37 +0,0 @@
-{
-  "typography": {
-    "breadcrumb": {
-      "font-size": { "value": "inherit", "type": "dimension", "source": "$breadcrumb-font-size" }
-    }
-  },
-  "spacing": {
-    "breadcrumb": {
-      "padding": {
-        "y": { "value": ".75rem", "type": "dimension", "source": "$breadcrumb-padding-y" },
-        "x": { "value": "1rem", "type": "dimension", "source": "$breadcrumb-padding-x" },
-        "item": { "value": ".5rem", "type": "dimension", "source": "$breadcrumb-item-padding" }
-      },
-      "margin": {
-        "bottom": { "value": "1rem", "type": "dimension", "source": "$breadcrumb-margin-bottom" },
-        "left": { "value": ".5rem", "type": "dimension", "source": "$breadcrumb-margin-left" }
-      }
-    }
-  },
-  "size": {
-    "breadcrumb": {
-      "border": {
-        "radius": {
-          "base": {
-            "value": "{size.border.radius.base}", "type": "dimension", "source": "$breadcrumb-border-radius"
-          },
-          "focus": { "value": ".125rem", "type": "dimension", "source": "$breadcrumb-focus-border-radius" }
-        },
-        "axis": {
-          "x-focus": { "value": ".25rem", "type": "dimension", "source": "$breadcrumb-border-focus-axis-x" },
-          "y-focus": { "value": ".5rem", "type": "dimension", "source": "$breadcrumb-border-focus-axis-y" }
-        },
-        "width-focus": { "value": ".0625rem", "type": "dimension", "source": "$breadcrumb-border-focus-width" }
-      }
-    }
-  }
-}

package/tokens/src/core/components/Bubble.json

@@ -1,10 +0,0 @@
-{
-  "spacing": {
-    "bubble": {
-      "expandable-padding": {
-        "y": { "value": "0", "type": "transition", "source": "$bubble-expandable-padding-y" },
-        "x": { "value": ".25rem", "type": "transition", "source": "$bubble-expandable-padding-x" }
-      }
-    } 
-  }
-}

package/tokens/src/core/components/Button/core.json

@@ -1,105 +0,0 @@
-{
-  "spacing": {
-    "btn": {
-      "padding": {
-        "y": {
-          "base": {
-            "value": "{spacing.input.btn.padding.y}", "type": "dimension", "source": "$btn-padding-y"
-          },
-          "lg": {
-            "value": "{spacing.input.btn.padding.lg.y}", "type": "dimension", "source": "$btn-padding-y-lg"
-          },
-          "sm": {
-            "value": "{spacing.input.btn.padding.sm.y}", "type": "dimension", "source": "$btn-padding-y-sm"
-          }
-        },
-        "x": {
-          "base": { "value": "{spacing.input.btn.padding.x}", "type": "dimension", "source": "$btn-padding-x" },
-          "lg": {
-            "value": "{spacing.input.btn.padding.lg.x}", "type": "dimension", "source": "$btn-padding-x-lg"
-          },
-          "sm": {
-            "value": "{spacing.input.btn.padding.sm.x}", "type": "dimension", "source": "$btn-padding-x-sm"
-          }
-        }
-      },
-      "block": {
-        "spacing-y": { "value": ".5rem", "type": "dimension", "source": "$btn-block-spacing-y" }
-      },
-      "focus": {
-        "gap": { "value": "{size.btn.focus.width}", "type": "dimension", "source": "$btn-focus-gap" },
-        "border-gap": {
-          "value": "calc({size.btn.focus.width} + {spacing.btn.focus.gap})",
-          "type": "dimension",
-          "source": "$btn-focus-border-gap"
-        },
-        "distance-to-border": {
-          "value": "calc({spacing.btn.focus.border-gap} + {size.btn.border.width})",
-          "type": "dimension",
-          "source": "$btn-focus-distance-to-border"
-        }
-      }
-    }
-  },
-  "typography": {
-    "btn": {
-      "font": {
-        "family": {
-          "value": "{typography.input.btn.font.family}", "type": "fontFamily", "source": "$btn-font-family"
-        },
-        "size": {
-          "base": {
-            "value": "{typography.input.btn.font.size.base}", "type": "dimension", "source": "$btn-font-size"
-          },
-          "sm": {
-            "value": "{typography.input.btn.font.size.sm}", "type": "dimension", "source": "$btn-font-size-sm"
-          },
-          "lg": {
-            "value": "{typography.input.btn.font.size.lg}", "type": "dimension", "source": "$btn-font-size-lg"
-          }
-        },
-        "weight": {
-          "value": "{typography.font.weight.normal}", "type": "fontWeight", "source": "$btn-font-weight"
-        }
-      },
-      "line-height": {
-        "base": {
-          "value": "{typography.input.btn.line-height.base}", "type": "dimension", "source": "$btn-line-height"
-        },
-        "sm": {
-          "value": "{typography.input.btn.line-height.sm}", "type": "dimension", "source": "$btn-line-height-sm"
-        },
-        "lg": {
-          "value": "{typography.input.btn.line-height.lg}", "type": "dimension", "source": "$btn-line-height-lg"
-        }
-      }
-    }
-  },
-  "size": {
-    "btn": {
-      "border": {
-        "width": { "value": "{size.input.btn.border-width}", "type": "dimension", "source": "$btn-border-width" },
-        "radius": {
-          "base": { "value": "{size.border.radius.base}", "type": "dimension", "source": "$btn-border-radius" },
-          "lg": { "value": "{size.border.radius.lg}", "type": "dimension", "source": "$btn-border-radius-lg" },
-          "sm": { "value": "{size.border.radius.sm}", "type": "dimension", "source": "$btn-border-radius-sm" }
-        }
-      },
-      "focus": {
-        "width": { "value": "2px", "type": "dimension", "source": "$btn-focus-width" },
-        "border-radius": {
-          "base": {
-            "value": "calc({size.btn.border.radius.base} + {spacing.btn.focus.border-gap})",
-            "type": "dimension",
-            "source": "$btn-focus-border-radius"
-          },
-          "lg": { "value": "{size.btn.focus.border-radius.base}", "type": "dimension", "source": "$btn-focus-border-radius-lg" },
-          "sm": { "value": "{size.btn.border.radius.base}", "type": "dimension", "source": "$btn-focus-border-radius-sm" }
-        }
-      }
-    }
-  },
-  "transition": {
-    "btn": { "value": "none", "type": "transition", "source": "$btn-transition" }
-  }
-}

package/tokens/src/core/components/Card.json

@@ -1,91 +0,0 @@
-{
-  "spacing": {
-    "card": {
-      "spacer": {
-        "x": { "value": "1.25rem", "type": "dimension", "source": "$card-spacer-x" },
-        "y": { "value": ".75rem", "type": "dimension", "source": "$card-spacer-y" }
-      },
-      "margin": {
-        "group": { "value": "12px", "type": "dimension", "source": "$card-group-margin" },
-        "deck": { "value": "{spacing.card.margin.group}", "type": "dimension", "source": "$card-deck-margin" },
-        "deck-bottom": { "value": "{spacing.spacer.3}", "type": "dimension", "source": "$card-deck-margin-bottom" },
-        "grid": { "value": "{spacing.card.margin.group}", "type": "dimension", "source": "$card-grid-margin" },
-        "grid-bottom": { "value": "{spacing.spacer.3}", "type": "dimension", "source": "$card-grid-margin-bottom" }
-      },
-      "columns": {
-        "margin": { "value": "{spacing.card.spacer.y}", "type": "dimension", "source": "$card-columns-margin" },
-        "count": { "value": "3", "type": "dimension", "source": "$card-columns-count" },
-        "gap": { "value": "1.25rem", "type": "dimension", "source": "$card-columns-gap" }
-      },
-      "footer": {
-        "action-gap": { "value": ".5rem", "type": "dimension", "source": "$card-footer-actions-gap" }
-      },
-      "loading-skeleton": {
-        "spacer": { "value": ".313rem", "type": "dimension", "source": "$loading-skeleton-spacer" }
-      },
-      "logo": {
-        "left-offset": {
-          "base": { "value": "1.5rem", "type": "dimension", "source": "$card-logo-left-offset" },
-          "horizontal": { "value": ".4375rem", "type": "dimension", "source": "$card-logo-left-offset-horizontal" }
-        },
-        "bottom-offset": {
-          "base": { "value": "1rem", "type": "dimension", "source": "$card-logo-bottom-offset" },
-          "horizontal": { "value": ".4375rem", "type": "dimension", "source": "$card-logo-bottom-offset-horizontal" }
-        }
-      },
-      "focus": {
-        "border-offset": { "value": "5px", "type": "dimension", "source": "$card-focus-border-offset" }
-      }
-    }
-  },
-  "size": {
-    "card": {
-      "border": {
-        "width": { "value": "{size.border.width}", "type": "dimension", "source": "$card-border-width" },
-        "radius": {
-          "base": { "value": "{size.border.radius.base}", "type": "dimension", "source": "$card-border-radius" },
-          "logo": { "value": ".25rem", "type": "dimension", "source": "$card-logo-border-radius" }
-        }
-      },
-      "focus": {
-        "border": {
-          "width": { "value": "2px", "type": "dimension", "source": "$card-focus-border-width" },
-          "radius": {
-            "value": "calc({spacing.card.focus.border-offset} + {size.card.border.radius.base})",
-            "type": "dimension",
-            "source": "$card-focus-border-radius"
-          }
-        }
-      },
-      "image": {
-        "horizontal": {
-          "width": {
-            "max": { "value": "240px", "type": "dimension", "source": "$card-image-horizontal-max-width" },
-            "min": {
-              "value": "{size.card.image.horizontal.width.max}",
-              "type": "dimension",
-              "source": "$card-image-horizontal-min-width"
-            }
-          }
-        },
-        "vertical": {
-          "max-height": { "value": "140px", "type": "dimension", "source": "$card-image-vertical-max-height" }
-        },
-        "border-radius": { "value": "{size.card.border.radius.base}", "type": "dimension", "source": "$card-image-border-radius" }
-      },
-      "logo": {
-        "width": { "value": "7.25rem", "type": "dimension", "source": "$card-logo-width" },
-        "height": { "value": "4.125rem", "type": "dimension", "source": "$card-logo-height" }
-      }
-    }
-  },
-  "typography": {
-    "footer": {
-      "text": {
-        "font-size": {
-          "value": "{typography.font.size.small.x}", "type": "dimension", "source": "$card-footer-text-font-size"
-        }
-      }
-    }
-  }
-}

package/tokens/src/core/components/Carousel.json

@@ -1,37 +0,0 @@
-{
-  "size": {
-    "carousel": {
-      "control": {
-        "width": {
-          "base": { "value": "15%", "type": "percentage", "source": "$carousel-control-width" },
-          "icon": { "value": "20px", "type": "dimension", "source": "$carousel-control-icon-width" }
-        }
-      },
-      "indicator": {
-        "width": { "value": "30px", "type": "dimension", "source": "$carousel-indicator-width" },
-        "height": {
-          "base": { "value": "3px", "type": "dimension", "source": "$carousel-indicator-height" },
-          "area-hit": { "value": "10px", "type": "dimension", "source": "$carousel-indicator-hit-area-height" }
-        }
-      },
-      "caption-width": { "value": "70%", "type": "percentage", "source": "$carousel-caption-width" }
-    }
-  },
-  "spacing": {
-    "carousel": {
-      "indicator-spacer": { "value": "3px", "type": "dimension", "source": "$carousel-indicator-spacer" }
-    }
-  },
-  "transition": {
-    "carousel": {
-      "base": {
-        "value": "transform {transition.carousel.duration} ease-in-out",
-        "type": "transition",
-        "source": "$carousel-transition"
-      },
-      "duration": { "value": ".6s", "type": "duration", "source": "$carousel-transition-duration" },
-      "indicator": { "value": "opacity .6s ease", "type": "transition", "source": "$carousel-indicator-transition" },
-      "control": { "value": "opacity .15s ease", "type": "transition", "source": "$carousel-control-transition" }
-    }
-  }
-}