@pisodev/ui-common 0.0.2 → 0.0.5

package/README.md

@@ -0,0 +1,155 @@
+# @pisodev/ui-common
+
+Shared types, theme, and typography system for cross-platform UI components.
+
+## Installation
+
+```bash
+npm install @pisodev/ui-common
+```
+
+> **Note**: This package is automatically installed as a dependency when you install `@pisodev/ui-web` or `@pisodev/ui-native`.
+
+## Features
+
+- **Theme System**: Light and dark color themes
+- **Typography Presets**: Consistent typography across platforms
+- **Type Definitions**: Shared TypeScript types
+- **Color Scales**: Comprehensive color palette with alpha variants
+- **Figma Integration**: Auto-generated from Figma design tokens
+
+## Usage
+
+### Colors
+
+```typescript
+import { lightColors, darkColors } from '@pisodev/ui-common';
+
+// Access color scales
+const primaryColor = lightColors.colors.blue1['9'];
+const grayScale = darkColors.colors.gray['5'];
+
+// Available color scales:
+// - gray, grayAlpha, graySemantic
+// - whiteAlpha
+// - blue1, blue1Alpha
+// - blue2, blue2Alpha
+// - green, greenAlpha
+// - purple, purpleAlpha
+// - yellow, yellowAlpha
+// - red, redAlpha
+```
+
+### Typography
+
+```typescript
+import { typographyPresets } from '@pisodev/ui-common';
+
+// Access typography presets
+const heading = typographyPresets.heading1;
+// {
+//   fontFamily: string;
+//   fontSize: number;
+//   fontWeight: number;
+//   fontStyle: string;
+//   lineHeight: number;
+//   letterSpacing: number;
+// }
+```
+
+### Types
+
+```typescript
+import type { Theme, TypographyPreset } from '@pisodev/ui-common';
+
+const customTheme: Theme = {
+  colors: {
+    // ... your color definitions
+  }
+};
+```
+
+## Color System
+
+The color system provides:
+- **12-step scales**: From lightest to darkest
+- **Light & Dark modes**: Full theme support
+- **Alpha variants**: For transparency effects
+- **Semantic colors**: Pre-defined semantic meanings
+
+### Available Color Scales
+
+**Scale Tokens** - Base color scales with light/dark mode variants
+```typescript
+grayScale, blue1Scale, blue2Scale, greenScale, purpleScale, yellowScale, redScale
+```
+
+**Alpha Tokens** - Transparent color variants
+```typescript
+grayAlpha, blue1Alpha, blue2Alpha, greenAlpha, purpleAlpha, yellowAlpha, redAlpha, whiteAlpha
+```
+
+**Semantic Tokens** - Purpose-based colors
+```typescript
+graySemantic, semanticPaper, semanticDivider, semanticOverlay, semanticBrand, semanticInformation
+```
+
+## Typography System
+
+Typography presets are generated from design tokens and include:
+- Font family
+- Font size
+- Font weight
+- Line height
+- Letter spacing
+
+## Development
+
+This package uses automated scripts to generate color and typography data from design tokens.
+
+### Build
+
+```bash
+npm run build
+```
+
+This will:
+1. Extract typography from design tokens
+2. Extract and build color scales
+3. Compile TypeScript to distributable format
+
+### Updating Colors from Figma
+
+When colors change in Figma:
+
+1. **Export** Figma tokens as JSON to `tokens/` directory
+2. **Extract** colors from tokens: `npm run build:colors`
+3. **Build** the package: `npm run build`
+
+```bash
+npm run build:colors  # Parse JSON → colors.data.ts → CSS/SCSS
+npm run build         # Full build with all steps
+```
+
+## File Structure
+
+```
+src/theme/
+├── extract-colors.ts      # Parses Figma JSON → colors.data.ts
+├── build-colors.ts        # Generates CSS/SCSS from colors.data.ts
+├── colors.data.ts         # TypeScript exports (auto-generated)
+├── colors.ts              # Theme exports
+└── colors.types.ts        # Type definitions
+
+src/typography/
+├── extract-typography.ts  # Extracts typography from tokens
+├── typography.data.ts     # Typography presets (auto-generated)
+└── typography.ts          # Typography exports
+
+tokens/
+└── *.json                # Figma design token JSON files
+```
+
+## License
+
+MIT © Piso

package/dist/index.d.ts

@@ -1,3 +1,4 @@
 export * from './theme';
 export * from './types/Typography.base.types';
+export * from './typography/typography';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,+BAA+B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,+BAA+B,CAAC;AAC9C,cAAc,yBAAyB,CAAC"}

package/dist/index.esm.js

@@ -2,4 +2,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./theme"), exports);
 tslib_1.__exportStar(require("./types/Typography.base.types"), exports);
+tslib_1.__exportStar(require("./typography/typography"), exports);
 //# sourceMappingURL=index.esm.js.map

package/dist/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../src/index.ts"],"sourcesContent":["export * from './theme';\nexport * from './types/Typography.base.types';\n"],"names":[],"mappings":";;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA,CAAA;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,+BAAA,CAAA,EAAA,OAAA,CAAA"}
+{"version":3,"file":"index.esm.js","sources":["../src/index.ts"],"sourcesContent":["export * from './theme';\nexport * from './types/Typography.base.types';\nexport * from './typography/typography';\n"],"names":[],"mappings":";;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA,CAAA;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,+BAAA,CAAA,EAAA,OAAA,CAAA;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,yBAAA,CAAA,EAAA,OAAA,CAAA"}

package/dist/index.js

@@ -4,4 +4,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./theme"), exports);
 tslib_1.__exportStar(require("./types/Typography.base.types"), exports);
+tslib_1.__exportStar(require("./typography/typography"), exports);
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["export * from './theme';\nexport * from './types/Typography.base.types';\n"],"names":[],"mappings":";;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA,CAAA;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,+BAAA,CAAA,EAAA,OAAA,CAAA;;"}
+{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["export * from './theme';\nexport * from './types/Typography.base.types';\nexport * from './typography/typography';\n"],"names":[],"mappings":";;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA,CAAA;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,+BAAA,CAAA,EAAA,OAAA,CAAA;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,yBAAA,CAAA,EAAA,OAAA,CAAA;;"}

package/dist/theme/colors.data.d.ts

@@ -366,12 +366,12 @@ export declare const semanticDivider: {
 };
 export declare const semanticOverlay: {
     readonly light: {
-        readonly 'overlay-dim': "";
-        readonly 'overlay-low': "";
+        readonly 'overlay-dim': "var(--static-black-alpha-500)";
+        readonly 'overlay-low': "var(--static-black-alpha-200)";
     };
     readonly dark: {
-        readonly 'overlay-dim': "";
-        readonly 'overlay-low': "";
+        readonly 'overlay-dim': "var(--static-black-alpha-500)";
+        readonly 'overlay-low': "var(--static-black-alpha-200)";
     };
 };
 export declare const semanticBrand: {
@@ -396,6 +396,7 @@ export declare const semanticBrand: {
         readonly 'space-primary-pressed': "var(--purple-600)";
         readonly 'trugi-primary': "var(--blue2-400)";
         readonly 'trugi-primary-hover': "var(--blue2-600)";
+        readonly 'trugi-primary-legacy': "#2848FEFF";
         readonly 'trugi-primary-low': "var(--blue2-alpha-50)";
         readonly 'trugi-primary-low-hover': "var(--blue2-alpha-100)";
         readonly 'trugi-primary-low-pressed': "var(--blue2-alpha-100)";
@@ -422,6 +423,7 @@ export declare const semanticBrand: {
         readonly 'space-primary-pressed': "var(--purple-600)";
         readonly 'trugi-primary': "var(--blue2-400)";
         readonly 'trugi-primary-hover': "var(--blue2-600)";
+        readonly 'trugi-primary-legacy': "#2848FEFF";
         readonly 'trugi-primary-low': "var(--blue2-alpha-50)";
         readonly 'trugi-primary-low-hover': "var(--blue2-alpha-100)";
         readonly 'trugi-primary-low-pressed': "var(--blue2-alpha-100)";
@@ -510,9 +512,9 @@ export declare const staticColor: {
         readonly 'purple-700': "#A8B8FFFF";
         readonly 'red-400': "#FF4848FF";
         readonly 'red-700': "#FFA7A7FF";
-        readonly 'trugi-blue-200': "#D9E8F9FF";
-        readonly 'trugi-blue-300': "#C0DAF8FF";
-        readonly 'trugi-blue-700': "#132DBBFF";
+        readonly 'trugi-blue-200-legacy': "#D9E8F9FF";
+        readonly 'trugi-blue-300-legacy': "#C0DAF8FF";
+        readonly 'trugi-blue-700-legacy': "#132DBBFF";
         readonly 'trugi-blue-alpha': "#2848FE24";
         readonly 'trugi-green': "#4EE28CFF";
         readonly 'trugi-orange': "#FF8A4BFF";
@@ -540,9 +542,9 @@ export declare const staticColor: {
         readonly 'purple-700': "#A8B8FFFF";
         readonly 'red-400': "#FF4848FF";
         readonly 'red-700': "#FFA7A7FF";
-        readonly 'trugi-blue-200': "#D9E8F9FF";
-        readonly 'trugi-blue-300': "#C0DAF8FF";
-        readonly 'trugi-blue-700': "#132DBBFF";
+        readonly 'trugi-blue-200-legacy': "#D9E8F9FF";
+        readonly 'trugi-blue-300-legacy': "#C0DAF8FF";
+        readonly 'trugi-blue-700-legacy': "#132DBBFF";
         readonly 'trugi-blue-alpha': "#2848FE24";
         readonly 'trugi-green': "#4EE28CFF";
         readonly 'trugi-orange': "#FF8A4BFF";

package/dist/theme/colors.data.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"colors.data.d.ts","sourceRoot":"","sources":["../../src/theme/colors.data.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BZ,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Bb,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Bb,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Bb,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Bd,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Bd,CAAC;AAEX,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BX,CAAC;AAEX,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;CAeZ,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;CAeb,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;CAeb,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;CAeb,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;CAed,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;CAed,CAAC;AAEX,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;CAeX,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;CAeb,CAAC;AAEX,eAAO,MAAM,YAAY;;;;;;;;;;;CAWf,CAAC;AAEX,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;CAehB,CAAC;AAEX,eAAO,MAAM,eAAe;;;;;;;;;;;;;CAalB,CAAC;AAEX,eAAO,MAAM,eAAe;;;;;;;;;CASlB,CAAC;AAEX,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqDhB,CAAC;AAEX,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;CAqBtB,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;CAmBd,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;CAmBd,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6Dd,CAAC"}
+{"version":3,"file":"colors.data.d.ts","sourceRoot":"","sources":["../../src/theme/colors.data.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BZ,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Bb,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Bb,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Bb,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Bd,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Bd,CAAC;AAEX,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BX,CAAC;AAEX,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;CAeZ,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;CAeb,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;CAeb,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;CAeb,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;CAed,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;CAed,CAAC;AAEX,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;CAeX,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;CAeb,CAAC;AAEX,eAAO,MAAM,YAAY;;;;;;;;;;;CAWf,CAAC;AAEX,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;CAehB,CAAC;AAEX,eAAO,MAAM,eAAe;;;;;;;;;;;;;CAalB,CAAC;AAEX,eAAO,MAAM,eAAe;;;;;;;;;CASlB,CAAC;AAEX,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuDhB,CAAC;AAEX,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;CAqBtB,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;CAmBd,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;CAmBd,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6Dd,CAAC"}

package/dist/typography/extract-typography.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=extract-typography.d.ts.map

package/dist/typography/extract-typography.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"extract-typography.d.ts","sourceRoot":"","sources":["../../src/typography/extract-typography.ts"],"names":[],"mappings":""}

package/dist/typography/typography.d.ts

@@ -0,0 +1,11 @@
+export { typographyPresets } from './typography.data';
+export type TypographyPresetName = keyof typeof import('./typography.data').typographyPresets;
+export type TypographyPreset = {
+    fontFamily: string;
+    fontSize: number;
+    fontWeight: number;
+    fontStyle: string;
+    lineHeight: number;
+    letterSpacing: number;
+};
+//# sourceMappingURL=typography.d.ts.map

package/dist/typography/typography.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../../src/typography/typography.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAGtD,MAAM,MAAM,oBAAoB,GAAG,MAAM,cAAc,mBAAmB,EAAE,iBAAiB,CAAC;AAE9F,MAAM,MAAM,gBAAgB,GAAG;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;CACvB,CAAC"}

package/dist/typography/typography.data.d.ts

@@ -0,0 +1,491 @@
+export declare const typographyPresets: {
+    readonly h1: {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 72;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 82.8;
+        readonly letterSpacing: 0;
+    };
+    readonly amount: {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 60;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 69;
+        readonly letterSpacing: 0;
+    };
+    readonly h2: {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 60;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 69;
+        readonly letterSpacing: 0;
+    };
+    readonly h3: {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 54;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 62.1;
+        readonly letterSpacing: 0;
+    };
+    readonly h4: {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 48;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 55.2;
+        readonly letterSpacing: 0;
+    };
+    readonly h5: {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 42;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 48.3;
+        readonly letterSpacing: 0;
+    };
+    readonly 'title1-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 32;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 48;
+        readonly letterSpacing: 0;
+    };
+    readonly 'title1-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 32;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 48;
+        readonly letterSpacing: 0;
+    };
+    readonly 'title2-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 26;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 39;
+        readonly letterSpacing: 0;
+    };
+    readonly 'title2-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 26;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 39;
+        readonly letterSpacing: 0;
+    };
+    readonly 'title3-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 24;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 36;
+        readonly letterSpacing: 0;
+    };
+    readonly 'title3-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 24;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 36;
+        readonly letterSpacing: 0;
+    };
+    readonly 'title4-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 20;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 30;
+        readonly letterSpacing: 0;
+    };
+    readonly 'title4-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 20;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 30;
+        readonly letterSpacing: 0;
+    };
+    readonly 'title5-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 19;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 28.5;
+        readonly letterSpacing: -0.19;
+    };
+    readonly 'title5-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 19;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 28.5;
+        readonly letterSpacing: -0.19;
+    };
+    readonly 'subtitle1-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 18;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 27;
+        readonly letterSpacing: -0.18;
+    };
+    readonly 'subtitle1-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 18;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 27;
+        readonly letterSpacing: -0.18;
+    };
+    readonly 'subtitle2-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 17;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 25.5;
+        readonly letterSpacing: -0.17;
+    };
+    readonly 'subtitle2-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 17;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 25.5;
+        readonly letterSpacing: -0.17;
+    };
+    readonly 'body1-l1-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 18;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 32.4;
+        readonly letterSpacing: -0.18;
+    };
+    readonly 'body1-l1-medium': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 18;
+        readonly fontWeight: 500;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 32.4;
+        readonly letterSpacing: -0.18;
+    };
+    readonly 'body1-l1-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 18;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 32.4;
+        readonly letterSpacing: -0.18;
+    };
+    readonly 'body1-l2-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 18;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 27;
+        readonly letterSpacing: -0.18;
+    };
+    readonly 'body1-l2-medium': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 18;
+        readonly fontWeight: 500;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 27;
+        readonly letterSpacing: -0.18;
+    };
+    readonly 'body1-l2-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 18;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 27;
+        readonly letterSpacing: -0.18;
+    };
+    readonly 'body2-l1-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 17;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 30.6;
+        readonly letterSpacing: -0.17;
+    };
+    readonly 'body2-l1-medium': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 17;
+        readonly fontWeight: 500;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 30.6;
+        readonly letterSpacing: -0.17;
+    };
+    readonly 'body2-l1-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 17;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 25.5;
+        readonly letterSpacing: -0.17;
+    };
+    readonly 'body2-l2-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 17;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 25.5;
+        readonly letterSpacing: -0.17;
+    };
+    readonly 'body2-l2-medium': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 17;
+        readonly fontWeight: 500;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 25.5;
+        readonly letterSpacing: -0.17;
+    };
+    readonly 'body3-l1-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 16;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 28.8;
+        readonly letterSpacing: -0.16;
+    };
+    readonly 'body3-l1-medium': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 16;
+        readonly fontWeight: 500;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 28.8;
+        readonly letterSpacing: -0.16;
+    };
+    readonly 'body3-l1-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 16;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 28.8;
+        readonly letterSpacing: -0.16;
+    };
+    readonly 'body3-l2-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 16;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 24;
+        readonly letterSpacing: -0.16;
+    };
+    readonly 'body3-l2-medium': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 16;
+        readonly fontWeight: 500;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 24;
+        readonly letterSpacing: -0.16;
+    };
+    readonly 'body3-l2-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 16;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 24;
+        readonly letterSpacing: -0.16;
+    };
+    readonly 'body4-l1-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 15;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 27;
+        readonly letterSpacing: -0.15;
+    };
+    readonly 'body4-l1-medium': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 15;
+        readonly fontWeight: 500;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 27;
+        readonly letterSpacing: -0.15;
+    };
+    readonly 'body4-l1-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 15;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 27;
+        readonly letterSpacing: -0.15;
+    };
+    readonly 'body4-l2-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 15;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 22.5;
+        readonly letterSpacing: -0.15;
+    };
+    readonly 'body4-l2-medium': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 15;
+        readonly fontWeight: 500;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 22.5;
+        readonly letterSpacing: -0.15;
+    };
+    readonly 'body4-l2-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 15;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 22.5;
+        readonly letterSpacing: -0.15;
+    };
+    readonly 'label1-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 18;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 27;
+        readonly letterSpacing: -0.18;
+    };
+    readonly 'label1-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 18;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 27;
+        readonly letterSpacing: -0.18;
+    };
+    readonly 'label2-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 17;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 25.5;
+        readonly letterSpacing: -0.17;
+    };
+    readonly 'label2-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 17;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 25.5;
+        readonly letterSpacing: -0.17;
+    };
+    readonly 'label3-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 16;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 24;
+        readonly letterSpacing: -0.16;
+    };
+    readonly 'label3-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 16;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 24;
+        readonly letterSpacing: -0.16;
+    };
+    readonly 'label4-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 15;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 22.5;
+        readonly letterSpacing: -0.15;
+    };
+    readonly 'label4-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 15;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 22.5;
+        readonly letterSpacing: -0.15;
+    };
+    readonly 'label5-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 14;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 21;
+        readonly letterSpacing: -0.14;
+    };
+    readonly 'label5-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 14;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 21;
+        readonly letterSpacing: -0.14;
+    };
+    readonly 'label6-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 13;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 19.5;
+        readonly letterSpacing: -0.13;
+    };
+    readonly 'label6-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 13;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 19.5;
+        readonly letterSpacing: -0.13;
+    };
+    readonly 'caption1-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 12;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 18;
+        readonly letterSpacing: -0.12;
+    };
+    readonly 'caption1-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 12;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 18;
+        readonly letterSpacing: -0.12;
+    };
+    readonly 'caption2-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 11;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 16.5;
+        readonly letterSpacing: -0.11;
+    };
+    readonly 'caption2-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 11;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 16.5;
+        readonly letterSpacing: -0.11;
+    };
+    readonly 'caption3-bold': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 10;
+        readonly fontWeight: 600;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 15;
+        readonly letterSpacing: -0.1;
+    };
+    readonly 'caption3-regular': {
+        readonly fontFamily: "Inter";
+        readonly fontSize: 10;
+        readonly fontWeight: 400;
+        readonly fontStyle: "normal";
+        readonly lineHeight: 14;
+        readonly letterSpacing: -0.1;
+    };
+};
+//# sourceMappingURL=typography.data.d.ts.map

package/dist/typography/typography.data.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.data.d.ts","sourceRoot":"","sources":["../../src/typography/typography.data.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyepB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisodev/ui-common",
-  "version": "0.0.2",
+  "version": "0.0.5",
   "description": "웹과 React Native를 위한 공통 타입 및 테마",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",
@@ -10,9 +10,9 @@
     "dist"
   ],
   "scripts": {
-    "build:extract-colors": "ts-node src/theme/extract-colors.ts",
-    "build:colors": "ts-node src/theme/build-colors.ts",
-    "build": "npm run build:extract-colors && npm run  build:colors && rollup -c rollup.config.js"
+    "build:typography": "ts-node src/typography/extract-typography.ts",
+    "build:colors": "ts-node src/theme/extract-colors.ts && ts-node src/theme/build-colors.ts",
+    "build": "npm run build:typography && npm run  build:colors && rollup -c rollup.config.mjs"
   },
   "keywords": [
     "react",
@@ -20,8 +20,17 @@
     "theme",
     "typescript"
   ],
-  "author": "",
+  "author": "Piso",
   "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/PisoDev77/ui-library.git",
+    "directory": "packages/common"
+  },
+  "bugs": {
+    "url": "https://github.com/PisoDev77/ui-library/issues"
+  },
+  "homepage": "https://github.com/PisoDev77/ui-library/tree/master/packages/common#readme",
   "publishConfig": {
     "access": "public"
   },
@@ -33,6 +42,7 @@
     "rollup": "^4.54.0",
     "ts-node": "^10.9.2",
     "tslib": "^2.8.1",
+    "tsx": "^4.21.0",
     "typescript": "^5.9.3"
   }
 }