reshaped 3.9.0-canary.1 → 3.9.0-canary.2

package/dist/themes/_generator/definitions/slate.js

@@ -1,5 +1,5 @@
-import reshapedDefinition from "./reshaped.js";
 import generateColors from "../tokens/color/utilities/generateColors.js";
+import reshapedDefinition from "./reshaped.js";
 const theme = {
     ...reshapedDefinition,
     color: generateColors(),

package/dist/themes/_generator/tokens/color/utilities/generateColors.d.ts

@@ -1,4 +1,4 @@
-import type { PassedThemeDefinition } from "../../types";
 import { type ColorValue, Hue } from "../color.types";
+import type { PassedThemeDefinition } from "../../types";
 declare const generateColors: (args?: Partial<Record<Hue, ColorValue>>) => NonNullable<PassedThemeDefinition["color"]>;
 export default generateColors;

package/dist/themes/_generator/tokens/color/utilities/generateMetaColors.d.ts

@@ -1,4 +1,4 @@
-import type * as T from "../../../types";
 import { PassedThemeDefinition } from "../../types";
+import type * as T from "../../../types";
 declare const generateMetaColors: (definition: PassedThemeDefinition, themeOptions?: T.PublicOptions["themeOptions"]) => PassedThemeDefinition["color"] | undefined;
 export default generateMetaColors;

package/dist/themes/_generator/tokens/color/utilities/generateMetaColors.js

@@ -1,7 +1,7 @@
 import { capitalize } from "../../../../../utilities/string.js";
 import { bgWithDynamicForeground } from "../../../constants.js";
-import { hexToOklch, oklchToRgb, tokenToOklchToken } from "./convert.js";
 import { getOnColor } from "./a11y.js";
+import { hexToOklch, oklchToRgb, tokenToOklchToken } from "./convert.js";
 const whiteColor = hexToOklch("#ffffff");
 const blackColor = hexToOklch("#000000");
 const generateMetaColors = (definition, themeOptions = {}) => {

package/dist/themes/_generator/tokens/font/font.types.d.ts

@@ -1,6 +1,6 @@
-import type * as TUnit from "../unit/unit.types";
-import type * as TFontWeight from "../fontWeight/fontWeight.types";
 import type * as TFontFamily from "../fontFamily/fontFamily.types";
+import type * as TFontWeight from "../fontWeight/fontWeight.types";
+import type * as TUnit from "../unit/unit.types";
 export type Name = "title1" | "title2" | "title3" | "title4" | "title5" | "title6" | "featured1" | "featured2" | "featured3" | "body1" | "body2" | "body3" | "caption1" | "caption2";
 export type Token = {
     fontSize: TUnit.Token;

package/dist/themes/_generator/tokens/transforms.js

@@ -4,9 +4,9 @@ import easing from "./easing/easing.transforms.js";
 import font from "./font/font.transforms.js";
 import fontFamily from "./fontFamily/fontFamily.transforms.js";
 import fontWeight from "./fontWeight/fontWeight.transforms.js";
+import radius from "./radius/radius.transforms.js";
 import shadow from "./shadow/shadow.transforms.js";
 import unit from "./unit/unit.transforms.js";
-import radius from "./radius/radius.transforms.js";
 import viewport from "./viewport/viewport.transforms.js";
 import zIndex from "./zIndex/zIndex.transforms.js";
 export const css = {

package/dist/themes/_generator/tokens/types.d.ts

@@ -1,15 +1,15 @@
+import { PartialDeep, PrivateOptions } from "../types";
+import * as TZIndex from "./zIndex/zIndex.types";
 import type * as TColor from "./color/color.types";
 import type * as TDuration from "./duration/duration.types";
 import type * as TEasing from "./easing/easing.types";
 import type * as TFont from "./font/font.types";
 import type * as TFontFamily from "./fontFamily/fontFamily.types";
 import type * as TFontWeight from "./fontWeight/fontWeight.types";
+import type * as TRadius from "./radius/radius.types";
 import type * as TShadow from "./shadow/shadow.types";
 import type * as TUnit from "./unit/unit.types";
-import type * as TRadius from "./radius/radius.types";
 import type * as TViewport from "./viewport/viewport.types";
-import * as TZIndex from "./zIndex/zIndex.types";
-import { PartialDeep, PrivateOptions } from "../types";
 export type TokenType = "fontFamily" | "fontWeight" | "unit" | "radius" | "viewport" | "font" | "color" | "duration" | "easing" | "shadow" | "zIndex";
 type TokenSet<Name extends string, Token> = Record<Name, Token> & {
     [tokenName: string]: Token;

package/dist/themes/_generator/transform.d.ts

@@ -1,5 +1,5 @@
-import type * as T from "./types";
 import type { PassedThemeDefinition, GeneratedThemeDefinition } from "./tokens/types";
+import type * as T from "./types";
 declare const transform: (name: string, definition: PassedThemeDefinition, options: T.PrivateOptions) => {
     variables: string;
     media: string | undefined;

package/dist/themes/_generator/transform.js

@@ -1,8 +1,8 @@
-import * as transforms from "./tokens/transforms.js";
+import { formatHex8, formatHex } from "culori/fn";
+import generateMetaColors from "./tokens/color/utilities/generateMetaColors.js";
 import { variablesTemplate, mediaTemplate } from "./tokens/css.js";
+import * as transforms from "./tokens/transforms.js";
 import { generateUnits } from "./tokens/unit/utilities/generate.js";
-import generateMetaColors from "./tokens/color/utilities/generateMetaColors.js";
-import { formatHex8, formatHex } from "culori/fn";
 const transform = (name, definition, options) => {
     const { isFragment, themeOptions } = options;
     const generatedUnits = generateUnits(definition);

package/dist/themes/index.d.ts

@@ -1,5 +1,5 @@
-import type * as T from "./_generator/types";
 import type { PassedThemeDefinition } from "./_generator/tokens/types";
+import type * as T from "./_generator/types";
 /**
  * Exported types
  */

package/dist/types/config.d.ts

@@ -1,5 +1,5 @@
-import type { PassedThemeDefinition } from "../themes/_generator/tokens/types";
 import type { HexColor, Hue, OklchColor } from "../themes/_generator/tokens/color/color.types";
+import type { PassedThemeDefinition } from "../themes/_generator/tokens/types";
 export type ReshapedConfig = {
     themes?: Record<string, PassedThemeDefinition>;
     themeFragments?: Record<string, PassedThemeDefinition>;

package/dist/utilities/a11y/TrapFocus.js

@@ -1,10 +1,10 @@
 var _a;
-import Chain from "../Chain.js";
 import * as keys from "../../constants/keys.js";
-import TrapScreenReader from "./TrapScreenReader.js";
-import { getActiveElement, getFocusableElements, focusElement, getFocusData } from "./focus.js";
+import Chain from "../Chain.js";
 import { getShadowRoot } from "../dom/index.js";
+import { getActiveElement, getFocusableElements, focusElement, getFocusData } from "./focus.js";
 import { checkKeyboardMode } from "./keyboardMode.js";
+import TrapScreenReader from "./TrapScreenReader.js";
 class TrapFocus {
     static chain = new Chain();
     #chainId;
@@ -45,7 +45,7 @@ class TrapFocus {
             target: isPrev ? "prev" : "next",
             options: {
                 additionalElement: includeTrigger ? this.#trigger : undefined,
-                circular: mode !== "action-menu" && mode !== "action-bar",
+                circular: true,
             },
         });
         // Release the trap when tab is used in navigation modes that support arrows

package/dist/utilities/scroll/lock.js

@@ -1,5 +1,5 @@
-import { isIOS } from "../platform.js";
 import { findClosestScrollableContainer } from "../dom/index.js";
+import { isIOS } from "../platform.js";
 import lockSafariScroll from "./lockSafari.js";
 import lockStandardScroll from "./lockStandard.js";
 let bodyLockedCount = 0;

package/dist/utilities/scroll/lockStandard.js

@@ -1,5 +1,5 @@
-import { getScrollbarWidth } from "./helpers.js";
 import { StyleCache } from "../css.js";
+import { getScrollbarWidth } from "./helpers.js";
 const styleCache = new StyleCache();
 const lockStandardScroll = (args) => {
     const { container } = args;

package/dist/utilities/storybook/Example.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import View from "../../components/View/index.js";
 import Text from "../../components/Text/index.js";
+import View from "../../components/View/index.js";
 const Example = (props) => {
     return (_jsxs(View, { gap: 3, attributes: props.title ? { style: { marginTop: -17 } } : undefined, children: [props.title && (_jsx(View, { bleed: 4, paddingInline: 4, paddingBlock: 3, backgroundColor: "neutral-faded", borderColor: "neutral-faded", position: "sticky", insetTop: 0, zIndex: 100, children: props.title })), props.children] }));
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "reshaped",
   "description": "Professionally crafted design system in React & Figma for building products of any scale and complexity",
-  "version": "3.9.0-canary.1",
+  "version": "3.9.0-canary.2",
   "license": "MIT",
   "email": "hello@reshaped.so",
   "homepage": "https://reshaped.so",
@@ -97,12 +97,14 @@
     "@types/react-dom": "19.2.2",
     "@vitejs/plugin-react": "5.1.0",
     "@vitest/browser": "4.0.4",
+    "@vitest/browser-playwright": "4.0.4",
     "@vitest/coverage-istanbul": "4.0.4",
     "@vitest/coverage-v8": "4.0.4",
-    "@vitest/browser-playwright": "4.0.4",
     "chromatic": "13.3.2",
     "eslint": "9.38.0",
     "eslint-config-prettier": "10.1.8",
+    "eslint-import-resolver-typescript": "^4.4.4",
+    "eslint-plugin-import": "2.32.0",
     "eslint-plugin-jsx-a11y": "6.10.2",
     "eslint-plugin-prettier": "5.5.4",
     "eslint-plugin-react": "7.37.5",