@a-type/ui 5.0.7 → 5.0.9

package/dist/esm/uno/logic/properties.js

@@ -18,6 +18,7 @@ export const PROPS = {
             SERIF: '--u-font-serif',
             TITLE: '--u-font-title',
         },
+        FOCUS_COLOR: '--u-focus-color',
     },
     PALETTE: {
         NAME: '--p-name',
@@ -126,6 +127,11 @@ export const PROPS = {
         SHADOW_COLOR: '--un-shadow-color',
         SHADOW_OPACITY: '--un-shadow-opacity',
         SHADOW: '--un-shadow',
+        RING_WIDTH: '--un-ring-width',
+        RING_STYLE: '--un-ring-style',
+        RING_OFFSET_SHADOW: '--un-ring-offset-shadow',
+        RING_SHADOW: '--un-ring-shadow',
+        RING_INSET: '--un-ring-inset',
     },
 };
 //# sourceMappingURL=properties.js.map

package/dist/esm/uno/logic/properties.js.map

@@ -1 +1 @@
-{"version":3,"file":"properties.js","sourceRoot":"","sources":["../../../../src/uno/logic/properties.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"properties.js","sourceRoot":"","sources":["../../../../src/uno/logic/properties.ts"],"names":[],"mappings":"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"}

package/dist/esm/uno/preflights/index.d.ts

@@ -2,6 +2,7 @@ import { Preflight } from 'unocss';
 import { ColorPreflightOptions } from './colors.js';
 import { FontsPreflightOptions } from './fonts.js';
 import { GlobalsPreflightConfig } from './globals.js';
+import { KeyboardPreflightOptions } from './keyboard.js';
 import { UserPreflightOptions } from './user.js';
-export type PreflightConfig = FontsPreflightOptions & GlobalsPreflightConfig & UserPreflightOptions & ColorPreflightOptions;
+export type PreflightConfig = FontsPreflightOptions & GlobalsPreflightConfig & UserPreflightOptions & ColorPreflightOptions & KeyboardPreflightOptions;
 export declare const preflights: (config: PreflightConfig) => Preflight<any>[];

package/dist/esm/uno/preflights/index.js

@@ -17,6 +17,6 @@ export const preflights = (config) => [
     fontsPreflight(config),
     propertiesPreflight,
     userPreflight(config),
-    keyboardPreflight,
+    keyboardPreflight(config),
 ];
 //# sourceMappingURL=index.js.map

package/dist/esm/uno/preflights/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/uno/preflights/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAyB,MAAM,aAAa,CAAC;AACpE,OAAO,EAAE,cAAc,EAAyB,MAAM,YAAY,CAAC;AACnE,OAAO,EAAE,eAAe,EAA0B,MAAM,cAAc,CAAC;AACvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAC1C,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAwB,MAAM,WAAW,CAAC;AAOhE,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,MAAuB,EAAoB,EAAE,CAAC;IACxE,cAAc;IACd,aAAa;IACb,eAAe,CAAC,MAAM,CAAC;IACvB,cAAc,CAAC,MAAM,CAAC;IACtB,aAAa,CAAC,MAAM,CAAC;IACrB,cAAc,CAAC,MAAM,CAAC;IACtB,mBAAmB;IACnB,aAAa,CAAC,MAAM,CAAC;IACrB,iBAAiB;CACjB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/uno/preflights/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAyB,MAAM,aAAa,CAAC;AACpE,OAAO,EAAE,cAAc,EAAyB,MAAM,YAAY,CAAC;AACnE,OAAO,EAAE,eAAe,EAA0B,MAAM,cAAc,CAAC;AACvE,OAAO,EAAE,iBAAiB,EAA4B,MAAM,eAAe,CAAC;AAC5E,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAC1C,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAwB,MAAM,WAAW,CAAC;AAQhE,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,MAAuB,EAAoB,EAAE,CAAC;IACxE,cAAc;IACd,aAAa;IACb,eAAe,CAAC,MAAM,CAAC;IACvB,cAAc,CAAC,MAAM,CAAC;IACtB,aAAa,CAAC,MAAM,CAAC;IACrB,cAAc,CAAC,MAAM,CAAC;IACtB,mBAAmB;IACnB,aAAa,CAAC,MAAM,CAAC;IACrB,iBAAiB,CAAC,MAAM,CAAC;CACzB,CAAC"}

package/dist/esm/uno/preflights/keyboard.d.ts

@@ -1 +1,4 @@
-export declare const keyboardPreflight: import("unocss").Preflight<object>;
+export interface KeyboardPreflightOptions {
+    rootSelector?: string;
+}
+export declare const keyboardPreflight: ({ rootSelector, }: KeyboardPreflightOptions) => import("unocss").Preflight<object>;

package/dist/esm/uno/preflights/keyboard.js

@@ -1,12 +1,12 @@
 // @unocss-include
 import { preflight } from './_util.js';
-export const keyboardPreflight = preflight({
+export const keyboardPreflight = ({ rootSelector = '#root,#main', }) => preflight({
     getCSS: () => 
     // add space to bottom of body equal to virtual keyboard inset so that
     // content is not hidden behind the keyboard
     `
-	body {
-		margin-bottom: env(virtual-keyboard-inset-bottom, 0px) !important;
+	${rootSelector} {
+		transform: translateY(calc(-1 * env(keyboard-inset-height,0px)));
 	}
 `,
 });

package/dist/esm/uno/preflights/keyboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard.js","sourceRoot":"","sources":["../../../../src/uno/preflights/keyboard.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAEvC,MAAM,CAAC,MAAM,iBAAiB,GAAG,SAAS,CAAC;IAC1C,MAAM,EAAE,GAAG,EAAE;IACZ,sEAAsE;IACtE,4CAA4C;IAC5C;;;;CAID;CACA,CAAC,CAAC"}
+{"version":3,"file":"keyboard.js","sourceRoot":"","sources":["../../../../src/uno/preflights/keyboard.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAMvC,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,EACjC,YAAY,GAAG,aAAa,GACF,EAAE,EAAE,CAC9B,SAAS,CAAC;IACT,MAAM,EAAE,GAAG,EAAE;IACZ,sEAAsE;IACtE,4CAA4C;IAC5C;GACA,YAAY;;;CAGd;CACC,CAAC,CAAC"}

package/dist/esm/uno/preflights/user.d.ts

@@ -14,5 +14,6 @@ export interface UserPreflightOptions {
     cornerScale?: number;
     shadowSpread?: number;
     fontSize?: number;
+    focusColor?: 'black' | 'primary' | 'accent' | 'gray';
 }
-export declare const userPreflight: ({ saturation, primaryHue, accentHue, spacingScale, borderScale, cornerScale, shadowSpread, namedHues, fontSize, }: UserPreflightOptions) => import("unocss").Preflight<object>;
+export declare const userPreflight: ({ saturation, primaryHue, accentHue, spacingScale, borderScale, cornerScale, shadowSpread, namedHues, fontSize, focusColor, }: UserPreflightOptions) => import("unocss").Preflight<object>;

package/dist/esm/uno/preflights/user.js

@@ -2,7 +2,7 @@
 import { defaultPresetHues } from '../defaults.js';
 import { PROPS } from '../logic/properties.js';
 import { preflight } from './_util.js';
-export const userPreflight = ({ saturation = 50, primaryHue = defaultPresetHues.lemon.sourceHue, accentHue = defaultPresetHues.leek.sourceHue, spacingScale = 1, borderScale = 1, cornerScale = 1, shadowSpread = 1, namedHues, fontSize = 16, }) => preflight({
+export const userPreflight = ({ saturation = 50, primaryHue = defaultPresetHues.lemon.sourceHue, accentHue = defaultPresetHues.leek.sourceHue, spacingScale = 1, borderScale = 1, cornerScale = 1, shadowSpread = 1, namedHues, fontSize = 16, focusColor = 'accent', }) => preflight({
     getCSS: () => {
         return `
 @layer preflightBase {
@@ -15,6 +15,7 @@ export const userPreflight = ({ saturation = 50, primaryHue = defaultPresetHues.
 
 		${PROPS.USER.COLOR.PRIMARY_HUE}: ${primaryHue};
 		${PROPS.USER.COLOR.ACCENT_HUE}: ${accentHue};
+		${PROPS.USER.FOCUS_COLOR}: var(${focusColors[focusColor]});
 		${namedHues
             ? Object.entries(namedHues)
                 .flatMap(([name, config]) => [
@@ -32,4 +33,10 @@ export const userPreflight = ({ saturation = 50, primaryHue = defaultPresetHues.
 `;
     },
 });
+const focusColors = {
+    black: PROPS.MODE.BLACK,
+    primary: PROPS.PALETTE.NAMED_SHADES('primary').DARK,
+    accent: PROPS.PALETTE.NAMED_SHADES('accent').MID,
+    gray: PROPS.PALETTE.GRAY_SHADES.DARK,
+};
 //# sourceMappingURL=user.js.map

package/dist/esm/uno/preflights/user.js.map

@@ -1 +1 @@
-{"version":3,"file":"user.js","sourceRoot":"","sources":["../../../../src/uno/preflights/user.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAoBvC,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC7B,UAAU,GAAG,EAAE,EACf,UAAU,GAAG,iBAAiB,CAAC,KAAK,CAAC,SAAS,EAC9C,SAAS,GAAG,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAC5C,YAAY,GAAG,CAAC,EAChB,WAAW,GAAG,CAAC,EACf,WAAW,GAAG,CAAC,EACf,YAAY,GAAG,CAAC,EAChB,SAAS,EACT,QAAQ,GAAG,EAAE,GACS,EAAE,EAAE,CAC1B,SAAS,CAAC;IACT,MAAM,EAAE,GAAG,EAAE;QACZ,OAAO;;;IAGN,KAAK,CAAC,IAAI,CAAC,UAAU,KAAK,UAAU,GAAG,GAAG;IAC1C,KAAK,CAAC,IAAI,CAAC,YAAY,KAAK,WAAW;IACvC,KAAK,CAAC,IAAI,CAAC,aAAa,KAAK,YAAY;IACzC,KAAK,CAAC,IAAI,CAAC,YAAY,KAAK,WAAW;IACvC,KAAK,CAAC,IAAI,CAAC,aAAa,KAAK,YAAY;;IAEzC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,KAAK,UAAU;IAC3C,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,KAAK,SAAS;IAE1C,SAAS;YACR,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC;iBACxB,OAAO,CAAC,CAAC,CAAC,IAAI,EAAE,MAAM,CAAC,EAAE,EAAE,CAAC;gBAC5B,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,MAAM,CAAC,SAAS,GAAG;gBAC3D,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,KACzC,MAAM,CAAC,SACR,GAAG;aACH,CAAC;iBACD,IAAI,CAAC,IAAI,CAAC;YACb,CAAC,CAAC,EACJ;;;;eAIa,QAAQ;;;CAGtB,CAAC;IACA,CAAC;CACD,CAAC,CAAC"}
+{"version":3,"file":"user.js","sourceRoot":"","sources":["../../../../src/uno/preflights/user.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAqBvC,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC7B,UAAU,GAAG,EAAE,EACf,UAAU,GAAG,iBAAiB,CAAC,KAAK,CAAC,SAAS,EAC9C,SAAS,GAAG,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAC5C,YAAY,GAAG,CAAC,EAChB,WAAW,GAAG,CAAC,EACf,WAAW,GAAG,CAAC,EACf,YAAY,GAAG,CAAC,EAChB,SAAS,EACT,QAAQ,GAAG,EAAE,EACb,UAAU,GAAG,QAAQ,GACC,EAAE,EAAE,CAC1B,SAAS,CAAC;IACT,MAAM,EAAE,GAAG,EAAE;QACZ,OAAO;;;IAGN,KAAK,CAAC,IAAI,CAAC,UAAU,KAAK,UAAU,GAAG,GAAG;IAC1C,KAAK,CAAC,IAAI,CAAC,YAAY,KAAK,WAAW;IACvC,KAAK,CAAC,IAAI,CAAC,aAAa,KAAK,YAAY;IACzC,KAAK,CAAC,IAAI,CAAC,YAAY,KAAK,WAAW;IACvC,KAAK,CAAC,IAAI,CAAC,aAAa,KAAK,YAAY;;IAEzC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,KAAK,UAAU;IAC3C,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,KAAK,SAAS;IACzC,KAAK,CAAC,IAAI,CAAC,WAAW,SAAS,WAAW,CAAC,UAAU,CAAC;IAEvD,SAAS;YACR,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC;iBACxB,OAAO,CAAC,CAAC,CAAC,IAAI,EAAE,MAAM,CAAC,EAAE,EAAE,CAAC;gBAC5B,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,MAAM,CAAC,SAAS,GAAG;gBAC3D,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,KACzC,MAAM,CAAC,SACR,GAAG;aACH,CAAC;iBACD,IAAI,CAAC,IAAI,CAAC;YACb,CAAC,CAAC,EACJ;;;;eAIa,QAAQ;;;CAGtB,CAAC;IACA,CAAC;CACD,CAAC,CAAC;AAEJ,MAAM,WAAW,GAGb;IACH,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,KAAK;IACvB,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,IAAI;IACnD,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,GAAG;IAChD,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI;CACpC,CAAC"}

package/dist/esm/uno/rules/focus.d.ts

@@ -0,0 +1,3 @@
+import { Theme } from '@unocss/preset-mini';
+import { Rule } from 'unocss';
+export declare const focusRules: Rule<Theme>[];

package/dist/esm/uno/rules/focus.js

@@ -0,0 +1,43 @@
+// @unocss-include
+import { PROPS } from '../logic/properties.js';
+export const focusRules = [
+    [
+        /^foc(?:-effect)?(-lg)?$/,
+        function* ([, size], { symbols }) {
+            yield {
+                [symbols.selector]: (selector) => `${selector}:focus-visible:not([data-focus-clicked]), ${selector}[data-focus-visible]`,
+                [PROPS.BUILT_IN.RING_COLOR]: `var(${PROPS.USER.FOCUS_COLOR})`,
+                [PROPS.BUILT_IN.RING_WIDTH]: size === '-lg' ? '4px' : '2px',
+                [PROPS.BUILT_IN.RING_STYLE]: 'solid',
+                [PROPS.BUILT_IN
+                    .RING_SHADOW]: `var(${PROPS.BUILT_IN.RING_INSET}) 0 0 0 var(${PROPS.BUILT_IN.RING_WIDTH}) var(${PROPS.BUILT_IN.RING_COLOR})`,
+                outline: 'none',
+                'box-shadow': `var(${PROPS.BUILT_IN.RING_OFFSET_SHADOW}), var(${PROPS.BUILT_IN.RING_SHADOW}), var(${PROPS.BUILT_IN.SHADOW})`,
+            };
+            yield {
+                [symbols.selector]: (selector) => `${selector}:focus`,
+                outline: 'none',
+            };
+        },
+    ],
+    [
+        /^foc-contained(-lg)?$/,
+        function* ([, size], { symbols }) {
+            yield {
+                [symbols.selector]: (selector) => `${selector}:has(:focus-visible:not([data-focus-clicked])), ${selector}:has([data-focus-visible])`,
+                [PROPS.BUILT_IN.RING_COLOR]: `var(${PROPS.USER.FOCUS_COLOR})`,
+                [PROPS.BUILT_IN.RING_WIDTH]: size === '-lg' ? '4px' : '2px',
+                [PROPS.BUILT_IN.RING_STYLE]: 'solid',
+                [PROPS.BUILT_IN
+                    .RING_SHADOW]: `0 0 0 var(${PROPS.BUILT_IN.RING_WIDTH}) var(${PROPS.BUILT_IN.RING_COLOR})`,
+                outline: 'none',
+                'box-shadow': `var(${PROPS.BUILT_IN.RING_OFFSET_SHADOW}), var(${PROPS.BUILT_IN.RING_SHADOW})`,
+            };
+            yield {
+                [symbols.selector]: (selector) => `${selector}>*:focus`,
+                outline: 'none',
+            };
+        },
+    ],
+];
+//# sourceMappingURL=focus.js.map

package/dist/esm/uno/rules/focus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"focus.js","sourceRoot":"","sources":["../../../../src/uno/rules/focus.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAE/C,MAAM,CAAC,MAAM,UAAU,GAAkB;IACxC;QACC,yBAAyB;QACzB,QAAQ,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,OAAO,EAAE;YAC/B,MAAM;gBACL,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,EAAE,CAChC,GAAG,QAAQ,6CAA6C,QAAQ,sBAAsB;gBACvF,CAAC,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,KAAK,CAAC,IAAI,CAAC,WAAW,GAAG;gBAC7D,CAAC,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK;gBAC3D,CAAC,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO;gBACpC,CAAC,KAAK,CAAC,QAAQ;qBACb,WAAW,CAAC,EAAE,OAAO,KAAK,CAAC,QAAQ,CAAC,UAAU,eAAe,KAAK,CAAC,QAAQ,CAAC,UAAU,SAAS,KAAK,CAAC,QAAQ,CAAC,UAAU,GAAG;gBAC7H,OAAO,EAAE,MAAM;gBACf,YAAY,EAAE,OAAO,KAAK,CAAC,QAAQ,CAAC,kBAAkB,UAAU,KAAK,CAAC,QAAQ,CAAC,WAAW,UAAU,KAAK,CAAC,QAAQ,CAAC,MAAM,GAAG;aAC5H,CAAC;YACF,MAAM;gBACL,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC,GAAG,QAAQ,QAAQ;gBACrD,OAAO,EAAE,MAAM;aACf,CAAC;QACH,CAAC;KACD;IACD;QACC,uBAAuB;QACvB,QAAQ,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,OAAO,EAAE;YAC/B,MAAM;gBACL,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,EAAE,CAChC,GAAG,QAAQ,mDAAmD,QAAQ,4BAA4B;gBACnG,CAAC,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,KAAK,CAAC,IAAI,CAAC,WAAW,GAAG;gBAC7D,CAAC,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK;gBAC3D,CAAC,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO;gBACpC,CAAC,KAAK,CAAC,QAAQ;qBACb,WAAW,CAAC,EAAE,aAAa,KAAK,CAAC,QAAQ,CAAC,UAAU,SAAS,KAAK,CAAC,QAAQ,CAAC,UAAU,GAAG;gBAC3F,OAAO,EAAE,MAAM;gBACf,YAAY,EAAE,OAAO,KAAK,CAAC,QAAQ,CAAC,kBAAkB,UAAU,KAAK,CAAC,QAAQ,CAAC,WAAW,GAAG;aAC7F,CAAC;YACF,MAAM;gBACL,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC,GAAG,QAAQ,UAAU;gBACvD,OAAO,EAAE,MAAM;aACf,CAAC;QACH,CAAC;KACD;CACD,CAAC"}

package/dist/esm/uno/rules/index.d.ts

@@ -1 +1 @@
-export declare const rules: import("unocss").Rule[];
+export declare const rules: (import("unocss").StaticRule | import("unocss").DynamicRule<object> | import("unocss").DynamicRule<import("unocss").PresetUnoTheme>)[];

package/dist/esm/uno/rules/index.js

@@ -3,6 +3,7 @@ import { anchorRules } from './anchor.js';
 import { clipPathRules } from './clipPath.js';
 import { colorRules } from './color.js';
 import { containerRules } from './container.js';
+import { focusRules } from './focus.js';
 import { overflowRules } from './overflow.js';
 import { shadowRules } from './shadow.js';
 import { utilRules } from './util.js';
@@ -19,5 +20,6 @@ export const rules = [
     ...utilRules,
     ...clipPathRules,
     ...containerRules,
+    ...focusRules,
 ];
 //# sourceMappingURL=index.js.map

package/dist/esm/uno/rules/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/uno/rules/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAEtC,yCAAyC;AACzC,kBAAkB;AAClB,gFAAgF;AAChF,MAAM;AAEN,uEAAuE;AAEvE,MAAM,CAAC,MAAM,KAAK,GAAG;IACpB,GAAG,UAAU;IACb,GAAG,WAAW;IACd,GAAG,aAAa;IAChB,GAAG,WAAW;IACd,GAAG,SAAS;IACZ,GAAG,aAAa;IAChB,GAAG,cAAc;CACjB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/uno/rules/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACxC,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAEtC,yCAAyC;AACzC,kBAAkB;AAClB,gFAAgF;AAChF,MAAM;AAEN,uEAAuE;AAEvE,MAAM,CAAC,MAAM,KAAK,GAAG;IACpB,GAAG,UAAU;IACb,GAAG,WAAW;IACd,GAAG,aAAa;IAChB,GAAG,WAAW;IACd,GAAG,SAAS;IACZ,GAAG,aAAa;IAChB,GAAG,cAAc;IACjB,GAAG,UAAU;CACb,CAAC"}

package/dist/esm/uno/theme/colors.d.ts

@@ -1,3 +1,3 @@
 import { Theme } from '@unocss/preset-mini';
 import { PreflightConfig } from '../preflights/index.js';
-export declare function makeThemeColors(options: PreflightConfig): Theme['colors'];
+export declare function makeThemeColors({ namedHues, }: PreflightConfig): Theme['colors'];

package/dist/esm/uno/theme/colors.js

@@ -1,11 +1,11 @@
 // @unocss-include
 import { PROPS } from '../logic/properties.js';
 const contrastClamp = 'clamp(0, (0.36 / y - 1) * infinity, 1)';
-export function makeThemeColors(options) {
+export function makeThemeColors({ namedHues, }) {
     return Object.assign({ none: 'transparent', transparent: 'transparent', current: 'currentColor', black: `var(${PROPS.PALETTE.NAMED_SHADES('high-contrast').INK})`, white: `var(${PROPS.PALETTE.NAMED_SHADES('high-contrast').WASH})`, wash: `var(${PROPS.PALETTE.GRAY_SHADES.WASH})`, 
         // magic tokens
-        contrast: `color(from var(${PROPS.BACKGROUND_COLOR.CONTRAST},var(${PROPS.BACKGROUND_COLOR.FINAL},var(${PROPS.BACKGROUND_COLOR.INHERITED},var(${PROPS.MODE.WHITE})))) xyz-d65 ${contrastClamp} ${contrastClamp} ${contrastClamp})`, bg: `var(${PROPS.BACKGROUND_COLOR.FINAL}, var(${PROPS.BACKGROUND_COLOR.INHERITED}, transparent))`, fg: `var(${PROPS.COLOR.FINAL}, var(${PROPS.COLOR.INHERITED}, var(${PROPS.MODE.BLACK})))`, color: `var(${PROPS.COLOR.FINAL}, var(${PROPS.COLOR.INHERITED}, var(${PROPS.MODE.BLACK})))`, border: `var(${PROPS.BORDER_COLOR.ALL.FINAL}, var(${PROPS.BORDER_COLOR.ALL.INHERITED}, transparent))`, primary: shadesOf(PROPS.PALETTE.NAMED_SHADES('primary')), accent: shadesOf(PROPS.PALETTE.NAMED_SHADES('accent')), attention: shadesOf(PROPS.PALETTE.NAMED_SHADES('attention')), success: shadesOf(PROPS.PALETTE.NAMED_SHADES('success')), main: shadesOf(PROPS.PALETTE.SHADES), gray: shadesOf(PROPS.PALETTE.GRAY_SHADES) }, (options.namedHues
-        ? Object.fromEntries(Object.keys(options.namedHues).map(([name]) => [
+        contrast: `color(from var(${PROPS.BACKGROUND_COLOR.CONTRAST},var(${PROPS.BACKGROUND_COLOR.FINAL},var(${PROPS.BACKGROUND_COLOR.INHERITED},var(${PROPS.MODE.WHITE})))) xyz-d65 ${contrastClamp} ${contrastClamp} ${contrastClamp})`, bg: `var(${PROPS.BACKGROUND_COLOR.FINAL}, var(${PROPS.BACKGROUND_COLOR.INHERITED}, transparent))`, fg: `var(${PROPS.COLOR.FINAL}, var(${PROPS.COLOR.INHERITED}, var(${PROPS.MODE.BLACK})))`, color: `var(${PROPS.COLOR.FINAL}, var(${PROPS.COLOR.INHERITED}, var(${PROPS.MODE.BLACK})))`, border: `var(${PROPS.BORDER_COLOR.ALL.FINAL}, var(${PROPS.BORDER_COLOR.ALL.INHERITED}, transparent))`, primary: shadesOf(PROPS.PALETTE.NAMED_SHADES('primary')), accent: shadesOf(PROPS.PALETTE.NAMED_SHADES('accent')), attention: shadesOf(PROPS.PALETTE.NAMED_SHADES('attention')), success: shadesOf(PROPS.PALETTE.NAMED_SHADES('success')), focus: `var(${PROPS.USER.FOCUS_COLOR})`, main: shadesOf(PROPS.PALETTE.SHADES), gray: shadesOf(PROPS.PALETTE.GRAY_SHADES) }, (namedHues
+        ? Object.fromEntries(Object.keys(namedHues).map(([name]) => [
             name,
             shadesOf(PROPS.PALETTE.NAMED_SHADES(name)),
         ]))

package/dist/esm/uno/theme/colors.js.map

@@ -1 +1 @@
-{"version":3,"file":"colors.js","sourceRoot":"","sources":["../../../../src/uno/theme/colors.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAG/C,MAAM,aAAa,GAAG,wCAAwC,CAAC;AAE/D,MAAM,UAAU,eAAe,CAAC,OAAwB;IACvD,uBACC,IAAI,EAAE,aAAa,EACnB,WAAW,EAAE,aAAa,EAC1B,OAAO,EAAE,cAAc,EAEvB,KAAK,EAAE,OAAO,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,GAAG,GAAG,EAChE,KAAK,EAAE,OAAO,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,IAAI,GAAG,EACjE,IAAI,EAAE,OAAO,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,GAAG;QAE9C,eAAe;QACf,QAAQ,EAAE,kBAAkB,KAAK,CAAC,gBAAgB,CAAC,QAAQ,QAAQ,KAAK,CAAC,gBAAgB,CAAC,KAAK,QAAQ,KAAK,CAAC,gBAAgB,CAAC,SAAS,QAAQ,KAAK,CAAC,IAAI,CAAC,KAAK,gBAAgB,aAAa,IAAI,aAAa,IAAI,aAAa,GAAG,EACjO,EAAE,EAAE,OAAO,KAAK,CAAC,gBAAgB,CAAC,KAAK,SAAS,KAAK,CAAC,gBAAgB,CAAC,SAAS,iBAAiB,EACjG,EAAE,EAAE,OAAO,KAAK,CAAC,KAAK,CAAC,KAAK,SAAS,KAAK,CAAC,KAAK,CAAC,SAAS,SAAS,KAAK,CAAC,IAAI,CAAC,KAAK,KAAK,EACxF,KAAK,EAAE,OAAO,KAAK,CAAC,KAAK,CAAC,KAAK,SAAS,KAAK,CAAC,KAAK,CAAC,SAAS,SAAS,KAAK,CAAC,IAAI,CAAC,KAAK,KAAK,EAC3F,MAAM,EAAE,OAAO,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,KAAK,SAAS,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,SAAS,iBAAiB,EAErG,OAAO,EAAE,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,EACxD,MAAM,EAAE,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,EACtD,SAAS,EAAE,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,EAC5D,OAAO,EAAE,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,EAExD,IAAI,EAAE,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EACpC,IAAI,EAAE,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,IAEtC,CAAC,OAAO,CAAC,SAAS;QACpB,CAAC,CAAC,MAAM,CAAC,WAAW,CAClB,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC;YAC9C,IAAI;YACJ,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;SAC1C,CAAC,CACD;QACH,CAAC,CAAC,EAAE,CAAC,EACL;AACH,CAAC;AAED,SAAS,QAAQ,CAAC,OAAoC;IACrD,OAAO;QACN,IAAI,EAAE,OAAO,OAAO,CAAC,IAAI,GAAG;QAC5B,KAAK,EAAE,OAAO,OAAO,CAAC,KAAK,GAAG;QAC9B,OAAO,EAAE,OAAO,OAAO,CAAC,GAAG,GAAG;QAC9B,IAAI,EAAE,OAAO,OAAO,CAAC,IAAI,GAAG;QAC5B,GAAG,EAAE,OAAO,OAAO,CAAC,GAAG,GAAG;KAC1B,CAAC;AACH,CAAC"}
+{"version":3,"file":"colors.js","sourceRoot":"","sources":["../../../../src/uno/theme/colors.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAG/C,MAAM,aAAa,GAAG,wCAAwC,CAAC;AAE/D,MAAM,UAAU,eAAe,CAAC,EAC/B,SAAS,GACQ;IACjB,uBACC,IAAI,EAAE,aAAa,EACnB,WAAW,EAAE,aAAa,EAC1B,OAAO,EAAE,cAAc,EAEvB,KAAK,EAAE,OAAO,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,GAAG,GAAG,EAChE,KAAK,EAAE,OAAO,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,IAAI,GAAG,EACjE,IAAI,EAAE,OAAO,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,GAAG;QAE9C,eAAe;QACf,QAAQ,EAAE,kBAAkB,KAAK,CAAC,gBAAgB,CAAC,QAAQ,QAAQ,KAAK,CAAC,gBAAgB,CAAC,KAAK,QAAQ,KAAK,CAAC,gBAAgB,CAAC,SAAS,QAAQ,KAAK,CAAC,IAAI,CAAC,KAAK,gBAAgB,aAAa,IAAI,aAAa,IAAI,aAAa,GAAG,EACjO,EAAE,EAAE,OAAO,KAAK,CAAC,gBAAgB,CAAC,KAAK,SAAS,KAAK,CAAC,gBAAgB,CAAC,SAAS,iBAAiB,EACjG,EAAE,EAAE,OAAO,KAAK,CAAC,KAAK,CAAC,KAAK,SAAS,KAAK,CAAC,KAAK,CAAC,SAAS,SAAS,KAAK,CAAC,IAAI,CAAC,KAAK,KAAK,EACxF,KAAK,EAAE,OAAO,KAAK,CAAC,KAAK,CAAC,KAAK,SAAS,KAAK,CAAC,KAAK,CAAC,SAAS,SAAS,KAAK,CAAC,IAAI,CAAC,KAAK,KAAK,EAC3F,MAAM,EAAE,OAAO,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,KAAK,SAAS,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,SAAS,iBAAiB,EAErG,OAAO,EAAE,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,EACxD,MAAM,EAAE,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,EACtD,SAAS,EAAE,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,EAC5D,OAAO,EAAE,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,EAExD,KAAK,EAAE,OAAO,KAAK,CAAC,IAAI,CAAC,WAAW,GAAG,EAEvC,IAAI,EAAE,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EACpC,IAAI,EAAE,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,IAEtC,CAAC,SAAS;QACZ,CAAC,CAAC,MAAM,CAAC,WAAW,CAClB,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC;YACtC,IAAI;YACJ,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;SAC1C,CAAC,CACD;QACH,CAAC,CAAC,EAAE,CAAC,EACL;AACH,CAAC;AAED,SAAS,QAAQ,CAAC,OAAoC;IACrD,OAAO;QACN,IAAI,EAAE,OAAO,OAAO,CAAC,IAAI,GAAG;QAC5B,KAAK,EAAE,OAAO,OAAO,CAAC,KAAK,GAAG;QAC9B,OAAO,EAAE,OAAO,OAAO,CAAC,GAAG,GAAG;QAC9B,IAAI,EAAE,OAAO,OAAO,CAAC,IAAI,GAAG;QAC5B,GAAG,EAAE,OAAO,OAAO,CAAC,GAAG,GAAG;KAC1B,CAAC;AACH,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@a-type/ui",
-  "version": "5.0.7",
+  "version": "5.0.9",
   "type": "module",
   "repository": {
     "url": "https://github.com/a-type/ui"

package/src/components/button/Button.tsx

@@ -93,7 +93,7 @@ export function ButtonRoot({
 		...props,
 		disabled: disabled || isLoading,
 		'data-disabled': visuallyDisabled,
-		'data-focus': visuallyFocused,
+		'data-focus-visible': visuallyFocused ? true : undefined,
 		'data-size': size,
 		'data-loading': isLoading,
 		'data-has-label': hasLabelChild,

package/src/components/button/classes.tsx

@@ -48,7 +48,8 @@ export function getButtonClassName({
 				emphasis === 'default',
 			'layer-components:(color-main-ink bg-transparent aria-pressed:bg-main-wash)':
 				emphasis === 'ghost',
-			'layer-components:bg-black': emphasis === 'contrast',
+			'layer-components:bg-black layer-variants:focus-visible:ring-gray-dark':
+				emphasis === 'contrast',
 		},
 
 		{
@@ -65,9 +66,7 @@ export function getButtonClassName({
 
 		'layer-components:hover:(ring-4 bg-main bg-lighten-2)',
 
-		'layer-components:focus:outline-off',
-		'layer-components:focus-visible:(outline-off ring-6 ring-accent)',
-		'layer-components:[&[data-focus=true]]:(outline-off ring-6 ring-accent)',
+		'layer-components:foc-effect-lg',
 
 		'layer-components:active:(ring-8 bg-darken-1)',
 

package/src/components/camera/Camera.tsx

@@ -214,11 +214,11 @@ export function CameraShutterButton({
 
 const StyledShutterButton = withClassName(
 	BaseButton,
-	'absolute bottom-3 left-1/2 -translate-x-1/2 w-16 h-16 bg-white rounded-full cursor-pointer border-2 border-black border-solid ring-2 ring-white opacity-80',
-	'hover:bg-gray-wash hover:opacity-100',
-	'focus-visible:bg-lighten-1',
-	'focus:ring-accent focus:outline-none focus:opacity-100',
-	'sm:w-8 sm:h-8',
+	'layer-components:(absolute bottom-3 left-1/2 h-16 w-16 cursor-pointer border-2 rounded-full border-solid opacity-80 ring-2 bg-white border-black ring-white -translate-x-1/2)',
+	'layer-components:(hover:opacity-100 hover:bg-gray-wash)',
+	'layer-components:focus-visible:bg-lighten-1',
+	'layer-components:(foc-effect focus:opacity-100)',
+	'layer-components:(sm:h-8 sm:w-8)',
 );
 
 export interface CameraDeviceSelectorProps {

package/src/components/card/Card.tsx

@@ -65,11 +65,11 @@ export function CardMain({
 				classNames(
 					'layer-components:cursor-pointer',
 					'layer-components:hover:(color-black bg-black/10)',
-					'layer-components:focus:outline-none',
-					'layer-components:focus-visible:(outline-none ring-4 ring-inset bg-black/10 ring-accent)',
-					'layer-components:data-[visually-focused]:(ring-4 ring-inset bg-black/10 ring-accent)',
+					'layer-components:foc-effect',
+					'layer-components:focus-visible:(ring-inset bg-black/10)',
+					'layer-components:data-[visually-focused]:(ring-inset bg-black/10)',
 					'layer-components:disabled:(cursor-default)',
-					'layer-components:data-[visually-disabled]:(cursor-default)',
+					'layer-components:data-[disabled]:(cursor-default)',
 				),
 			className,
 		),
@@ -85,8 +85,8 @@ export function CardMain({
 		state: {
 			interactive: !!isInteractive,
 			compact: !!compact,
-			visuallyFocused: !!visuallyFocused,
-			visuallyDisabled: !!visuallyDisabled,
+			focusVisible: !!visuallyFocused,
+			disabled: !!visuallyDisabled,
 		},
 	});
 

package/src/components/checkbox/Checkbox.tsx

@@ -30,13 +30,13 @@ export function CheckboxRoot({
 			{...props}
 			className={classNames(
 				'layer-components:(relative block h-28px w-28px flex-shrink-0 cursor-pointer border border-default rounded-lg shadow-sm transition-all bg-white)',
-				'layer-components:focus-visible:(outline-off ring-4 ring-accent)',
+				'layer-components:foc-effect',
 				checkedMode === 'faded'
 					? 'layer-components:data-[checked]:(animate-checkbox-fade animate-forwards bg-main)'
 					: 'layer-components:data-[checked]:(bg-main border-main-ink)',
 				'layer-components:[&:hover:not(:disabled)]:(ring-2 bg-lighten-2 ring-bg)',
 				'layer-components:[&:active:not(:disabled)]:(ring-4 bg-darken-1)',
-				'layer-components:[&:disabled]:(shadow-none bg-transparent border-gray-light)',
+				'layer-components:[&:disabled]:(bg-transparent border-gray-light shadow-none)',
 				className,
 			)}
 		/>

package/src/components/datePicker/Calendar.tsx

@@ -57,8 +57,8 @@ export const CalendarDay = withClassName(
 	BaseCalendarDay,
 	'layer-components:(relative mb--1px mr--1px border border-solid color-black bg-white border-transparent)',
 	'layer-components:(flex cursor-pointer items-center justify-center transition)',
-	'layer-components:data-[highlighted]:(z-1 ring-2 ring-accent)',
-	'layer-components:hover:(z-1 ring-2 ring-accent)',
+	'layer-components:data-[highlighted]:(z-1 outline-none ring-2 ring-focus)',
+	'layer-components:hover:ouline-none layer-components:hover:(z-1 ring-2 ring-focus)',
 	'layer-components:active:(rounded bg-main-light)',
 	'layer-components:[&[data-selected]]:(z-2 rounded bg-main)',
 	'layer-components:[&[data-in-range]]:(z-1 rounded-none bg-main-light)',

package/src/components/datePicker/DateRangePicker.tsx

@@ -14,9 +14,9 @@ import {
 
 const RangeLayout = withClassName(
 	'div',
-	'layer-components:(grid [grid-template-areas:"prevMonth_leftMonth_nextMonth""leftGrid_leftGrid_leftGrid"] [grid-template-columns:auto_1fr_auto])',
-	'layer-components:([grid-template-rows:auto_1fr] gap-2)',
-	'layer-components:sm:grid-areas-[prevMonth_leftMonth_rightMonth_nextMonth]-[leftGrid_leftGrid_rightGrid_rightGrid] sm:[grid-template-columns:auto_1fr_1fr_auto]',
+	'layer-components:(grid grid-cols-[auto_1fr_auto] grid-areas-[prevMonth_leftMonth_nextMonth]-[leftGrid_leftGrid_leftGrid])',
+	'layer-components:(grid-rows-[auto_1fr] gap-2)',
+	'sm:grid-cols-[auto_1fr_1fr_auto] layer-components:sm:grid-areas-[prevMonth_leftMonth_rightMonth_nextMonth]-[leftGrid_leftGrid_rightGrid_rightGrid]',
 );
 
 function DateRangePickerMonthControls() {

package/src/components/editableText/EditableText.tsx

@@ -107,7 +107,8 @@ export function EditableText({
 				inputClassName,
 				'layer-variants:(w-auto inline-flex items-center gap-sm rounded-md px-md text-left font-size-inherit color-inherit bg-transparent border-transparent shadow-none)',
 				'layer-variants:hover:(bg-main-light/80)',
-				'layer-variants:focus-visible:(outline-none ring-2 bg-main-light/80 ring-accent)',
+				'foc-effect',
+				'layer-variants:focus-visible:(bg-main-light/80)',
 				'cursor-pointer',
 				className,
 			)}

package/src/components/horizontalList/HorizontalList.tsx

@@ -167,8 +167,9 @@ export function HorizontalList({
 							emphasis="ghost"
 							className={clsx(
 								'layer-variants:(sticky left-0 top-2 z-1 flex-shrink-0)',
+								'ring-inset foc',
 								!open &&
-									'layer-variants:(h-full border-r rounded-none border-r-solid border-r-gray)',
+									'layer-variants:(h-full border-r rounded-l-sm rounded-r-none border-r-solid border-r-gray)',
 							)}
 						>
 							<Icon

package/src/components/input/Input.tsx

@@ -20,10 +20,10 @@ export const inputClassName = clsx(
 );
 
 const inputBorderClassName = clsx(
-	'layer-components:(min-w-60px flex flex-row items-center gap-xs border-1 rounded-lg border-solid text-md shadow-sm shadow-inset transition-shadow color-black bg-white border-black)',
+	'layer-components:(min-w-60px flex flex-row items-center gap-xs border-1 border-thin rounded-lg border-solid text-md shadow-sm shadow-inset transition-shadow color-black bg-white border-black)',
 	'layer-components:(w-max-content overflow-clip)',
 	'layer-components:[&:has(input:disabled),&:has(textarea:disabled)]:(bg-transparent border-gray shadow-none placeholder-gray-dark)',
-	'layer-components:[&:has(input:focus-visible),&:has(textarea:focus-visible)]:(outline-none ring ring-4 ring-accent)',
+	'layer-components:foc-contained',
 	'layer-variants:[&:has(input:focus[data-focus-clicked]),&:has(textarea:focus[data-focus-clicked])]:(outline-none ring ring-4 bg-lighten-3 ring-main-light)',
 	'layer-components:[&:has(input:hover),&:has(textarea:hover)]:border-black',
 	'layer-components:[&>.icon]:mx-sm',

package/src/components/lightbox/Lightbox.tsx

@@ -16,7 +16,7 @@ export const LightboxRoot = Dialog.Root;
 export const LightboxTrigger = withClassName(
 	Dialog.Trigger,
 	'layer-components:cursor-pointer',
-	'layer-components:focus-visible:(outline-none ring ring-accent)',
+	'foc-effect',
 );
 export const LightboxPortal = Dialog.Portal;
 export const LightboxTitle = () => (