chore: align index.js entrypoint exports

README.md

@@ -18,8 +18,6 @@
 - [Transforms](#transforms)
 - [Troubleshooting](#not-sure-how-to-fix-your-issue)
 
-> This library is currently in beta.
-
 This package contains custom transforms for [Style-Dictionary](https://amzn.github.io/style-dictionary/#/),
 to work with Design Tokens that are exported from [Tokens Studio](https://tokens.studio/):
 
@@ -141,28 +139,30 @@ This allows fontStyles to be extracted when they are embedded in fontWeights, al
 > This made sense due to object-value tokens being part of the DTCG spec and no longer a Tokens Studio specific feature.
 
 When using the [expand feature of Style Dictionary](https://v4.styledictionary.com/reference/config/#expand) to expand object-value (composite) tokens,
-you should pass an additional `typesMap` for `boxShadow` tokens, because these are slightly different from the DTCG shadow tokens in that they are called `boxShadow`
-and that their `offsetX` and `offsetY` props are called `x` and `y` respectively.
+you should pass our additional `expandTypesMap` for Tokens Studio tokens, because these are slightly different from the DTCG tokens:
+
+- shadow tokens are called `boxShadow` and their `offsetX` and `offsetY` props are called `x` and `y` respectively.
+- typography tokens have some additional properties in Tokens Studio:
+  - `paragraphSpacing` -> dimension
+  - `paragraphIndent` -> dimension
+  - `textDecoration` -> other
+  - `textCase` -> other
 
 Due to the Style Dictionary object-value tokens expansion happening before custom preprocessors such as the sd-transforms preprocessor,
 which aligns Tokens Studio token types with DTCG token types, this has to be configured like so:
 
-```json
-{
-  "source": ["tokens/**/*.json"],
-  "preprocessors": ["tokens-studio"],
-  "expand": {
-    "typesMap": {
-      "boxShadow": {
-        "x": "dimension",
-        "y": "dimension",
-        "blur": "dimension",
-        "spread": "dimension"
-      }
-    }
+```js
+import StyleDictionary from 'style-dictionary';
+import { expandTypesMap } from '@tokens-studio/sd-transforms';
+
+const sd = new StyleDictionary({
+  source: ['tokens/**/*.json'],
+  preprocessors: ['tokens-studio'],
+  expand: {
+    typesMap: expandTypesMap,
   },
-  "platforms": {}
-}
+  platforms: {},
+});
 ```
 
 ### Using the transforms
@@ -183,13 +183,13 @@ which aligns Tokens Studio token types with DTCG token types, this has to be con
         }
       ]
     },
-    "css": {
+    "scss": {
       "transforms": ["ts/size/px", "ts/opacity", "name/kebab"],
-      "buildPath": "build/css/",
+      "buildPath": "build/scss/",
       "files": [
         {
-          "destination": "variables.css",
-          "format": "css/variables"
+          "destination": "variables.scss",
+          "format": "scss/variables"
         }
       ]
     }

src/TransformOptions.ts

@@ -1,29 +1,3 @@
-import {
-  SingleBorderToken,
-  SingleBoxShadowToken,
-  SingleCompositionToken,
-  SingleToken,
-  SingleTypographyToken,
-} from '@tokens-studio/types';
-
-export type Expandables =
-  | SingleCompositionToken
-  | SingleTypographyToken
-  | SingleBorderToken
-  | SingleBoxShadowToken;
-
-export const expandablesAsStringsArr = ['composition', 'typography', 'border', 'boxShadow'];
-export type ExpandablesAsStrings = (typeof expandablesAsStringsArr)[number];
-
-export type ExpandFilter<T extends SingleToken> = (token: T, filePath?: string) => boolean;
-
-export interface ExpandOptions {
-  typography?: boolean | ExpandFilter<SingleTypographyToken>; // default false
-  border?: boolean | ExpandFilter<SingleBorderToken>; // default false
-  shadow?: boolean | ExpandFilter<SingleBoxShadowToken>; // default false
-  composition?: boolean | ExpandFilter<SingleCompositionToken>; // default true
-}
-
 export type ColorModifierFormat = 'hex' | 'hsl' | 'lch' | 'p3' | 'srgb';
 
 export interface ColorModifierOptions {

src/index.ts

@@ -1,8 +1,7 @@
-export { registerTransforms } from './registerTransforms.js';
-export { transforms } from './registerTransforms.js';
+export { registerTransforms, transforms } from './registerTransforms.js';
 
 export { addFontStyles } from './preprocessors/add-font-styles.js';
-export { alignTypes, typesMap } from './preprocessors/align-types.js';
+export { alignTypes } from './preprocessors/align-types.js';
 export { excludeParentKeys } from './preprocessors/exclude-parent-keys.js';
 export { parseTokens } from './preprocessors/parse-tokens.js';
 
@@ -12,10 +11,35 @@ export { transformDimension } from './transformDimension.js';
 export { transformFontWeight } from './transformFontWeight.js';
 export { transformColorModifiers } from './color-modifiers/transformColorModifiers.js';
 export { transformLineHeight } from './transformLineHeight.js';
+export { transformOpacity } from './transformOpacity.js';
 
 export { transformHEXRGBaForCSS } from './css/transformHEXRGBa.js';
 export { transformLetterSpacingForCSS } from './css/transformLetterSpacing.js';
+export { transformShadow } from './css/transformShadow.js';
 
 export { transformTypographyForCompose } from './compose/transformTypography.js';
 
 export { permutateThemes } from './permutateThemes.js';
+
+/**
+ * Some of the Tokens Studio typography/shadow props need to be aligned
+ * when expanding them through StyleDictionary expand
+ */
+export const expandTypesMap = {
+  typography: {
+    paragraphSpacing: 'dimension',
+    paragraphIndent: 'dimension',
+    textDecoration: 'other',
+    textCase: 'other',
+  },
+  /**
+   * boxShadow/x/y are not shadow/offsetX/offsetY here because the SD expand on global level
+   * happens before these types are aligned in sd-transforms preprocessor
+   */
+  boxShadow: {
+    x: 'dimension',
+    y: 'dimension',
+    blur: 'dimension',
+    spread: 'dimension',
+  },
+};

src/preprocessors/align-types.ts

@@ -1,6 +1,9 @@
 import { DeepKeyTokenMap, SingleToken } from '@tokens-studio/types';
 
-export const typesMap = {
+// TODO: composition tokens props also need the same types alignments..
+// nested composition tokens are out of scope.
+
+const typesMap = {
   fontFamilies: 'fontFamily',
   fontWeights: 'fontWeight',
   fontSizes: 'fontSize',