@blockle/blocks 0.18.3 → 0.19.0

package/dist/styles/components/form/Switch/Switch.mjs

@@ -1,9 +1,16 @@
 import { jsx, Fragment, jsxs } from "react/jsx-runtime";
-import { forwardRef, useState, useEffect, useCallback } from "react";
+import { useState, useEffect, useCallback } from "react";
 import { classnames } from "../../Accessibility/VisuallyHidden/VisuallyHidden.mjs";
-import { container, input } from "./switch.css.mjs";
+import { input, container } from "./switch.css.mjs";
 import { useComponentStyles } from "../../display/Divider/Divider.mjs";
-const Switch = forwardRef(function Switch2({ className, checked, onChange, defaultChecked, ...restProps }, ref) {
+const Switch = ({
+  checked,
+  className,
+  defaultChecked,
+  onChange,
+  ref,
+  ...restProps
+}) => {
   const [isChecked, setIsChecked] = useState(defaultChecked || checked || false);
   const baseClassName = useComponentStyles("switch", { base: true });
   const sliderClassName = useComponentStyles("switch", { slider: true }, false);
@@ -57,7 +64,7 @@ const Switch = forwardRef(function Switch2({ className, checked, onChange, defau
       ]
     }
   ) });
-});
+};
 export {
   Switch
 };

package/dist/styles/components/typography/Text/Text.cjs

@@ -1,10 +1,20 @@
 "use strict";
 const jsxRuntime = require("react/jsx-runtime");
-const react = require("react");
 const styles_components_Accessibility_VisuallyHidden_VisuallyHidden_cjs = require("../../Accessibility/VisuallyHidden/VisuallyHidden.cjs");
 const styles_components_typography_Text_text_css_cjs = require("./text.css.cjs");
 const styles_components_display_Divider_Divider_cjs = require("../../display/Divider/Divider.cjs");
-const Text = react.forwardRef(function Text2({ tag: Tag = "span", asChild, children, className, ...restProps }, ref) {
-  return /* @__PURE__ */ jsxRuntime.jsx(styles_components_display_Divider_Divider_cjs.Box, { ref, asChild: true, className: styles_components_Accessibility_VisuallyHidden_VisuallyHidden_cjs.classnames(styles_components_typography_Text_text_css_cjs.text, className), ...restProps, children: asChild ? children : /* @__PURE__ */ jsxRuntime.jsx(Tag, { children }) });
-});
+const Text = ({
+  asChild,
+  children,
+  className,
+  ref,
+  tag,
+  ...restProps
+}) => {
+  const Component = tag ?? "span";
+  return /* @__PURE__ */ jsxRuntime.jsx(styles_components_display_Divider_Divider_cjs.Box, { asChild: true, className: styles_components_Accessibility_VisuallyHidden_VisuallyHidden_cjs.classnames(styles_components_typography_Text_text_css_cjs.text, className), ...restProps, children: asChild ? children : (
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, children })
+  ) });
+};
 exports.Text = Text;

package/dist/styles/components/typography/Text/Text.mjs

@@ -1,11 +1,21 @@
 import { jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { classnames } from "../../Accessibility/VisuallyHidden/VisuallyHidden.mjs";
 import { text } from "./text.css.mjs";
 import { Box } from "../../display/Divider/Divider.mjs";
-const Text = forwardRef(function Text2({ tag: Tag = "span", asChild, children, className, ...restProps }, ref) {
-  return /* @__PURE__ */ jsx(Box, { ref, asChild: true, className: classnames(text, className), ...restProps, children: asChild ? children : /* @__PURE__ */ jsx(Tag, { children }) });
-});
+const Text = ({
+  asChild,
+  children,
+  className,
+  ref,
+  tag,
+  ...restProps
+}) => {
+  const Component = tag ?? "span";
+  return /* @__PURE__ */ jsx(Box, { asChild: true, className: classnames(text, className), ...restProps, children: asChild ? children : (
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    /* @__PURE__ */ jsx(Component, { ref, children })
+  ) });
+};
 export {
   Text
 };

package/dist/styles/lib/css/atoms/sprinkles.css.mjs

@@ -1,7 +1,7 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
 import { defineProperties, createSprinkles } from "@vanilla-extract/sprinkles";
 import { unresponsiveProperties, responsiveProperties } from "./atomicProperties.mjs";
-import { minMediaQuery, breakpointNames } from "./breakpoints.mjs";
+import { breakpointNames, minMediaQuery } from "./breakpoints.mjs";
 setFileScope("src/lib/css/atoms/sprinkles.css.ts", "@blockle/blocks");
 const unresponsiveAtomicProperties = defineProperties({
   properties: unresponsiveProperties,

package/dist/styles/themes/momotaro/components/button.css.mjs

@@ -3,7 +3,7 @@ import { createVar } from "@vanilla-extract/css";
 import { style } from "../../../lib/css/style/style.mjs";
 import { makeComponentTheme } from "../../../lib/theme/makeComponentTheme.mjs";
 import { vars } from "../../../lib/theme/vars.css.mjs";
-import { clickable, focusRingColor } from "./helpers.css.mjs";
+import { focusRingColor, clickable } from "./helpers.css.mjs";
 setFileScope("src/themes/momotaro/components/button.css.ts", "@blockle/blocks");
 const intentColor = createVar("intentColor");
 const hoverBackgroundColor = createVar("hoverBackgroundColor");

package/dist/styles/themes/momotaro/components/helpers.css.mjs

@@ -1,5 +1,5 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
-import { createVar, style, fallbackVar } from "@vanilla-extract/css";
+import { style, fallbackVar, createVar } from "@vanilla-extract/css";
 import { vars } from "../../../lib/theme/vars.css.mjs";
 setFileScope("src/themes/momotaro/components/helpers.css.ts", "@blockle/blocks");
 const focusRingColor = createVar("focusRingColor");

package/dist/styles/themes/momotaro/components/progress.css.mjs

@@ -1,5 +1,5 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
-import { keyframes, style } from "@vanilla-extract/css";
+import { style, keyframes } from "@vanilla-extract/css";
 import { makeComponentTheme } from "../../../lib/theme/makeComponentTheme.mjs";
 import { vars } from "../../../lib/theme/vars.css.mjs";
 import { atoms } from "../../../lib/css/atoms/sprinkles.css.mjs";

package/dist/styles/themes/momotaro/components/spinner.css.mjs

@@ -1,5 +1,5 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
-import { keyframes, style } from "@vanilla-extract/css";
+import { style, keyframes } from "@vanilla-extract/css";
 import { makeComponentTheme } from "../../../lib/theme/makeComponentTheme.mjs";
 setFileScope("src/themes/momotaro/components/spinner.css.ts", "@blockle/blocks");
 const spinAnimation = keyframes({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blockle/blocks",
-  "version": "0.18.3",
+  "version": "0.19.0",
   "description": "Blocks design system",
   "repository": "git@github.com:Blockle/blocks.git",
   "license": "MIT",
@@ -57,42 +57,39 @@
     "lint": "eslint .",
     "release": "npm run ts && npm run test && npm run build && changeset publish",
     "storybook": "storybook dev -p 6006 --no-open",
-    "test": "vitest --silent # ignore warnings till js-dom can parse new css features",
+    "test": "vitest --silent",
     "ts": "tsc --noemit --project ./tsconfig.json"
   },
   "resolutions": {
     "string-width": "^4.2.2"
   },
-  "dependencies": {
-    "npm": "^10.8.1"
-  },
   "devDependencies": {
-    "@changesets/cli": "^2.27.5",
-    "@chromatic-com/storybook": "^2.0.2",
+    "@changesets/cli": "^2.27.12",
+    "@chromatic-com/storybook": "^3.2.4",
     "@crackle/cli": "^0.15.5",
     "@crackle/core": "^0.33.3",
-    "@storybook/addon-a11y": "^8.3.0",
-    "@storybook/addon-coverage": "^1.0.4",
-    "@storybook/addon-essentials": "^8.3.0",
-    "@storybook/addon-interactions": "^8.3.0",
-    "@storybook/addon-links": "^8.3.0",
-    "@storybook/blocks": "^8.3.0",
-    "@storybook/preview-api": "^8.3.0",
-    "@storybook/react": "^8.3.0",
-    "@storybook/react-vite": "^8.3.0",
-    "@storybook/test": "^8.3.0",
-    "@testing-library/jest-dom": "^6.4.5",
-    "@testing-library/react": "^16.0.0",
+    "@storybook/addon-a11y": "^8.5.3",
+    "@storybook/addon-coverage": "^1.0.5",
+    "@storybook/addon-essentials": "^8.5.3",
+    "@storybook/addon-interactions": "^8.5.3",
+    "@storybook/addon-links": "^8.5.3",
+    "@storybook/blocks": "^8.5.3",
+    "@storybook/preview-api": "^8.5.3",
+    "@storybook/react": "^8.5.3",
+    "@storybook/react-vite": "^8.5.3",
+    "@storybook/test": "^8.5.3",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.2.0",
     "@types/eslint": "^8.56.12",
-    "@types/react": "^18.3.3",
-    "@types/react-dom": "^18.3.0",
+    "@types/react": "^19.0.8",
+    "@types/react-dom": "^19.0.3",
     "@typescript-eslint/eslint-plugin": "^7.18.0",
     "@typescript-eslint/parser": "^7.18.0",
-    "@vanilla-extract/css": "^1.15.2",
+    "@vanilla-extract/css": "^1.17.1",
     "@vanilla-extract/css-utils": "^0.1.4",
     "@vanilla-extract/sprinkles": "^1.6.2",
-    "@vanilla-extract/vite-plugin": "^4.0.10",
-    "@vitest/coverage-v8": "^2.0.5",
+    "@vanilla-extract/vite-plugin": "^5.0.0",
+    "@vitest/coverage-v8": "^3.0.4",
     "autoprefixer": "^10.4.19",
     "cross-env": "^7.0.3",
     "eslint": "^8.57.0",
@@ -103,19 +100,22 @@
     "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-storybook": "^0.8.0",
     "eslint-plugin-unicorn": "^53.0.0",
-    "jsdom": "^25.0.0",
+    "jsdom": "^26.0.0",
     "prettier": "^3.3.1",
     "prop-types": "^15.8.1",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "storybook": "^8.3.0",
-    "typescript": "^5.4.5",
-    "vitest": "^2.0.5"
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "storybook": "^8.5.3",
+    "typescript": "^5.7.3",
+    "vitest": "^3.0.4"
   },
   "peerDependencies": {
-    "@vanilla-extract/css": "^1.14",
-    "@vanilla-extract/sprinkles": "^1.6",
-    "react": ">=18",
-    "react-dom": ">=^18"
+    "@vanilla-extract/css": ">=1.14",
+    "@vanilla-extract/sprinkles": ">=1.6",
+    "react": ">=19.0.0",
+    "react-dom": ">=19.0.0"
+  },
+  "overrides": {
+    "nwsapi": "2.2.2"
   }
 }