@idds/styles 1.6.7 → 1.6.9

package/dist/tailwind/ts/bkn.js

@@ -0,0 +1,35 @@
+/**
+ * BKN Color Tokens for Tailwind CSS v3
+ * Badan Kepegawaian Negara Theme
+ */
+const bknColorTokens = {
+    // Primary shades
+    'primary-25': 'var(--ina-primary-25, #fdf2f7)',
+    'primary-50': 'var(--ina-primary-50, #fde6f1)',
+    'primary-100': 'var(--ina-primary-100, #fdcde3)',
+    'primary-200': 'var(--ina-primary-200, #fca5cb)',
+    'primary-300': 'var(--ina-primary-300, #f96da7)',
+    'primary-400': 'var(--ina-primary-400, #f24286)',
+    'primary-500': 'var(--ina-primary-500, #de1d5e)',
+    'primary-600': 'var(--ina-primary-600, #c41249)',
+    'primary-700': 'var(--ina-primary-700, #a2123c)',
+    'primary-800': 'var(--ina-primary-800, #871436)',
+    'primary-900': 'var(--ina-primary-900, #53041a)',
+    'primary-primary': 'var(--ina-primary-primary, #de1d5e)',
+    // Secondary shades
+    'secondary-25': 'var(--ina-secondary-25, #f2f9fd)',
+    'secondary-50': 'var(--ina-secondary-50, #e3f0fb)',
+    'secondary-100': 'var(--ina-secondary-100, #c1e3f6)',
+    'secondary-200': 'var(--ina-secondary-200, #8accef)',
+    'secondary-300': 'var(--ina-secondary-300, #4cb2e4)',
+    'secondary-400': 'var(--ina-secondary-400, #269dd8)',
+    'secondary-500': 'var(--ina-secondary-500, #177ab2)',
+    'secondary-600': 'var(--ina-secondary-600, #146190)',
+    'secondary-700': 'var(--ina-secondary-700, #145378)',
+    'secondary-800': 'var(--ina-secondary-800, #164564)',
+    'secondary-900': 'var(--ina-secondary-900, #0f2d42)',
+    // Interactive hover
+    'bkn-brand-hover': 'var(--ina-bkn-brand-hover, #c41249)',
+    'bkn-neutral-hover': 'var(--ina-bkn-neutral-hover, #fafafa)',
+};
+export default bknColorTokens;

package/dist/tailwind/ts/default.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Default Color Tokens for Tailwind CSS v3
+ * Default Theme
+ */
+declare const defaultColorTokens: Record<string, string>;
+export default defaultColorTokens;

package/dist/tailwind/ts/default.js

@@ -0,0 +1,32 @@
+/**
+ * Default Color Tokens for Tailwind CSS v3
+ * Default Theme
+ */
+const defaultColorTokens = {
+    // Primary shades
+    'primary-25': 'var(--ina-neutral-25, #ffffff)',
+    'primary-50': 'var(--ina-neutral-50, #f8f8f7)',
+    'primary-100': 'var(--ina-neutral-100, #f2f2f2)',
+    'primary-200': 'var(--ina-neutral-200, #e5e5e5)',
+    'primary-300': 'var(--ina-neutral-300, #d4d4d4)',
+    'primary-400': 'var(--ina-neutral-400, #a3a3a3)',
+    'primary-500': 'var(--ina-neutral-500, #737373)',
+    'primary-600': 'var(--ina-neutral-600, #525252)',
+    'primary-700': 'var(--ina-neutral-700, #404040)',
+    'primary-800': 'var(--ina-neutral-800, #1f1f1f)',
+    'primary-900': 'var(--ina-neutral-900, #141414)',
+    'primary-primary': 'var(--ina-neutral-900, #141414)',
+    // Secondary shades
+    'secondary-25': '#f2f9fd',
+    'secondary-50': '#e3f0fb',
+    'secondary-100': '#c1e3f6',
+    'secondary-200': '#8accef',
+    'secondary-300': '#4cb2e4',
+    'secondary-400': '#269dd8',
+    'secondary-500': '#177ab2',
+    'secondary-600': '#146190',
+    'secondary-700': '#145378',
+    'secondary-800': '#164564',
+    'secondary-900': '#0f2d42',
+};
+export default defaultColorTokens;

package/dist/tailwind/ts/idds.d.ts

@@ -0,0 +1,23 @@
+/**
+ * INA Digital Color Tokens for Tailwind CSS v3
+ *
+ * This file provides color tokens that reference CSS custom properties
+ * from @idds/styles. Use these tokens in your tailwind.config.js:
+ *
+ * @example
+ * ```js
+ * import iddsColorTokens from '@idds/styles/tailwind/ts/idds';
+ *
+ * export default {
+ *   theme: {
+ *     extend: {
+ *       colors: iddsColorTokens,
+ *     },
+ *   },
+ * };
+ * ```
+ *
+ * Then you can use classes like: text-neutral-500, bg-blue-500, etc.
+ */
+declare const iddsColorTokens: Record<string, string>;
+export default iddsColorTokens;

package/dist/tailwind/ts/idds.js

@@ -0,0 +1,263 @@
+/**
+ * INA Digital Color Tokens for Tailwind CSS v3
+ *
+ * This file provides color tokens that reference CSS custom properties
+ * from @idds/styles. Use these tokens in your tailwind.config.js:
+ *
+ * @example
+ * ```js
+ * import iddsColorTokens from '@idds/styles/tailwind/ts/idds';
+ *
+ * export default {
+ *   theme: {
+ *     extend: {
+ *       colors: iddsColorTokens,
+ *     },
+ *   },
+ * };
+ * ```
+ *
+ * Then you can use classes like: text-neutral-500, bg-blue-500, etc.
+ */
+const iddsColorTokens = {
+    // Neutral Colors
+    'neutral-25': 'var(--ina-neutral-25, #ffffff)',
+    'neutral-50': 'var(--ina-neutral-50, #f8f8f7)',
+    'neutral-100': 'var(--ina-neutral-100, #f2f2f2)',
+    'neutral-200': 'var(--ina-neutral-200, #e5e5e5)',
+    'neutral-300': 'var(--ina-neutral-300, #d4d4d4)',
+    'neutral-400': 'var(--ina-neutral-400, #a3a3a3)',
+    'neutral-500': 'var(--ina-neutral-500, #737373)',
+    'neutral-600': 'var(--ina-neutral-600, #525252)',
+    'neutral-700': 'var(--ina-neutral-700, #404040)',
+    'neutral-800': 'var(--ina-neutral-800, #1f1f1f)',
+    'neutral-900': 'var(--ina-neutral-900, #141414)',
+    'neutral-1000': 'var(--ina-neutral-1000, #050505)',
+    // Blue Colors
+    'blue-50': 'var(--ina-blue-50, #fafcff)',
+    'blue-100': 'var(--ina-blue-100, #ecf3fe)',
+    'blue-200': 'var(--ina-blue-200, #dceafe)',
+    'blue-300': 'var(--ina-blue-300, #84b4fb)',
+    'blue-400': 'var(--ina-blue-400, #4d93fc)',
+    'blue-500': 'var(--ina-blue-500, #0968f6)',
+    'blue-600': 'var(--ina-blue-600, #0049b8)',
+    'blue-700': 'var(--ina-blue-700, #002a69)',
+    'blue-800': 'var(--ina-blue-800, #0e192a)',
+    'blue-900': 'var(--ina-blue-900, #070e17)',
+    // Cyan Colors
+    'cyan-50': 'var(--ina-cyan-50, #fafeff)',
+    'cyan-100': 'var(--ina-cyan-100, #ebfaff)',
+    'cyan-200': 'var(--ina-cyan-200, #d2f3fe)',
+    'cyan-300': 'var(--ina-cyan-300, #83defc)',
+    'cyan-400': 'var(--ina-cyan-400, #51d0fb)',
+    'cyan-500': 'var(--ina-cyan-500, #09bbf6)',
+    'cyan-600': 'var(--ina-cyan-600, #008bb9)',
+    'cyan-700': 'var(--ina-cyan-700, #00506b)',
+    'cyan-800': 'var(--ina-cyan-800, #0a3442)',
+    'cyan-900': 'var(--ina-cyan-900, #032530)',
+    // Teal Colors
+    'teal-50': 'var(--ina-teal-50, #faffff)',
+    'teal-100': 'var(--ina-teal-100, #effbfb)',
+    'teal-200': 'var(--ina-teal-200, #d7f4f6)',
+    'teal-300': 'var(--ina-teal-300, #8edfe5)',
+    'teal-400': 'var(--ina-teal-400, #44ccd5)',
+    'teal-500': 'var(--ina-teal-500, #1bbfca)',
+    'teal-600': 'var(--ina-teal-600, #006f93)',
+    'teal-700': 'var(--ina-teal-700, #07465a)',
+    'teal-800': 'var(--ina-teal-800, #04252f)',
+    'teal-900': 'var(--ina-teal-900, #02161d)',
+    // Green Colors
+    'green-50': 'var(--ina-green-50, #fafffa)',
+    'green-100': 'var(--ina-green-100, #edfded)',
+    'green-200': 'var(--ina-green-200, #e0fae0)',
+    'green-300': 'var(--ina-green-300, #a6f0a5)',
+    'green-400': 'var(--ina-green-400, #4ce160)',
+    'green-500': 'var(--ina-green-500, #3cc14e)',
+    'green-600': 'var(--ina-green-600, #288034)',
+    'green-700': 'var(--ina-green-700, #1b561a)',
+    'green-800': 'var(--ina-green-800, #0c310d)',
+    'green-900': 'var(--ina-green-900, #021d06)',
+    // Lime Colors
+    'lime-50': 'var(--ina-lime-50, #fdfffa)',
+    'lime-100': 'var(--ina-lime-100, #f8fded)',
+    'lime-200': 'var(--ina-lime-200, #f2fcdf)',
+    'lime-300': 'var(--ina-lime-300, #ddf6aa)',
+    'lime-400': 'var(--ina-lime-400, #bbed56)',
+    'lime-500': 'var(--ina-lime-500, #90c821)',
+    'lime-600': 'var(--ina-lime-600, #5b7d17)',
+    'lime-700': 'var(--ina-lime-700, #3b5110)',
+    'lime-800': 'var(--ina-lime-800, #202d06)',
+    'lime-900': 'var(--ina-lime-900, #141d02)',
+    // Yellow Colors
+    'yellow-50': 'var(--ina-yellow-50, #fffefa)',
+    'yellow-100': 'var(--ina-yellow-100, #fff9eb)',
+    'yellow-200': 'var(--ina-yellow-200, #fff8d5)',
+    'yellow-300': 'var(--ina-yellow-300, #ffe58a)',
+    'yellow-400': 'var(--ina-yellow-400, #ffcc14)',
+    'yellow-500': 'var(--ina-yellow-500, #eebb04)',
+    'yellow-600': 'var(--ina-yellow-600, #855f00)',
+    'yellow-700': 'var(--ina-yellow-700, #553b06)',
+    'yellow-800': 'var(--ina-yellow-800, #312102)',
+    'yellow-900': 'var(--ina-yellow-900, #1c1402)',
+    // Orange Colors
+    'orange-50': 'var(--ina-orange-50, #fffcfa)',
+    'orange-100': 'var(--ina-orange-100, #fff5eb)',
+    'orange-200': 'var(--ina-orange-200, #ffead3)',
+    'orange-300': 'var(--ina-orange-300, #ffc382)',
+    'orange-400': 'var(--ina-orange-400, #ff8806)',
+    'orange-500': 'var(--ina-orange-500, #ec7303)',
+    'orange-600': 'var(--ina-orange-600, #c15100)',
+    'orange-700': 'var(--ina-orange-700, #562501)',
+    'orange-800': 'var(--ina-orange-800, #2f1604)',
+    'orange-900': 'var(--ina-orange-900, #170b02)',
+    // Coral Colors
+    'coral-50': 'var(--ina-coral-50, #fffbfa)',
+    'coral-100': 'var(--ina-coral-100, #ffefeb)',
+    'coral-200': 'var(--ina-coral-200, #ffe1d7)',
+    'coral-300': 'var(--ina-coral-300, #ffa78a)',
+    'coral-400': 'var(--ina-coral-400, #ff6a38)',
+    'coral-500': 'var(--ina-coral-500, #f3511b)',
+    'coral-600': 'var(--ina-coral-600, #d03706)',
+    'coral-700': 'var(--ina-coral-700, #5e1d08)',
+    'coral-800': 'var(--ina-coral-800, #2f0e04)',
+    'coral-900': 'var(--ina-coral-900, #1d0802)',
+    // Red Colors
+    'red-50': 'var(--ina-red-50, #fffafa)',
+    'red-100': 'var(--ina-red-100, #fdeded)',
+    'red-200': 'var(--ina-red-200, #ffe0e0)',
+    'red-300': 'var(--ina-red-300, #ffa0a0)',
+    'red-400': 'var(--ina-red-400, #ff5c5c)',
+    'red-500': 'var(--ina-red-500, #f02d2d)',
+    'red-600': 'var(--ina-red-600, #d50b0b)',
+    'red-700': 'var(--ina-red-700, #570303)',
+    'red-800': 'var(--ina-red-800, #2a0303)',
+    'red-900': 'var(--ina-red-900, #1d0202)',
+    // Pink Colors
+    'pink-50': 'var(--ina-pink-50, #fff5fa)',
+    'pink-100': 'var(--ina-pink-100, #fdedf5)',
+    'pink-200': 'var(--ina-pink-200, #fcdcec)',
+    'pink-300': 'var(--ina-pink-300, #f79cc8)',
+    'pink-400': 'var(--ina-pink-400, #f155a0)',
+    'pink-500': 'var(--ina-pink-500, #e9358b)',
+    'pink-600': 'var(--ina-pink-600, #a51359)',
+    'pink-700': 'var(--ina-pink-700, #4b112d)',
+    'pink-800': 'var(--ina-pink-800, #36061d)',
+    'pink-900': 'var(--ina-pink-900, #1d020f)',
+    // Magenta Colors
+    'magenta-50': 'var(--ina-magenta-50, #fefaff)',
+    'magenta-100': 'var(--ina-magenta-100, #fbebff)',
+    'magenta-200': 'var(--ina-magenta-200, #f5d2fe)',
+    'magenta-300': 'var(--ina-magenta-300, #e483fc)',
+    'magenta-400': 'var(--ina-magenta-400, #d951fb)',
+    'magenta-500': 'var(--ina-magenta-500, #c709f6)',
+    'magenta-600': 'var(--ina-magenta-600, #9400b9)',
+    'magenta-700': 'var(--ina-magenta-700, #56006b)',
+    'magenta-800': 'var(--ina-magenta-800, #370a42)',
+    'magenta-900': 'var(--ina-magenta-900, #270330)',
+    // Violet Colors
+    'violet-50': 'var(--ina-violet-50, #fbfaff)',
+    'violet-100': 'var(--ina-violet-100, #f7f6fe)',
+    'violet-200': 'var(--ina-violet-200, #e2ddfd)',
+    'violet-300': 'var(--ina-violet-300, #ad9efa)',
+    'violet-400': 'var(--ina-violet-400, #8770ff)',
+    'violet-500': 'var(--ina-violet-500, #583aee)',
+    'violet-600': 'var(--ina-violet-600, #3b1fc6)',
+    'violet-700': 'var(--ina-violet-700, #271a68)',
+    'violet-800': 'var(--ina-violet-800, #140f2e)',
+    'violet-900': 'var(--ina-violet-900, #06021d)',
+    // Purple Colors
+    'purple-50': 'var(--ina-purple-50, #fdfaff)',
+    'purple-100': 'var(--ina-purple-100, #f7ebff)',
+    'purple-200': 'var(--ina-purple-200, #ecd2fe)',
+    'purple-300': 'var(--ina-purple-300, #cc83fc)',
+    'purple-400': 'var(--ina-purple-400, #b751fb)',
+    'purple-500': 'var(--ina-purple-500, #9709f6)',
+    'purple-600': 'var(--ina-purple-600, #6f00b9)',
+    'purple-700': 'var(--ina-purple-700, #40006b)',
+    'purple-800': 'var(--ina-purple-800, #2c0a42)',
+    'purple-900': 'var(--ina-purple-900, #1e0330)',
+    // Lilac Colors
+    'lilac-50': 'var(--ina-lilac-50, #fdfaff)',
+    'lilac-100': 'var(--ina-lilac-100, #faf5fe)',
+    'lilac-200': 'var(--ina-lilac-200, #efddfd)',
+    'lilac-300': 'var(--ina-lilac-300, #cc9ef0)',
+    'lilac-400': 'var(--ina-lilac-400, #b56bf0)',
+    'lilac-500': 'var(--ina-lilac-500, #8935cb)',
+    'lilac-600': 'var(--ina-lilac-600, #631f99)',
+    'lilac-700': 'var(--ina-lilac-700, #3e135f)',
+    'lilac-800': 'var(--ina-lilac-800, #1c042f)',
+    'lilac-900': 'var(--ina-lilac-900, #11021d)',
+    // Indigo Colors
+    'indigo-50': 'var(--ina-indigo-50, #fafdff)',
+    'indigo-100': 'var(--ina-indigo-100, #ebf7ff)',
+    'indigo-200': 'var(--ina-indigo-200, #d3effe)',
+    'indigo-300': 'var(--ina-indigo-300, #80d0fd)',
+    'indigo-400': 'var(--ina-indigo-400, #0aa7ff)',
+    'indigo-500': 'var(--ina-indigo-500, #0099f0)',
+    'indigo-600': 'var(--ina-indigo-600, #0364ab)',
+    'indigo-700': 'var(--ina-indigo-700, #003c66)',
+    'indigo-800': 'var(--ina-indigo-800, #01243d)',
+    'indigo-900': 'var(--ina-indigo-900, #02121d)',
+    // Product Colors (Background, Content, Stroke, Guide, Negative, Positive, Warning)
+    'background-primary': 'var(--ina-background-primary, #ffffff)',
+    'background-secondary': 'var(--ina-background-secondary, #f8f8f7)',
+    'background-tertiary': 'var(--ina-background-tertiary, #f2f2f2)',
+    'background-overlay': 'var(--ina-background-overlay, #1f1f1f7a)',
+    'content-primary': 'var(--ina-content-primary, #1f1f1f)',
+    'content-secondary': 'var(--ina-content-secondary, #525252)',
+    'content-tertiary': 'var(--ina-content-tertiary, #a3a3a3)',
+    'content-guide': 'var(--ina-content-guide, #0968f6)',
+    'content-negative': 'var(--ina-content-negative, #f02d2d)',
+    'content-positive': 'var(--ina-content-positive, #288034)',
+    'stroke-primary': 'var(--ina-stroke-primary, #e5e5e5)',
+    'stroke-secondary': 'var(--ina-stroke-secondary, #a3a3a3)',
+    'stroke-tertiary': 'var(--ina-stroke-tertiary, #1f1f1f)',
+    // Guide Colors (alias for blue)
+    'guide-50': 'var(--ina-guide-50, #fafcff)',
+    'guide-100': 'var(--ina-guide-100, #ecf3fe)',
+    'guide-200': 'var(--ina-guide-200, #dceafe)',
+    'guide-300': 'var(--ina-guide-300, #84b4fb)',
+    'guide-400': 'var(--ina-guide-400, #4d93fc)',
+    'guide-500': 'var(--ina-guide-500, #0968f6)',
+    'guide-600': 'var(--ina-guide-600, #0049b8)',
+    'guide-700': 'var(--ina-guide-700, #002a69)',
+    'guide-800': 'var(--ina-guide-800, #0e192a)',
+    'guide-900': 'var(--ina-guide-900, #070e17)',
+    // Negative Colors (alias for red)
+    'negative-50': 'var(--ina-negative-50, #fffafa)',
+    'negative-100': 'var(--ina-negative-100, #fdeded)',
+    'negative-200': 'var(--ina-negative-200, #ffe0e0)',
+    'negative-300': 'var(--ina-negative-300, #ffa0a0)',
+    'negative-400': 'var(--ina-negative-400, #ff5c5c)',
+    'negative-500': 'var(--ina-negative-500, #f02d2d)',
+    'negative-600': 'var(--ina-negative-600, #d50b0b)',
+    'negative-700': 'var(--ina-negative-700, #570303)',
+    'negative-800': 'var(--ina-negative-800, #2a0303)',
+    'negative-900': 'var(--ina-negative-900, #1d0202)',
+    // Positive Colors (alias for green)
+    'positive-50': 'var(--ina-positive-50, #fafffa)',
+    'positive-100': 'var(--ina-positive-100, #edfded)',
+    'positive-200': 'var(--ina-positive-200, #e0fae0)',
+    'positive-300': 'var(--ina-positive-300, #a6f0a5)',
+    'positive-400': 'var(--ina-positive-400, #4ce160)',
+    'positive-500': 'var(--ina-positive-500, #3cc14e)',
+    'positive-600': 'var(--ina-positive-600, #288034)',
+    'positive-700': 'var(--ina-positive-700, #1b561a)',
+    'positive-800': 'var(--ina-positive-800, #0c310d)',
+    'positive-900': 'var(--ina-positive-900, #021d06)',
+    // Warning Colors (alias for orange)
+    'warning-50': 'var(--ina-warning-50, #fffefa)',
+    'warning-100': 'var(--ina-warning-100, #fff9eb)',
+    'warning-200': 'var(--ina-warning-200, #fff8d5)',
+    'warning-300': 'var(--ina-warning-300, #ffe58a)',
+    'warning-400': 'var(--ina-warning-400, #ffcc14)',
+    'warning-500': 'var(--ina-warning-500, #eebb04)',
+    'warning-600': 'var(--ina-warning-600, #855f00)',
+    'warning-700': 'var(--ina-warning-700, #553b06)',
+    'warning-800': 'var(--ina-warning-800, #312102)',
+    'warning-900': 'var(--ina-warning-900, #1c1402)',
+    // Base Colors
+    white: 'var(--ina-white, #ffffff)',
+    black: 'var(--ina-black, #141414)',
+};
+export default iddsColorTokens;

package/dist/tailwind/ts/inagov.d.ts

@@ -0,0 +1,6 @@
+/**
+ * InaGov Color Tokens for Tailwind CSS v3
+ * Government Services Theme
+ */
+declare const inagovColorTokens: Record<string, string>;
+export default inagovColorTokens;

package/dist/tailwind/ts/inagov.js

@@ -0,0 +1,31 @@
+/**
+ * InaGov Color Tokens for Tailwind CSS v3
+ * Government Services Theme
+ */
+const inagovColorTokens = {
+    // Primary shades
+    'primary-25': 'var(--ina-primary-25, #f6f9ff)',
+    'primary-50': 'var(--ina-primary-50, #eff5fd)',
+    'primary-100': 'var(--ina-primary-100, #c0d7f9)',
+    'primary-200': 'var(--ina-primary-200, #a1c4f5)',
+    'primary-300': 'var(--ina-primary-300, #629cef)',
+    'primary-400': 'var(--ina-primary-400, #196bcd)',
+    'primary-500': 'var(--ina-primary-500, #0956c3)',
+    'primary-600': 'var(--ina-primary-600, #0a489f)',
+    'primary-700': 'var(--ina-primary-700, #083575)',
+    'primary-800': 'var(--ina-primary-800, #022a5b)',
+    'primary-900': 'var(--ina-primary-900, #041225)',
+    'primary-primary': 'var(--ina-primary-primary, #629cef)',
+    // Secondary/Accent colors
+    'accent-100': 'var(--ina-accent-100, #ffffff)',
+    'accent-200': 'var(--ina-accent-200, #fff5ee)',
+    'accent-300': 'var(--ina-accent-300, #ffe8cc)',
+    'accent-400': 'var(--ina-accent-400, #ffd2a6)',
+    'accent-500': 'var(--ina-accent-500, #edb98a)',
+    'accent-600': 'var(--ina-accent-600, #d39663)',
+    'accent-700': 'var(--ina-accent-700, #cc1515)',
+    // Interactive hover
+    'brand-hover': 'var(--ina-brand-hover, #588cd7)',
+    'neutral-hover': 'var(--ina-neutral-hover, #edeff5)',
+};
+export default inagovColorTokens;

package/dist/tailwind/ts/inaku.d.ts

@@ -0,0 +1,6 @@
+/**
+ * InaKu Color Tokens for Tailwind CSS v3
+ * Citizen Services Theme
+ */
+declare const inakuColorTokens: Record<string, string>;
+export default inakuColorTokens;

package/dist/tailwind/ts/inaku.js

@@ -0,0 +1,31 @@
+/**
+ * InaKu Color Tokens for Tailwind CSS v3
+ * Citizen Services Theme
+ */
+const inakuColorTokens = {
+    // Primary shades
+    'primary-25': 'var(--ina-primary-25, #e8f1fc)',
+    'primary-50': 'var(--ina-primary-50, #d9e9f9)',
+    'primary-100': 'var(--ina-primary-100, #abd1ff)',
+    'primary-200': 'var(--ina-primary-200, #629cef)',
+    'primary-300': 'var(--ina-primary-300, #3a78c1)',
+    'primary-400': 'var(--ina-primary-400, #194472)',
+    'primary-500': 'var(--ina-primary-500, #06264d)',
+    'primary-600': 'var(--ina-primary-600, #041d35)',
+    'primary-700': 'var(--ina-primary-700, #020f1f)',
+    'primary-800': 'var(--ina-primary-800, #020b17)',
+    'primary-900': 'var(--ina-primary-900, #01080f)',
+    'primary-primary': 'var(--ina-primary-primary, #06264d)',
+    // Secondary/Accent colors
+    'accent-100': 'var(--ina-accent-100, #ffffff)',
+    'accent-200': 'var(--ina-accent-200, #6a7d94)',
+    'accent-300': 'var(--ina-accent-300, #06264d)',
+    'accent-400': 'var(--ina-accent-400, #051c3a)',
+    'accent-500': 'var(--ina-accent-500, #031327)',
+    'accent-600': 'var(--ina-accent-600, #000000)',
+    'accent-700': 'var(--ina-accent-700, #6a7d94)',
+    // Interactive hover
+    'inaku-brand-hover': 'var(--ina-inaku-brand-hover, #b81313)',
+    'inaku-neutral-hover': 'var(--ina-inaku-neutral-hover, #fafafa)',
+};
+export default inakuColorTokens;

package/dist/tailwind/ts/inapas.d.ts

@@ -0,0 +1,6 @@
+/**
+ * InaPas Color Tokens for Tailwind CSS v3
+ * Passport & Immigration Services Theme
+ */
+declare const inapasColorTokens: Record<string, string>;
+export default inapasColorTokens;

package/dist/tailwind/ts/inapas.js

@@ -0,0 +1,31 @@
+/**
+ * InaPas Color Tokens for Tailwind CSS v3
+ * Passport & Immigration Services Theme
+ */
+const inapasColorTokens = {
+    // Primary shades
+    'primary-25': 'var(--ina-primary-25, #fef2f2)',
+    'primary-50': 'var(--ina-primary-50, #f9dcdc)',
+    'primary-100': 'var(--ina-primary-100, #f9cdc7)',
+    'primary-200': 'var(--ina-primary-200, #ffa194)',
+    'primary-300': 'var(--ina-primary-300, #ff5f42)',
+    'primary-400': 'var(--ina-primary-400, #e8422d)',
+    'primary-500': 'var(--ina-primary-500, #cc1515)',
+    'primary-600': 'var(--ina-primary-600, #a00000)',
+    'primary-700': 'var(--ina-primary-700, #680000)',
+    'primary-800': 'var(--ina-primary-800, #290404)',
+    'primary-900': 'var(--ina-primary-900, #140202)',
+    'primary-primary': 'var(--ina-primary-primary, #cc1515)',
+    // Accent colors
+    'accent-100': 'var(--ina-accent-100, #f6fef9)',
+    'accent-200': 'var(--ina-accent-200, #ecfef3)',
+    'accent-300': 'var(--ina-accent-300, #d1fadf)',
+    'accent-400': 'var(--ina-accent-400, #a6f4c5)',
+    'accent-500': 'var(--ina-accent-500, #12b76a)',
+    'accent-600': 'var(--ina-accent-600, #039855)',
+    'accent-700': 'var(--ina-accent-700, #027a48)',
+    // Interactive hover
+    'inapas-brand-hover': 'var(--ina-inapas-brand-hover, #155eef)',
+    'inapas-neutral-hover': 'var(--ina-inapas-neutral-hover, #f9fafb)',
+};
+export default inapasColorTokens;

package/dist/tailwind/ts/lan.d.ts

@@ -0,0 +1,6 @@
+/**
+ * LAN Color Tokens for Tailwind CSS v3
+ * Local Area Network Theme
+ */
+declare const lanColorTokens: Record<string, string>;
+export default lanColorTokens;

package/dist/tailwind/ts/lan.js

@@ -0,0 +1,40 @@
+/**
+ * LAN Color Tokens for Tailwind CSS v3
+ * Local Area Network Theme
+ */
+const lanColorTokens = {
+    // Primary shades
+    'primary-25': 'var(--ina-primary-25, #f3f6fc)',
+    'primary-50': 'var(--ina-primary-50, #e5edf9)',
+    'primary-100': 'var(--ina-primary-100, #c6daf1)',
+    'primary-200': 'var(--ina-primary-200, #94bde5)',
+    'primary-300': 'var(--ina-primary-300, #5b9bd5)',
+    'primary-400': 'var(--ina-primary-400, #3781c7)',
+    'primary-500': 'var(--ina-primary-500, #2663a3)',
+    'primary-600': 'var(--ina-primary-600, #1f4f85)',
+    'primary-700': 'var(--ina-primary-700, #1e446e)',
+    'primary-800': 'var(--ina-primary-800, #1e3a5c)',
+    'primary-900': 'var(--ina-primary-900, #14263d)',
+    'primary-primary': 'var(--ina-primary-primary, #2663a3)',
+    // Secondary shades
+    'secondary-25': 'var(--ina-secondary-25, #fffdeb)',
+    'secondary-50': 'var(--ina-secondary-50, #fdf9c8)',
+    'secondary-100': 'var(--ina-secondary-100, #fbf38c)',
+    'secondary-200': 'var(--ina-secondary-200, #f9e650)',
+    'secondary-300': 'var(--ina-secondary-300, #f7d628)',
+    'secondary-400': 'var(--ina-secondary-400, #f2bd1d)',
+    'secondary-500': 'var(--ina-secondary-500, #d69009)',
+    'secondary-600': 'var(--ina-secondary-600, #b1670c)',
+    'secondary-700': 'var(--ina-secondary-700, #905110)',
+    'secondary-800': 'var(--ina-secondary-800, #764111)',
+    'secondary-900': 'var(--ina-secondary-900, #442204)',
+    // Accent colors
+    'accent-red': 'var(--ina-accent-red, #a40f0a)',
+    'accent-green': 'var(--ina-accent-green, #1cbd19)',
+    'accent-blue': 'var(--ina-accent-blue, #0a35c0)',
+    'accent-orange': 'var(--ina-accent-orange, #f08519)',
+    // Interactive hover
+    'lan-brand-hover': 'var(--ina-lan-brand-hover, #1f4f85)',
+    'lan-neutral-hover': 'var(--ina-lan-neutral-hover, #fafafa)',
+};
+export default lanColorTokens;

package/dist/tailwind/ts/panrb.d.ts

@@ -0,0 +1,5 @@
+/**
+ * PANRB Color Tokens for Tailwind CSS v3
+ */
+declare const panrbColorTokens: Record<string, string>;
+export default panrbColorTokens;

package/dist/tailwind/ts/panrb.js

@@ -0,0 +1,33 @@
+/**
+ * PANRB Color Tokens for Tailwind CSS v3
+ */
+const panrbColorTokens = {
+    // Primary shades
+    'primary-25': 'var(--ina-primary-25, #fdf3f3)',
+    'primary-50': 'var(--ina-primary-50, #fce4e4)',
+    'primary-100': 'var(--ina-primary-100, #facecf)',
+    'primary-200': 'var(--ina-primary-200, #f5acad)',
+    'primary-300': 'var(--ina-primary-300, #ed7c7e)',
+    'primary-400': 'var(--ina-primary-400, #e15254)',
+    'primary-500': 'var(--ina-primary-500, #cd3537)',
+    'primary-600': 'var(--ina-primary-600, #b42b2d)',
+    'primary-700': 'var(--ina-primary-700, #8f2527)',
+    'primary-800': 'var(--ina-primary-800, #772526)',
+    'primary-900': 'var(--ina-primary-900, #400f10)',
+    'primary-primary': 'var(--ina-primary-primary, #b42b2d)',
+    // Secondary shades
+    'secondary-25': 'var(--ina-secondary-25, #f8f7f8)',
+    'secondary-50': 'var(--ina-secondary-50, #f0eeee)',
+    'secondary-100': 'var(--ina-secondary-100, #ded9da)',
+    'secondary-200': 'var(--ina-secondary-200, #c1b8bb)',
+    'secondary-300': 'var(--ina-secondary-300, #9f9196)',
+    'secondary-400': 'var(--ina-secondary-400, #847379)',
+    'secondary-500': 'var(--ina-secondary-500, #6c5d62)',
+    'secondary-600': 'var(--ina-secondary-600, #584c50)',
+    'secondary-700': 'var(--ina-secondary-700, #4b4144)',
+    'secondary-800': 'var(--ina-secondary-800, #41393b)',
+    'secondary-900': 'var(--ina-secondary-900, #231f20)',
+    // Accent colors
+    'accent-yellow': 'var(--ina-accent-yellow, #f2c548)',
+};
+export default panrbColorTokens;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@idds/styles",
-  "version": "1.6.7",
+  "version": "1.6.9",
   "description": "Shared CSS styles and colors for INA Digital Design System",
   "type": "module",
   "main": "./dist/index.css",
@@ -15,9 +15,9 @@
     "./base.min": "./dist/base.min.css",
     "./assets/*": "./dist/assets/*",
     "./tailwind/ts/*": {
-      "import": "./dist/tailwind/ts/*.ts",
-      "require": "./dist/tailwind/ts/*.ts",
-      "types": "./dist/tailwind/ts/*.ts"
+      "import": "./dist/tailwind/ts/*.js",
+      "require": "./dist/tailwind/ts/*.js",
+      "types": "./dist/tailwind/ts/*.d.ts"
     },
     "./tailwind/css/idds.css": "./dist/tailwind/css/idds.css",
     "./tailwind/css/idds.min.css": "./dist/tailwind/css/idds.min.css",
@@ -70,6 +70,7 @@
     "cssnano": "^7.1.2",
     "postcss": "^8.5.6",
     "postcss-cli": "^11.0.1",
-    "postcss-import": "^16.1.1"
+    "postcss-import": "^16.1.1",
+    "typescript": "^5.3.3"
   }
 }

package/dist/tailwind/ts/bgn.ts

@@ -1,35 +0,0 @@
-/**
- * BGN Color Tokens for Tailwind CSS v3
- * Banking & Financial Services Theme
- */
-
-const bgnColorTokens: Record<string, string> = {
-  // Primary shades
-  'primary-25': 'var(--ina-primary-25, #ebf8ff)',
-  'primary-50': 'var(--ina-primary-50, #d3eeff)',
-  'primary-100': 'var(--ina-primary-100, #b1e2ff)',
-  'primary-200': 'var(--ina-primary-200, #7bd4ff)',
-  'primary-300': 'var(--ina-primary-300, #3eb8ff)',
-  'primary-400': 'var(--ina-primary-400, #1194ff)',
-  'primary-500': 'var(--ina-primary-500, #0070ff)',
-  'primary-600': 'var(--ina-primary-600, #0058ff)',
-  'primary-700': 'var(--ina-primary-700, #0048cf)',
-  'primary-800': 'var(--ina-primary-800, #0641a2)',
-  'primary-900': 'var(--ina-primary-900, #071e49)',
-  'primary-primary': 'var(--ina-primary-primary, #0058ff)',
-
-  // Secondary shades
-  'secondary-25': 'var(--ina-secondary-25, #fbf9f1)',
-  'secondary-50': 'var(--ina-secondary-50, #f5f1df)',
-  'secondary-100': 'var(--ina-secondary-100, #ebe0bd)',
-  'secondary-200': 'var(--ina-secondary-200, #deca93)',
-  'secondary-300': 'var(--ina-secondary-300, #d1b06c)',
-  'secondary-400': 'var(--ina-secondary-400, #c5974a)',
-  'secondary-500': 'var(--ina-secondary-500, #b8833e)',
-  'secondary-600': 'var(--ina-secondary-600, #996835)',
-  'secondary-700': 'var(--ina-secondary-700, #7b5431)',
-  'secondary-800': 'var(--ina-secondary-800, #64462a)',
-  'secondary-900': 'var(--ina-secondary-900, #352315)',
-};
-
-export default bgnColorTokens;