jb-core 0.9.0 → 0.11.0

package/package.json

@@ -14,7 +14,7 @@
     "react component",
     "event"
   ],
-  "version": "0.9.0",
+  "version": "0.11.0",
   "bugs": "https://github.com/javadbat/jb-core/issues",
   "license": "MIT",
   "files": [

package/theme/dist/colors.d.ts

@@ -0,0 +1,45 @@
+export declare const colors: {
+    readonly single: {
+        readonly black: "oklch(0.14 0 0)";
+        readonly white: "oklch(1 0 0)";
+        readonly highlight: "oklch(0.93 0.2302 125.18)";
+    };
+    readonly primary: {
+        readonly main: "oklch(0.6 0.26 256)";
+        readonly hover: string;
+        readonly pressed: string;
+        readonly lighter: string;
+    };
+    readonly secondary: {
+        readonly main: "oklch(0.6 0.26 286)";
+        readonly hover: string;
+        readonly pressed: string;
+        readonly lighter: string;
+    };
+    readonly neutral: readonly [string, string, string, string, string, string, string, string, string, string, string];
+    readonly yellow: {
+        readonly main: "oklch(0.75 0.18 70)";
+        readonly hover: string;
+        readonly pressed: string;
+        readonly lighter: string;
+    };
+    readonly green: {
+        readonly main: "oklch(0.68 0.1484 162.1)";
+        readonly hover: string;
+        readonly pressed: string;
+        readonly lighter: string;
+    };
+    readonly red: {
+        readonly main: "oklch(0.6 0.22 23.21)";
+        readonly hover: string;
+        readonly pressed: string;
+        readonly lighter: string;
+    };
+};
+export type JBThemeColors = typeof colors;
+export declare function defineColors(): void;
+export declare function getNeutralColor(index: number): string;
+export declare function getHoverColor(lightness: number, chroma: number, hue: number): string;
+export declare function getPressedColor(lightness: number, chroma: number, hue: number): string;
+export declare function getLighterColor(lightness: number, chroma: number, hue: number): string;
+//# sourceMappingURL=colors.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../lib/colors.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqCT,CAAC;AACX,MAAM,MAAM,aAAa,GAAG,OAAO,MAAM,CAAC;AAE1C,wBAAgB,YAAY,SAG3B;AA6FD,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,UAE5C;AACD,wBAAgB,aAAa,CAAC,SAAS,EAAC,MAAM,EAAE,MAAM,EAAC,MAAM,EAAE,GAAG,EAAC,MAAM,UAExE;AACD,wBAAgB,eAAe,CAAC,SAAS,EAAC,MAAM,EAAE,MAAM,EAAC,MAAM,EAAE,GAAG,EAAC,MAAM,UAE1E;AAED,wBAAgB,eAAe,CAAC,SAAS,EAAE,MAAM,EAAC,MAAM,EAAE,MAAM,EAAC,GAAG,EAAE,MAAM,UAS3E"}

package/theme/dist/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";function e(e){try{window.CSS.registerProperty({...e})}catch(e){}}const i={single:{black:"oklch(0.14 0 0)",white:"oklch(1 0 0)",highlight:"oklch(0.93 0.2302 125.18)"},primary:{main:"oklch(0.6 0.26 256)",hover:t(.6,.26,256),pressed:r(.6,.26,256),lighter:l(.6,.26,256)},secondary:{main:"oklch(0.6 0.26 286)",hover:t(.6,.26,286),pressed:r(.6,.26,286),lighter:l(.6,.26,286)},neutral:[n(0),n(1),n(2),n(3),n(4),n(5),n(6),n(7),n(8),n(9),n(10)],yellow:{main:"oklch(0.75 0.18 70)",hover:t(.75,.18,70),pressed:r(.75,.18,70),lighter:l(.75,.18,70)},green:{main:"oklch(0.68 0.1484 162.1)",hover:t(.68,.1484,162.1),pressed:r(.68,.1484,162.1),lighter:l(.68,.1484,162.1)},red:{main:"oklch(0.6 0.22 23.21)",hover:t(.6,.22,23.21),pressed:r(.6,.22,23.21),lighter:l(.6,.22,23.21)}};function n(e){return`oklch(${6*(3+1.3*e)*.01} ${.001*(14+.09*e)} 258.36)`}function t(e,i,n){return`oklch(${e+.07} ${i+.07} ${n})`}function r(e,i,n){return`oklch(${e-.1} ${i-.05} ${n})`}function l(e,i,n){const t=Math.min(e+.12*(1-e),.985),r=i*(1-.15*(t-e));return`oklch(${t.toFixed(3)} ${r.toFixed(3)} ${n})`}exports.colors=i,exports.defineColors=function(){!function(){e({name:"--jb-primary",syntax:"<color>",inherits:!0,initialValue:i.primary.main}),e({name:"--jb-secondary",syntax:"<color>",inherits:!0,initialValue:i.secondary.main}),e({name:"--jb-neutral",syntax:"<color>",inherits:!0,initialValue:"oklch(0.18 0.014 258.36)"}),e({name:"--jb-black",syntax:"<color>",inherits:!0,initialValue:i.single.black}),e({name:"--jb-white",syntax:"<color>",inherits:!0,initialValue:i.single.white}),e({name:"--jb-highlight",syntax:"<color>",inherits:!0,initialValue:i.single.highlight}),e({name:"--jb-yellow",syntax:"<color>",inherits:!0,initialValue:i.yellow.main}),e({name:"--jb-green",syntax:"<color>",inherits:!0,initialValue:i.green.main}),e({name:"--jb-red",syntax:"<color>",inherits:!0,initialValue:i.red.main}),e({name:"--jb-neutral",syntax:"<color>",inherits:!0,initialValue:n(0)});for(let n=1;n<=10;n++)e({name:`--jb-neutral-${n}`,syntax:"<color>",inherits:!0,initialValue:i.neutral[n]})}(),e({name:"--jb-text-primary",syntax:"<color>",inherits:!0,initialValue:i.single.black}),e({name:"--jb-text-secondary",syntax:"<color>",inherits:!0,initialValue:n(7)}),e({name:"--jb-text-contrast",syntax:"<color>",inherits:!0,initialValue:i.single.white})},exports.getHoverColor=t,exports.getLighterColor=l,exports.getNeutralColor=n,exports.getPressedColor=r;
+//# sourceMappingURL=index.cjs.js.map

package/theme/dist/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","names":[],"sources":["../lib/utils.ts","../lib/colors.ts"],"sourcesContent":["",""],"mappings":"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"}

package/theme/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from './colors.js';
+//# sourceMappingURL=index.d.ts.map

package/theme/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}

package/theme/dist/index.js

@@ -0,0 +1,2 @@
+function i(i){try{window.CSS.registerProperty({...i})}catch(i){}}const e={single:{black:"oklch(0.14 0 0)",white:"oklch(1 0 0)",highlight:"oklch(0.93 0.2302 125.18)"},primary:{main:"oklch(0.6 0.26 256)",hover:a(.6,.26,256),pressed:l(.6,.26,256),lighter:r(.6,.26,256)},secondary:{main:"oklch(0.6 0.26 286)",hover:a(.6,.26,286),pressed:l(.6,.26,286),lighter:r(.6,.26,286)},neutral:[t(0),t(1),t(2),t(3),t(4),t(5),t(6),t(7),t(8),t(9),t(10)],yellow:{main:"oklch(0.75 0.18 70)",hover:a(.75,.18,70),pressed:l(.75,.18,70),lighter:r(.75,.18,70)},green:{main:"oklch(0.68 0.1484 162.1)",hover:a(.68,.1484,162.1),pressed:l(.68,.1484,162.1),lighter:r(.68,.1484,162.1)},red:{main:"oklch(0.6 0.22 23.21)",hover:a(.6,.22,23.21),pressed:l(.6,.22,23.21),lighter:r(.6,.22,23.21)}};function n(){!function(){i({name:"--jb-primary",syntax:"<color>",inherits:!0,initialValue:e.primary.main}),i({name:"--jb-secondary",syntax:"<color>",inherits:!0,initialValue:e.secondary.main}),i({name:"--jb-neutral",syntax:"<color>",inherits:!0,initialValue:"oklch(0.18 0.014 258.36)"}),i({name:"--jb-black",syntax:"<color>",inherits:!0,initialValue:e.single.black}),i({name:"--jb-white",syntax:"<color>",inherits:!0,initialValue:e.single.white}),i({name:"--jb-highlight",syntax:"<color>",inherits:!0,initialValue:e.single.highlight}),i({name:"--jb-yellow",syntax:"<color>",inherits:!0,initialValue:e.yellow.main}),i({name:"--jb-green",syntax:"<color>",inherits:!0,initialValue:e.green.main}),i({name:"--jb-red",syntax:"<color>",inherits:!0,initialValue:e.red.main}),i({name:"--jb-neutral",syntax:"<color>",inherits:!0,initialValue:t(0)});for(let n=1;n<=10;n++)i({name:`--jb-neutral-${n}`,syntax:"<color>",inherits:!0,initialValue:e.neutral[n]})}(),i({name:"--jb-text-primary",syntax:"<color>",inherits:!0,initialValue:e.single.black}),i({name:"--jb-text-secondary",syntax:"<color>",inherits:!0,initialValue:t(7)}),i({name:"--jb-text-contrast",syntax:"<color>",inherits:!0,initialValue:e.single.white})}function t(i){return`oklch(${6*(3+1.3*i)*.01} ${.001*(14+.09*i)} 258.36)`}function a(i,e,n){return`oklch(${i+.07} ${e+.07} ${n})`}function l(i,e,n){return`oklch(${i-.1} ${e-.05} ${n})`}function r(i,e,n){const t=Math.min(i+.12*(1-i),.985),a=e*(1-.15*(t-i));return`oklch(${t.toFixed(3)} ${a.toFixed(3)} ${n})`}export{e as colors,n as defineColors,a as getHoverColor,r as getLighterColor,t as getNeutralColor,l as getPressedColor};
+//# sourceMappingURL=index.js.map

package/theme/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../lib/utils.ts","../lib/colors.ts"],"sourcesContent":["",""],"mappings":"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"}

package/theme/dist/index.umd.js

@@ -0,0 +1,2 @@
+!function(e,i){"object"==typeof exports&&"undefined"!=typeof module?i(exports):"function"==typeof define&&define.amd?define(["exports"],i):i((e="undefined"!=typeof globalThis?globalThis:e||self).JBCoreTheme={})}(this,(function(e){"use strict";function i(e){try{window.CSS.registerProperty({...e})}catch(e){}}const n={single:{black:"oklch(0.14 0 0)",white:"oklch(1 0 0)",highlight:"oklch(0.93 0.2302 125.18)"},primary:{main:"oklch(0.6 0.26 256)",hover:l(.6,.26,256),pressed:o(.6,.26,256),lighter:r(.6,.26,256)},secondary:{main:"oklch(0.6 0.26 286)",hover:l(.6,.26,286),pressed:o(.6,.26,286),lighter:r(.6,.26,286)},neutral:[t(0),t(1),t(2),t(3),t(4),t(5),t(6),t(7),t(8),t(9),t(10)],yellow:{main:"oklch(0.75 0.18 70)",hover:l(.75,.18,70),pressed:o(.75,.18,70),lighter:r(.75,.18,70)},green:{main:"oklch(0.68 0.1484 162.1)",hover:l(.68,.1484,162.1),pressed:o(.68,.1484,162.1),lighter:r(.68,.1484,162.1)},red:{main:"oklch(0.6 0.22 23.21)",hover:l(.6,.22,23.21),pressed:o(.6,.22,23.21),lighter:r(.6,.22,23.21)}};function t(e){return`oklch(${6*(3+1.3*e)*.01} ${.001*(14+.09*e)} 258.36)`}function l(e,i,n){return`oklch(${e+.07} ${i+.07} ${n})`}function o(e,i,n){return`oklch(${e-.1} ${i-.05} ${n})`}function r(e,i,n){const t=Math.min(e+.12*(1-e),.985),l=i*(1-.15*(t-e));return`oklch(${t.toFixed(3)} ${l.toFixed(3)} ${n})`}e.colors=n,e.defineColors=function(){!function(){i({name:"--jb-primary",syntax:"<color>",inherits:!0,initialValue:n.primary.main}),i({name:"--jb-secondary",syntax:"<color>",inherits:!0,initialValue:n.secondary.main}),i({name:"--jb-neutral",syntax:"<color>",inherits:!0,initialValue:"oklch(0.18 0.014 258.36)"}),i({name:"--jb-black",syntax:"<color>",inherits:!0,initialValue:n.single.black}),i({name:"--jb-white",syntax:"<color>",inherits:!0,initialValue:n.single.white}),i({name:"--jb-highlight",syntax:"<color>",inherits:!0,initialValue:n.single.highlight}),i({name:"--jb-yellow",syntax:"<color>",inherits:!0,initialValue:n.yellow.main}),i({name:"--jb-green",syntax:"<color>",inherits:!0,initialValue:n.green.main}),i({name:"--jb-red",syntax:"<color>",inherits:!0,initialValue:n.red.main}),i({name:"--jb-neutral",syntax:"<color>",inherits:!0,initialValue:t(0)});for(let e=1;e<=10;e++)i({name:`--jb-neutral-${e}`,syntax:"<color>",inherits:!0,initialValue:n.neutral[e]})}(),i({name:"--jb-text-primary",syntax:"<color>",inherits:!0,initialValue:n.single.black}),i({name:"--jb-text-secondary",syntax:"<color>",inherits:!0,initialValue:t(7)}),i({name:"--jb-text-contrast",syntax:"<color>",inherits:!0,initialValue:n.single.white})},e.getHoverColor=l,e.getLighterColor=r,e.getNeutralColor=t,e.getPressedColor=o}));
+//# sourceMappingURL=index.umd.js.map

package/theme/dist/index.umd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.umd.js","names":[],"sources":["../lib/utils.ts","../lib/colors.ts"],"sourcesContent":["",""],"mappings":"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"}

package/theme/dist/utils.d.ts

@@ -0,0 +1,2 @@
+export declare function setCssProperty(value: PropertyDefinition): void;
+//# sourceMappingURL=utils.d.ts.map

package/theme/dist/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../lib/utils.ts"],"names":[],"mappings":"AAAA,wBAAgB,cAAc,CAAC,KAAK,EAAE,kBAAkB,QAQvD"}

package/theme/{colors.ts → lib/colors.ts}

@@ -9,14 +9,37 @@ export const colors = {
   primary:{
     main:'oklch(0.6 0.26 256)',
     hover:getHoverColor(0.6,0.26,256),
-    pressed:getPressedColor(0.6,0.26,256)
+    pressed:getPressedColor(0.6,0.26,256),
+    lighter:getLighterColor(0.6,0.26,256),
   },
   secondary:{
     main:'oklch(0.6 0.26 286)',
     hover:getHoverColor(0.6,0.26,286),
     pressed:getPressedColor(0.6,0.26,286),
-  }
+    lighter:getLighterColor(0.6,0.26,286),
+  },
+  neutral: [getNeutralColor(0),getNeutralColor(1),getNeutralColor(2),getNeutralColor(3),getNeutralColor(4),getNeutralColor(5),getNeutralColor(6),getNeutralColor(7),getNeutralColor(8),getNeutralColor(9),getNeutralColor(10)],
+  yellow:{
+    main:'oklch(0.75 0.18 70)',
+    hover:getHoverColor(0.75, 0.18, 70),
+    pressed:getPressedColor(0.75, 0.18, 70),
+    lighter:getLighterColor(0.75, 0.18, 70),
+  },
+  green:{
+    main:"oklch(0.68 0.1484 162.1)",
+    hover:getHoverColor(0.68,0.1484,162.1),
+    pressed:getPressedColor(0.68,0.1484,162.1),
+    lighter:getLighterColor(0.68,0.1484,162.1),
+  },
+  red:{
+    main:"oklch(0.6 0.22 23.21)",
+    hover:getHoverColor(0.6,0.22,23.21),
+    pressed:getPressedColor(0.6,0.22,23.21),
+    lighter:getLighterColor(0.6,0.22,23.21),
+  },
 } as const;
+export type JBThemeColors = typeof colors;
+
 export function defineColors() {
   defineColorCodes();
   defineTextColors();
@@ -58,17 +81,23 @@ function defineColorCodes(){
     inherits: true,
     initialValue: colors.single.highlight ,
   });
+  setCssProperty({
+    name: "--jb-yellow",
+    syntax: "<color>",
+    inherits: true,
+    initialValue: colors.yellow.main,
+  });
   setCssProperty({
     name: "--jb-green",
     syntax: "<color>",
     inherits: true,
-    initialValue: "oklch(0.68 0.1484 162.1)",
+    initialValue: colors.green.main,
   });
   setCssProperty({
     name: "--jb-red",
     syntax: "<color>",
     inherits: true,
-    initialValue: "oklch(0.6 0.22 23.21)",
+    initialValue: colors.red.main,
   });
   setCssProperty({
     name: `--jb-neutral`,
@@ -81,7 +110,7 @@ function defineColorCodes(){
       name: `--jb-neutral-${i}`,
       syntax: "<color>",
       inherits: true,
-      initialValue: getNeutralColor(i),
+      initialValue: colors.neutral[i],
     });
   }
 }
@@ -115,4 +144,15 @@ export function getHoverColor(lightness:number, chroma:number, hue:number){
 }
 export function getPressedColor(lightness:number, chroma:number, hue:number){
   return `oklch(${lightness - 0.1} ${chroma - 0.05} ${hue})`;
+}
+
+export function getLighterColor(lightness: number,chroma: number,hue: number) {
+  // Perceptual lightness increase (curved adjustment)
+  const newL = Math.min(lightness + 0.12 * (1 - lightness), 0.985);
+  
+  // Chroma preservation with gamut safety
+  const newC = chroma * (1 - 0.15 * (newL - lightness));
+  
+  // Hue preservation (no shift)
+  return `oklch(${newL.toFixed(3)} ${newC.toFixed(3)} ${hue})`;
 }

package/theme/package.json

@@ -0,0 +1,6 @@
+{
+  "name": "jb-core-theme",
+  "version": "1.0.0",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts"
+}

package/theme/stories/colors.mdx

@@ -0,0 +1,42 @@
+import {Meta,ColorPalette,ColorItem, Heading, Subheading, } from '@storybook/blocks'
+import {getNeutralColor, colors} from 'jb-core/theme';
+
+<Meta title="Theme/Colors" />
+<Heading>Color Palette</Heading>
+<Subheading >all color are based on oklch() color space</Subheading>
+<br/>
+<ColorPalette>
+  <ColorItem title="single" description="" colors={{'black': colors.single.black,'white':colors.single.white}}/>
+  <ColorItem title="neutral" description="" colors={{'main':getNeutralColor(0),'d1':getNeutralColor(1),'d2':getNeutralColor(2),'d3':getNeutralColor(3),'d4':getNeutralColor(4),'d5':getNeutralColor(5),'d6':getNeutralColor(6),'d7':getNeutralColor(7),'d8':getNeutralColor(8),'d9':getNeutralColor(9),'d10':getNeutralColor(10)}}/>
+  <ColorItem title="primary" description="" colors={{'main':colors.primary.main,'lighter':colors.primary.lighter ,'hover':colors.primary.hover,'pressed':colors.primary.pressed}}/>
+  <ColorItem title="secondary" description="" colors={{'main':colors.secondary.main, 'lighter':colors.secondary.lighter,'hover':colors.secondary.hover,'pressed':colors.secondary.pressed}}/>
+  <ColorItem title="success" description="" colors={{'main':colors.green.main,'lighter':colors.green.lighter,'hover':colors.green.hover,'pressed':colors.green.pressed, 'subtle backgrounds':'oklch(0.87 0.116 171.77)', 'darker(text/icon)':'oklch(0.58 0.1227 163.94)', 'deep accents':'oklch(0.46 0.096255 165.0871)'}}/>
+  <ColorItem title="error" description="" colors={{'main':colors.red.main,"lighter":colors.red.lighter,'hover':colors.red.hover, 'pressed':colors.red.pressed, 'soft warnings':'#FF5C75', 'hover/backgrounds':'#FFA3B3','critical errors':'#D90026','dark mode':'#A3001D'}}/>
+  <ColorItem title="warning" description="" colors={{'main':colors.yellow.main, 'lighter':colors.yellow.lighter,'hover':colors.yellow.hover, 'pressed':colors.yellow.pressed}}/>
+</ColorPalette>
+
+<Subheading>Color Rules</Subheading>
+
+we use `oklch()` color space for all colors in our design system. This allows us to create a consistent and harmonious color palette that is easy to use and understand.
+<p>
+for example primary color is `oklch(0.6 0.26 256)` which is a blue color with a lightness of 60%, chroma of 0.26, and hue of 256 degrees.
+for hover state we add `0.07` to lightness and `0.07` to chroma so it gets a little lighter and brighter.
+for pressed state we subtract `0.1` to lightness and `0.05` to chroma so it gets a little darker and dimmer.
+</p>
+<br/>
+<Subheading>Define custom colors</Subheading>
+<br/>
+<p>
+you can define your own colors by using `jb-core/theme` functions.
+</p>
+<p>
+  there are several function that will give you the color you want:
+  - `getNeutralColor(lightness:number)` will give you a neutral color based on the lightness value you provide. it will return a color that is in the range of 0 to 10.
+  - `getHoverColor(l:number,c:number,h:number)` will give you a hover color based on the color you provide. it will return a color that is a little lighter and brighter than the original color.
+  - `getPressedColor(l:number,c:number,h:number)` will give you a pressed color based on the color you provide. it will return a color that is a little darker and dimmer than the original color.
+  - `getLighterColor(l:number,c:number,h:number)` will give you a lighter color based on the color you provide. it will return a color that is a little lighter than the original color.
+</p>
+<br/>
+<p>
+  after you define your colors you can define them in your components by using the `jb-core/theme` `defineColors` function by providing `JBThemeColors` object.
+</p>

package/theme/tsconfig.json

@@ -0,0 +1,17 @@
+{
+    "compilerOptions": {
+        "baseUrl": ".",
+        "rootDir": "./lib",
+        "declarationDir": "./dist",
+    },
+    "include": [
+        "lib/**/*.ts",
+    ],
+    "exclude": [
+        "stories",
+        "node_modules",
+        "**/*.spec.ts",
+        "dist",
+    ],
+    "extends":"../configs/tsconfig-web-component.json"
+}