@primer/primitives 9.0.3 → 9.1.0-rc.c6c17c46

package/dist/build/transformers/utilities/rgbaFloatToHex.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.rgbaFloatToHex = void 0;
+const rgbaFloatToHex = ({ r, g, b, a }, alpha = true) => {
+    const values = [r, g, b, alpha === true && a && a < 1 ? a : undefined].filter(item => item !== undefined);
+    if (r > 1 || r < 0 || g > 1 || g < 0 || b > 1 || b < 0) {
+        throw new Error('Invalid RgbaFloat value. R, G and B values must be between 0 and 1.');
+    }
+    return `#${values
+        .map(v => Number(parseInt(`${v * 255}`, 10))
+        .toString(16)
+        .padStart(2, '0'))
+        .join('')}`;
+};
+exports.rgbaFloatToHex = rgbaFloatToHex;

package/dist/build/utilities/copyFromDir.d.ts

@@ -0,0 +1,8 @@
+/**
+ * copyFromDir
+ * @description Copies all files from source folder to destination
+ * @param source path
+ * @param destination path
+ * @returns promise
+ */
+export declare const copyFromDir: (source: string, destination: string) => Promise<void>;

package/dist/build/utilities/copyFromDir.js

@@ -0,0 +1,34 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.copyFromDir = void 0;
+/* istanbul ignore file */
+const promises_1 = require("fs/promises");
+/**
+ * copyFromDir
+ * @description Copies all files from source folder to destination
+ * @param source path
+ * @param destination path
+ * @returns promise
+ */
+const copyFromDir = (source, destination) => __awaiter(void 0, void 0, void 0, function* () {
+    // adjust trailing slash
+    const src = `${source.replace(/\/$/, '')}`;
+    const dest = `${destination.replace(/\/$/, '')}`;
+    // create dest if it does not exists
+    yield (0, promises_1.mkdir)(dest, { recursive: true });
+    // read files from source
+    const files = yield (0, promises_1.readdir)(src);
+    for (const file of files) {
+        (0, promises_1.copyFile)(`${src}/${file}`, `${dest}/${file}`);
+    }
+});
+exports.copyFromDir = copyFromDir;

package/dist/build/utilities/filterStringArray.d.ts

@@ -0,0 +1 @@
+export declare const filterStringArray: (string: string[]) => string[];

package/dist/build/utilities/filterStringArray.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.filterStringArray = void 0;
+const filterStringArray = (string) => {
+    // match unsupported characters
+    const regex = /[^a-zA-Z0-9]+/g;
+    // replace any non-letter and non-number character and split into word array
+    const stringArray = string
+        .filter(Boolean)
+        .join(' ')
+        .replace(regex, ' ')
+        .split(' ')
+        // remove undefined if exists
+        .filter((part) => Boolean(part) && typeof part === 'string');
+    return stringArray;
+};
+exports.filterStringArray = filterStringArray;

package/{src/utilities/getFlag.ts → dist/build/utilities/getFlag.d.ts}

@@ -5,8 +5,4 @@
  * @returns null if flag is not found, otherwise the value of the flag or the flag name if the flag has no value
  * @example `getFlag('--silent')` returns `null` if `--silent` is not found, `--silent` if `--silent` is found with no value, and `true` if `--silent=true` is found
  */
-export const getFlag = (flag: string, prefix = '--') => {
-  flag = `${prefix}${flag.replace(prefix, '')}`
-  const index = process.argv.findIndex(arg => arg === flag || arg.startsWith(`${flag}=`))
-  return index === -1 ? null : process.argv[index].replace(`${flag}=`, '')
-}
+export declare const getFlag: (flag: string, prefix?: string) => string | null;

package/dist/build/utilities/getFlag.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getFlag = void 0;
+/**
+ * Get the value of a flag from the command line
+ * @param flag name of the flag to get
+ * @param prefix default `--` but can be changed to `-` the part to the left of the flag name
+ * @returns null if flag is not found, otherwise the value of the flag or the flag name if the flag has no value
+ * @example `getFlag('--silent')` returns `null` if `--silent` is not found, `--silent` if `--silent` is found with no value, and `true` if `--silent=true` is found
+ */
+const getFlag = (flag, prefix = '--') => {
+    flag = `${prefix}${flag.replace(prefix, '')}`;
+    const index = process.argv.findIndex(arg => arg === flag || arg.startsWith(`${flag}=`));
+    return index === -1 ? null : process.argv[index].replace(`${flag}=`, '');
+};
+exports.getFlag = getFlag;

package/dist/build/utilities/index.d.ts

@@ -0,0 +1,3 @@
+export { copyFromDir } from './copyFromDir';
+export { upperCaseFirstCharacter } from './upperCaseFirstCharacter';
+export { toCamelCase } from './toCamelCase';

package/dist/build/utilities/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.toCamelCase = exports.upperCaseFirstCharacter = exports.copyFromDir = void 0;
+var copyFromDir_1 = require("./copyFromDir");
+Object.defineProperty(exports, "copyFromDir", { enumerable: true, get: function () { return copyFromDir_1.copyFromDir; } });
+var upperCaseFirstCharacter_1 = require("./upperCaseFirstCharacter");
+Object.defineProperty(exports, "upperCaseFirstCharacter", { enumerable: true, get: function () { return upperCaseFirstCharacter_1.upperCaseFirstCharacter; } });
+var toCamelCase_1 = require("./toCamelCase");
+Object.defineProperty(exports, "toCamelCase", { enumerable: true, get: function () { return toCamelCase_1.toCamelCase; } });

package/dist/build/utilities/joinFriendly.d.ts

@@ -0,0 +1 @@
+export declare const joinFriendly: (array: string[], lastJoin?: string) => string;

package/dist/build/utilities/joinFriendly.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.joinFriendly = void 0;
+const joinFriendly = (array, lastJoin = 'and') => array.length > 1 ? `${array.slice(0, -1).join(', ')} ${lastJoin} ${array.slice(-1)}` : `${array[0]}`;
+exports.joinFriendly = joinFriendly;

package/dist/build/utilities/schemaErrorMessage.d.ts

@@ -0,0 +1 @@
+export declare const schemaErrorMessage: (title: string, description?: string) => string;

package/dist/build/utilities/schemaErrorMessage.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.schemaErrorMessage = void 0;
+const schemaErrorMessage = (title, description) => `**${title}**${description ? `\n${description}` : ``}`;
+exports.schemaErrorMessage = schemaErrorMessage;

package/dist/build/utilities/toCamelCase.d.ts

@@ -0,0 +1 @@
+export declare const toCamelCase: (string: string | string[]) => string;

package/dist/build/utilities/toCamelCase.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.toCamelCase = void 0;
+const filterStringArray_1 = require("./filterStringArray");
+const upperCaseFirstCharacter_1 = require("./upperCaseFirstCharacter");
+const toCamelCase = (string) => {
+    if (!Array.isArray(string)) {
+        string = [string];
+    }
+    return ((0, filterStringArray_1.filterStringArray)(string)
+        // ucFirst all but first part
+        .map((part, index) => {
+        if (index > 0) {
+            return (0, upperCaseFirstCharacter_1.upperCaseFirstCharacter)(part);
+        }
+        return part;
+    })
+        .join(''));
+};
+exports.toCamelCase = toCamelCase;

package/dist/build/utilities/toPascalCase.d.ts

@@ -0,0 +1 @@
+export declare const toPascalCase: (string: string | string[]) => string;

package/dist/build/utilities/toPascalCase.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.toPascalCase = void 0;
+const filterStringArray_1 = require("./filterStringArray");
+const upperCaseFirstCharacter_1 = require("./upperCaseFirstCharacter");
+const toPascalCase = (string) => {
+    if (!Array.isArray(string)) {
+        string = [string];
+    }
+    return ((0, filterStringArray_1.filterStringArray)(string)
+        // ucFirst all but first part
+        .map((part) => {
+        return (0, upperCaseFirstCharacter_1.upperCaseFirstCharacter)(part);
+    })
+        .join(''));
+};
+exports.toPascalCase = toPascalCase;

package/dist/build/utilities/treeWalker.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @description converts tokens to type and returns array with used type
+ * @param tree object
+ * @param callback function to be run on valid items
+ * @param validItem function to test if a node is a validItem to be transformed
+ * @returns object
+ */
+export declare const treeWalker: (tree: unknown, callback: <T>(argument: T) => unknown, isValidItem: (argument: unknown) => boolean) => unknown;

package/dist/build/utilities/treeWalker.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.treeWalker = void 0;
+/**
+ * @description converts tokens to type and returns array with used type
+ * @param tree object
+ * @param callback function to be run on valid items
+ * @param validItem function to test if a node is a validItem to be transformed
+ * @returns object
+ */
+const treeWalker = (tree, callback, isValidItem) => {
+    // is a valid item -> pass through callback
+    if (isValidItem(tree)) {
+        return callback(tree);
+    }
+    // is non-object value -> ignore
+    if (typeof tree !== 'object' || tree === null) {
+        return;
+    }
+    // is obj -> continue
+    const nextObj = {};
+    for (const [prop, value] of Object.entries(tree)) {
+        nextObj[prop] = (0, exports.treeWalker)(value, callback, isValidItem);
+    }
+    return nextObj;
+};
+exports.treeWalker = treeWalker;

package/{src/utilities/upperCaseFirstCharacter.ts → dist/build/utilities/upperCaseFirstCharacter.d.ts}

@@ -5,6 +5,4 @@
  * @param string
  * @returns string
  */
-export const upperCaseFirstCharacter = ([firstLetter, ...restOfWord]: string): string => {
-  return firstLetter.toUpperCase() + restOfWord.join('')
-}
+export declare const upperCaseFirstCharacter: ([firstLetter, ...restOfWord]: string) => string;

package/dist/build/utilities/upperCaseFirstCharacter.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.upperCaseFirstCharacter = void 0;
+/**
+ * upperCaseFirstCharacter
+ * @scope custom implementation should only be used within `name path to ...` transformer
+ * @description changes first letter to uppercase but keeps the rest of the word as is
+ * @param string
+ * @returns string
+ */
+const upperCaseFirstCharacter = ([firstLetter, ...restOfWord]) => {
+    return firstLetter.toUpperCase() + restOfWord.join('');
+};
+exports.upperCaseFirstCharacter = upperCaseFirstCharacter;

package/package.json

@@ -1,14 +1,12 @@
 {
   "name": "@primer/primitives",
-  "version": "9.0.3",
+  "version": "9.1.0-rc.c6c17c46",
   "description": "Typography, spacing, and color primitives for Primer design system",
   "engines": {
     "node": ">=18.18.0 <18.19.0"
   },
   "files": [
-    "dist",
-    "src/**/*",
-    "!src/**/*.test.ts"
+    "dist"
   ],
   "repository": "https://github.com/primer/primitives",
   "keywords": [
@@ -26,11 +24,12 @@
   },
   "homepage": "https://github.com/primer/primitives#readme",
   "scripts": {
-    "build": "npm run build:v8 && npm run build:fallbacks && npm run build:figma",
+    "build": "npm run build:v8 && npm run build:fallbacks && npm run build:figma && npm run build:config",
     "build:next": "echo '\\033[31m 🛑 Use npm run build instead of npm run build:next\\033[0m'",
     "build:v8": "tsx ./scripts/buildTokens.ts",
     "build:fallbacks": "tsx ./scripts/buildFallbacks.ts",
     "build:figma": "tsx scripts/buildFigma.ts",
+    "build:config": "tsc -p buildConfig.tsconfig.jsonc",
     "tokenJson:check": "tsx scripts/diffThemes.ts && tsx scripts/diffTokenProps.ts",
     "contrast:check": "tsx scripts/color-contrast.ts",
     "format": "prettier --write  '**/*.{js,jsx,ts,tsx,md,mdx,css}'",

package/src/PrimerStyleDictionary.ts

@@ -1,232 +0,0 @@
-import StyleDictionary from 'style-dictionary'
-import {w3cJsonParser} from './parsers'
-import {
-  borderToCss,
-  colorToHexAlpha,
-  colorToRgbAlpha,
-  colorToHex,
-  colorToHexMix,
-  colorToRgbaFloat,
-  dimensionToRem,
-  dimensionToPixelUnitless,
-  durationToCss,
-  figmaAttributes,
-  fontFamilyToCss,
-  fontFamilyToFigma,
-  fontWeightToNumber,
-  jsonDeprecated,
-  namePathToDotNotation,
-  namePathToCamelCase,
-  namePathToKebabCase,
-  namePathToSlashNotation,
-  namePathToFigma,
-  shadowToCss,
-  typographyToCss,
-  dimensionToRemPxArray,
-  floatToPixel,
-  floatToPixelUnitless,
-} from './transformers'
-import {
-  javascriptCommonJs,
-  javascriptEsm,
-  typescriptExportDefinition,
-  jsonNestedPrefixed,
-  cssCustomMedia,
-  jsonOneDimensional,
-  jsonPostCssFallback,
-  cssAdvanced,
-  jsonFigma,
-} from './formats'
-
-/**
- * Parsers
- *
- */
-StyleDictionary.registerParser(w3cJsonParser)
-
-/**
- * Formats
- *
- */
-StyleDictionary.registerFormat({
-  name: 'css/advanced',
-  formatter: cssAdvanced,
-})
-
-StyleDictionary.registerFormat({
-  name: 'css/customMedia',
-  formatter: cssCustomMedia,
-})
-
-StyleDictionary.registerFormat({
-  name: 'javascript/esm',
-  formatter: javascriptEsm,
-})
-
-StyleDictionary.registerFormat({
-  name: 'javascript/commonJs',
-  formatter: javascriptCommonJs,
-})
-
-StyleDictionary.registerFormat({
-  name: 'typescript/export-definition',
-  formatter: typescriptExportDefinition,
-})
-
-StyleDictionary.registerFormat({
-  name: 'json/nested-prefixed',
-  formatter: jsonNestedPrefixed,
-})
-
-StyleDictionary.registerFormat({
-  name: 'json/one-dimensional',
-  formatter: jsonOneDimensional,
-})
-
-StyleDictionary.registerFormat({
-  name: 'json/postCss-fallback',
-  formatter: jsonPostCssFallback,
-})
-
-StyleDictionary.registerFormat({
-  name: 'json/figma',
-  formatter: jsonFigma,
-})
-
-/**
- * Transformers
- *
- */
-StyleDictionary.registerTransform({
-  name: 'color/rgbAlpha',
-  ...colorToRgbAlpha,
-})
-
-StyleDictionary.registerTransform({
-  name: 'color/rgbaFloat',
-  ...colorToRgbaFloat,
-})
-
-StyleDictionary.registerTransform({
-  name: 'color/hexAlpha',
-  ...colorToHexAlpha,
-})
-
-StyleDictionary.registerTransform({
-  name: 'color/hexMix',
-  ...colorToHexMix,
-})
-
-StyleDictionary.registerTransform({
-  name: 'color/hex',
-  ...colorToHex,
-})
-
-StyleDictionary.registerTransform({
-  name: 'float/pixel',
-  ...floatToPixel,
-})
-
-StyleDictionary.registerTransform({
-  name: 'float/pixelUnitless',
-  ...floatToPixelUnitless,
-})
-
-StyleDictionary.registerTransform({
-  name: 'dimension/rem',
-  ...dimensionToRem,
-})
-
-StyleDictionary.registerTransform({
-  name: 'dimension/remPxArray',
-  ...dimensionToRemPxArray,
-})
-
-StyleDictionary.registerTransform({
-  name: 'dimension/pixelUnitless',
-  ...dimensionToPixelUnitless,
-})
-
-StyleDictionary.registerTransform({
-  name: 'duration/css',
-  ...durationToCss,
-})
-
-StyleDictionary.registerTransform({
-  name: 'figma/attributes',
-  ...figmaAttributes,
-})
-
-StyleDictionary.registerTransform({
-  name: 'json/deprecated',
-  ...jsonDeprecated,
-})
-
-StyleDictionary.registerTransform({
-  name: 'name/pathToCamelCase',
-  ...namePathToCamelCase,
-})
-
-StyleDictionary.registerTransform({
-  name: 'name/pathToDotNotation',
-  ...namePathToDotNotation,
-})
-
-StyleDictionary.registerTransform({
-  name: 'name/pathToFigma',
-  ...namePathToFigma,
-})
-
-StyleDictionary.registerTransform({
-  name: 'name/pathToCamelCase',
-  ...namePathToCamelCase,
-})
-
-StyleDictionary.registerTransform({
-  name: 'name/pathToKebabCase',
-  ...namePathToKebabCase,
-})
-
-StyleDictionary.registerTransform({
-  name: 'name/pathToSlashNotation',
-  ...namePathToSlashNotation,
-})
-
-StyleDictionary.registerTransform({
-  name: 'shadow/css',
-  ...shadowToCss,
-})
-
-StyleDictionary.registerTransform({
-  name: 'border/css',
-  ...borderToCss,
-})
-
-StyleDictionary.registerTransform({
-  name: 'typography/css',
-  ...typographyToCss,
-})
-
-StyleDictionary.registerTransform({
-  name: 'fontWeight/number',
-  ...fontWeightToNumber,
-})
-
-StyleDictionary.registerTransform({
-  name: 'fontFamily/css',
-  ...fontFamilyToCss,
-})
-
-StyleDictionary.registerTransform({
-  name: 'fontFamily/figma',
-  ...fontFamilyToFigma,
-})
-
-/**
- * @name {@link PrimerStyleDictionary}
- * @description Returns style dictionary object with primer preset that includes parsers, formats and transformers
- * @parsers [w3cJsonParser](https://github.com/primer/primitives/blob/main/config//parsers/w3c-json-parser.ts)
- * @formats [javascript/esm](https://github.com/primer/primitives/blob/main/config/formats/javascript-esm.ts), [javascript/commonJs](https://github.com/primer/primitives/blob/main/config/formats/javascript-commonJs.ts), [typescript/export-definition](https://github.com/primer/primitives/blob/main/config/formats/typescript-export-defition.ts)
- * @transformers [color/rgbAlpha](https://github.com/primer/primitives/blob/main/config/tranformers/color-to-rgb-alpha.ts), [color/hexAlpha](https://github.com/primer/primitives/blob/main/config/tranformers/color-to-hex-alpha.ts), [color/hex](https://github.com/primer/primitives/blob/main/config/tranformers/color-to-hex6.ts), [json/deprecated](https://github.com/primer/primitives/blob/main/config/tranformers/json-deprecated.ts), [name/pathToDotNotation](https://github.com/primer/primitives/blob/main/config/tranformers/name-path-to-dot-notation.ts)
- */
-export const PrimerStyleDictionary: StyleDictionary.Core = StyleDictionary

package/src/filters/index.ts

@@ -1,13 +0,0 @@
-export {isBorder} from './isBorder'
-export {isColor} from './isColor'
-export {isColorWithAlpha} from './isColorWithAlpha'
-export {isColorWithMix} from './isColorWithMix'
-export {isDimension} from './isDimension'
-export {isDeprecated} from './isDeprecated'
-export {isFromFile} from './isFromFile'
-export {isFontFamily} from './isFontFamily'
-export {isFontWeight} from './isFontWeight'
-export {isNumber} from './isNumber'
-export {isShadow} from './isShadow'
-export {isSource} from './isSource'
-export {isTypography} from './isTypography'

package/src/filters/isColorWithAlpha.ts

@@ -1,11 +0,0 @@
-import type StyleDictionary from 'style-dictionary'
-import {isColor} from './isColor'
-
-/**
- * @description Checks if token is color with an alpha value
- * @param arguments [StyleDictionary.TransformedToken](https://github.com/amzn/style-dictionary/blob/main/types/TransformedToken.d.ts)
- * @returns boolean
- */
-export const isColorWithAlpha = (token: StyleDictionary.TransformedToken): boolean => {
-  return isColor(token) && token.alpha !== undefined && typeof token.alpha === 'number'
-}

package/src/filters/isColorWithMix.ts

@@ -1,33 +0,0 @@
-import type StyleDictionary from 'style-dictionary'
-import {isColor} from './isColor'
-
-const throwError = (token: StyleDictionary.TransformedToken) => {
-  throw new Error(
-    `Invalid mix property on token: ${token.name}. "mix.color": ${token.mix.color}, "mix.weight": ${
-      typeof token.mix.weight === 'string' ? `"${token.mix.weight}" (string)` : token.mix.weight
-    } must be a number between 0 and 1. In file: "${token.filePath}".`,
-  )
-}
-
-/**
- * @description Checks if token is color and has a mix property
- * @param arguments [StyleDictionary.TransformedToken](https://github.com/amzn/style-dictionary/blob/main/types/TransformedToken.d.ts)
- * @returns boolean
- */
-export const isColorWithMix = (token: StyleDictionary.TransformedToken): boolean => {
-  // no color or no mix property
-  if (!isColor(token) || token.mix === undefined || token.mix === null) {
-    return false
-  }
-  // invalid mix property
-  if (
-    typeof token.mix.color !== 'string' ||
-    typeof token.mix.weight !== 'number' ||
-    token.mix.weight < 0 ||
-    token.mix.weight > 1
-  ) {
-    throwError(token)
-  }
-  // valid mix property
-  return true
-}

package/src/filters/isFromFile.ts

@@ -1,12 +0,0 @@
-import type StyleDictionary from 'style-dictionary'
-
-/**
- * @description Checks if token comes from a specific file
- * @param token [StyleDictionary.TransformedToken](https://github.com/amzn/style-dictionary/blob/main/types/TransformedToken.d.ts)
- * @param files - array of file paths
- * @returns boolean
- */
-export const isFromFile = (token: StyleDictionary.TransformedToken, files: string[]): boolean => {
-  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-  return files?.includes(token.filePath) === true
-}