@blockle/blocks 0.20.0-alpha1 → 0.20.0-alpha1.0

package/dist/themes/momotaro/components/tooltip.css.cjs

@@ -1,21 +1,22 @@
 "use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const fileScope = require("@vanilla-extract/css/fileScope");
-const lib_css_style_style_cjs = require("../../../lib/css/style/style.cjs");
-const lib_theme_makeComponentTheme_cjs = require("../../../lib/theme/makeComponentTheme.cjs");
+const style = require("../../../lib/css/style/style.cjs");
+const makeComponentTheme = require("../../../lib/theme/makeComponentTheme.cjs");
 fileScope.setFileScope("src/themes/momotaro/components/tooltip.css.ts", "@blockle/blocks");
-const tooltip = lib_theme_makeComponentTheme_cjs.makeComponentTheme("tooltip", {
-  base: lib_css_style_style_cjs.style({
+const tooltip = makeComponentTheme.makeComponentTheme("tooltip", {
+  base: style.style({
     backgroundColor: "primary",
     padding: "small"
   }),
   variants: {
     colorScheme: {
-      primary: lib_css_style_style_cjs.style({
+      primary: style.style({
         backgroundColor: "rgba(0, 0, 0, 0.8)",
         boxShadow: "0 0 0 1px rgba(255, 255, 255, 0.1)",
         color: "white"
       }),
-      secondary: lib_css_style_style_cjs.style({
+      secondary: style.style({
         backgroundColor: "rgba(255, 255, 255, 0.8)",
         boxShadow: "0 0 0 1px rgba(0, 0, 0, 0.1)",
         color: "black"

package/dist/themes/momotaro/components/tooltip.css.d.ts

@@ -0,0 +1 @@
+export declare const tooltip: import('../../../lib/theme/makeComponentTheme').ComponentTheme<import('../../../lib/theme/componentThemes').TooltipTheme> | undefined;

package/dist/themes/momotaro/components/{tooltip.css.mjs → tooltip.css.js}

@@ -1,6 +1,6 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
-import { style } from "../../../lib/css/style/style.mjs";
-import { makeComponentTheme } from "../../../lib/theme/makeComponentTheme.mjs";
+import { style } from "../../../lib/css/style/style.js";
+import { makeComponentTheme } from "../../../lib/theme/makeComponentTheme.js";
 setFileScope("src/themes/momotaro/components/tooltip.css.ts", "@blockle/blocks");
 const tooltip = makeComponentTheme("tooltip", {
   base: style({

package/dist/themes/momotaro/components/transitions.cjs

@@ -1,3 +1,4 @@
 "use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const bounceOut = "cubic-bezier(.65,.36,.55,1.65)";
 exports.bounceOut = bounceOut;

package/dist/themes/momotaro/components/transitions.d.ts

@@ -0,0 +1 @@
+export declare const bounceOut = "cubic-bezier(.65,.36,.55,1.65)";

package/dist/themes/momotaro/index.d.ts

@@ -0,0 +1 @@
+export { momotaro } from './momotaro.css';

package/dist/themes/momotaro/momotaro.css.cjs

@@ -1,13 +1,14 @@
 "use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const fileScope = require("@vanilla-extract/css/fileScope");
-const lib_theme_makeTheme_cjs = require("../../lib/theme/makeTheme.cjs");
-const themes_momotaro_components_index_cjs = require("./components/index.cjs");
-const themes_momotaro_tokens_css_cjs = require("./tokens.css.cjs");
+const makeTheme = require("../../lib/theme/makeTheme.cjs");
+const index = require("./components/index.cjs");
+const tokens_css = require("./tokens.css.cjs");
 fileScope.setFileScope("src/themes/momotaro/momotaro.css.ts", "@blockle/blocks");
-const momotaro = lib_theme_makeTheme_cjs.makeTheme({
+const momotaro = makeTheme.makeTheme({
   name: "momotaro",
-  tokens: themes_momotaro_tokens_css_cjs.tokens,
-  components: themes_momotaro_components_index_cjs.components
+  tokens: tokens_css.tokens,
+  components: index.components
 });
 fileScope.endFileScope();
 exports.momotaro = momotaro;

package/dist/themes/momotaro/momotaro.css.d.ts

@@ -0,0 +1 @@
+export declare const momotaro: import('../../lib/theme/makeTheme').Theme;

package/dist/themes/momotaro/{momotaro.css.mjs → momotaro.css.js}

@@ -1,7 +1,7 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
-import { makeTheme } from "../../lib/theme/makeTheme.mjs";
-import { components } from "./components/index.mjs";
-import { tokens } from "./tokens.css.mjs";
+import { makeTheme } from "../../lib/theme/makeTheme.js";
+import { components } from "./components/index.js";
+import { tokens } from "./tokens.css.js";
 setFileScope("src/themes/momotaro/momotaro.css.ts", "@blockle/blocks");
 const momotaro = makeTheme({
   name: "momotaro",

package/dist/themes/momotaro/tokens.css.cjs

@@ -1,6 +1,7 @@
 "use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const fileScope = require("@vanilla-extract/css/fileScope");
-const lib_css_utils_cssUtils_cjs = require("../../lib/css/utils/cssUtils.cjs");
+const cssUtils = require("../../lib/css/utils/cssUtils.cjs");
 fileScope.setFileScope("src/themes/momotaro/tokens.css.ts", "@blockle/blocks");
 const tokens = {
   border: {
@@ -61,11 +62,11 @@ const tokens = {
       secondary: '"Rubik", sans-serif'
     },
     fontSize: {
-      xsmall: lib_css_utils_cssUtils_cjs.rem(12),
-      small: lib_css_utils_cssUtils_cjs.rem(14),
-      medium: lib_css_utils_cssUtils_cjs.rem(16),
-      large: lib_css_utils_cssUtils_cjs.rem(20),
-      xlarge: lib_css_utils_cssUtils_cjs.rem(24)
+      xsmall: cssUtils.rem(12),
+      small: cssUtils.rem(14),
+      medium: cssUtils.rem(16),
+      large: cssUtils.rem(20),
+      xlarge: cssUtils.rem(24)
     },
     fontWeight: {
       regular: 400,
@@ -73,11 +74,11 @@ const tokens = {
       strong: 700
     },
     lineHeight: {
-      xsmall: lib_css_utils_cssUtils_cjs.rem(16),
-      small: lib_css_utils_cssUtils_cjs.rem(20),
-      medium: lib_css_utils_cssUtils_cjs.rem(24),
-      large: lib_css_utils_cssUtils_cjs.rem(28),
-      xlarge: lib_css_utils_cssUtils_cjs.rem(32)
+      xsmall: cssUtils.rem(16),
+      small: cssUtils.rem(20),
+      medium: cssUtils.rem(24),
+      large: cssUtils.rem(28),
+      xlarge: cssUtils.rem(32)
     }
   }
 };

package/dist/themes/momotaro/tokens.css.d.ts

@@ -0,0 +1,2 @@
+import { ThemeTokens } from '../../lib/theme/tokensType';
+export declare const tokens: ThemeTokens;

package/dist/themes/momotaro/{tokens.css.mjs → tokens.css.js}

@@ -1,5 +1,5 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
-import { rem } from "../../lib/css/utils/cssUtils.mjs";
+import { rem } from "../../lib/css/utils/cssUtils.js";
 setFileScope("src/themes/momotaro/tokens.css.ts", "@blockle/blocks");
 const tokens = {
   border: {

package/dist/themes/momotaro.cjs

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const themes_momotaro_momotaro_css_cjs = require("./momotaro/momotaro.css.cjs");
-exports.momotaro = themes_momotaro_momotaro_css_cjs.momotaro;
+const momotaro_css = require("./momotaro/momotaro.css.cjs");
+exports.momotaro = momotaro_css.momotaro;

package/dist/themes/momotaro.js

@@ -0,0 +1,4 @@
+import { momotaro } from "./momotaro/momotaro.css.js";
+export {
+  momotaro
+};

package/package.json

@@ -1,41 +1,37 @@
 {
   "name": "@blockle/blocks",
-  "version": "0.20.0-alpha1",
+  "version": "0.20.0-alpha1.0",
   "description": "Blocks design system",
   "repository": "git@github.com:Blockle/blocks.git",
   "license": "MIT",
   "author": "Niek Saarberg <n.saarberg@gmail.com>",
   "sideEffects": [
-    "**/entries/reset.ts",
-    "**/reset/**",
-    "*.css.*",
-    "dist/reset.*",
-    "dist/side-effects/**"
+    "*.css.*"
   ],
   "type": "module",
   "exports": {
     ".": {
       "types": {
-        "import": "./dist/index.d.mts",
+        "import": "./dist/index.d.ts",
         "require": "./dist/index.d.ts"
       },
-      "import": "./dist/index.mjs",
+      "import": "./dist/index.js",
       "require": "./dist/index.cjs"
     },
     "./reset": {
       "types": {
-        "import": "./dist/reset.d.mts",
+        "import": "./dist/reset.d.ts",
         "require": "./dist/reset.d.ts"
       },
-      "import": "./dist/reset.mjs",
+      "import": "./dist/reset.js",
       "require": "./dist/reset.cjs"
     },
     "./themes/momotaro": {
       "types": {
-        "import": "./dist/themes/momotaro.d.mts",
+        "import": "./dist/themes/momotaro.d.ts",
         "require": "./dist/themes/momotaro.d.ts"
       },
-      "import": "./dist/themes/momotaro.mjs",
+      "import": "./dist/themes/momotaro.js",
       "require": "./dist/themes/momotaro.cjs"
     },
     "./package.json": "./package.json"
@@ -49,13 +45,13 @@
     "themes/momotaro"
   ],
   "scripts": {
-    "build": "crackle package && node ./scripts/use-client-fix.mjs",
+    "build": "vite build",
     "build-storybook": "storybook build",
     "changeset": "changeset",
     "coverage": "vitest run --coverage",
     "fix": "crackle fix",
     "lint": "biome format ./src",
-    "lint:fix": "biome format --write ./src",
+    "format": "biome format --write ./src",
     "release": "npm run ts && npm run test && npm run build && changeset publish",
     "storybook": "storybook dev -p 6006 --no-open",
     "test": "vitest --silent",
@@ -68,8 +64,6 @@
     "@biomejs/biome": "1.9.4",
     "@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.5.3",
     "@storybook/addon-coverage": "^1.0.5",
     "@storybook/addon-essentials": "^8.5.3",
@@ -88,6 +82,7 @@
     "@vanilla-extract/css-utils": "^0.1.4",
     "@vanilla-extract/sprinkles": "^1.6.2",
     "@vanilla-extract/vite-plugin": "^5.0.0",
+    "@vitejs/plugin-react-swc": "^3.8.0",
     "@vitest/coverage-v8": "^3.0.4",
     "autoprefixer": "^10.4.19",
     "cross-env": "^7.0.3",
@@ -95,8 +90,12 @@
     "prop-types": "^15.8.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
+    "rollup-preserve-directives": "^1.1.3",
     "storybook": "^8.5.3",
     "typescript": "^5.7.3",
+    "vite": "^6.1.0",
+    "vite-plugin-dts": "^4.5.0",
+    "vite-plugin-externalize-deps": "^0.9.0",
     "vitest": "^3.0.4"
   },
   "peerDependencies": {

package/dist/components/accessibility/VisuallyHidden/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/accessibility/VisuallyHidden/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/display/Divider/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/display/Divider/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/feedback/Progress/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/feedback/Progress/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/feedback/Spinner/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/feedback/Spinner/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/form/Button/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/form/Button/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/form/Checkbox/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/form/Checkbox/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/form/Input/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/form/Input/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/form/Label/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/form/Label/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/form/Radio/RadioGroup.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/form/Radio/RadioGroup.mjs

@@ -1 +0,0 @@
-

package/dist/components/form/Radio/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/form/Radio/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/form/Select/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/form/Select/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/form/Slider/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/form/Slider/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/form/Switch/index.cjs

@@ -1 +0,0 @@
-"use strict";

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

@@ -1 +0,0 @@
-

package/dist/components/layout/Box/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/layout/Box/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/layout/Inline/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/layout/Inline/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/layout/Stack/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/layout/Stack/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/navigation/Link/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/navigation/Link/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/other/BlocksProvider/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/other/BlocksProvider/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/other/Portal/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/other/Portal/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/overlay/Dialog/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/overlay/Dialog/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/overlay/Tooltip/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/overlay/Tooltip/index.mjs

@@ -1 +0,0 @@
-

package/dist/components/typography/Heading/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/components/typography/Heading/index.mjs

@@ -1 +0,0 @@
-

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

@@ -1 +0,0 @@
-"use strict";

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

@@ -1 +0,0 @@
-

package/dist/hooks/useIsomorphicLayoutEffect/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/hooks/useIsomorphicLayoutEffect/index.mjs

@@ -1 +0,0 @@
-

package/dist/hooks/useKeyboard/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/hooks/useKeyboard/index.mjs

@@ -1 +0,0 @@
-

package/dist/hooks/useLayer/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/hooks/useLayer/index.mjs

@@ -1 +0,0 @@
-

package/dist/hooks/usePreventBodyScroll/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/hooks/usePreventBodyScroll/index.mjs

@@ -1 +0,0 @@
-

package/dist/hooks/useRestoreFocus/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/hooks/useRestoreFocus/index.mjs

@@ -1 +0,0 @@
-

package/dist/hooks/useRootAriaHidden/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/hooks/useRootAriaHidden/index.mjs

@@ -1 +0,0 @@
-

package/dist/hooks/useVisibilityState/index.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/hooks/useVisibilityState/index.mjs

@@ -1 +0,0 @@
-

package/dist/index.d.mts

@@ -1 +0,0 @@
-export { BlocksProvider, BlocksProviderProps, Box, BoxProps, Button, ButtonProps, Checkbox, CheckboxProps, Dialog, DialogProps, Divider, DividerProps, Heading, HeadingProps, Inline, InlineProps, Input, InputProps, Label, LabelProps, Link, LinkProps, Portal, PortalProps, Progress, ProgressProps, Radio, RadioProps, Select, SelectProps, Slider, SliderProps, Spinner, SpinnerProps, Stack, StackProps, Switch, SwitchProps, Text, TextProps, ThemeComponentsStyles, ThemeTokens, Tooltip, TooltipProps, VisuallyHidden, VisuallyHiddenProps, atoms, classnames, createAsChildTemplate, getTheme, makeComponentTheme, makeTheme, minMediaQuery, setTheme, style, useIsomorphicLayoutEffect, useKeyboard, usePreventBodyScroll, useRootAriaHidden, vars } from './momotaro.chunk.js';

package/dist/index.mjs

@@ -1,73 +0,0 @@
-import { minMediaQuery } from "./lib/css/atoms/breakpoints.mjs";
-import { style } from "./lib/css/style/style.mjs";
-import { makeComponentTheme } from "./lib/theme/makeComponentTheme.mjs";
-import { makeTheme } from "./lib/theme/makeTheme.mjs";
-import { vars } from "./lib/theme/vars.css.mjs";
-import { createAsChildTemplate } from "./lib/asChildRenderer/createAsChildTemplate.mjs";
-import { getTheme, setTheme } from "./lib/theme/store/theme.mjs";
-import { classnames } from "./lib/utils/classnames.mjs";
-import { atoms } from "./lib/css/atoms/sprinkles.css.mjs";
-import { VisuallyHidden } from "./components/accessibility/VisuallyHidden/VisuallyHidden.mjs";
-import { Divider } from "./components/display/Divider/Divider.mjs";
-import { Progress } from "./components/feedback/Progress/Progress.mjs";
-import { Spinner } from "./components/feedback/Spinner/Spinner.mjs";
-import { Button } from "./components/form/Button/Button.mjs";
-import { Checkbox } from "./components/form/Checkbox/Checkbox.mjs";
-import { Input } from "./components/form/Input/Input.mjs";
-import { Label } from "./components/form/Label/Label.mjs";
-import { Radio } from "./components/form/Radio/Radio.mjs";
-import { Select } from "./components/form/Select/Select.mjs";
-import { Slider } from "./components/form/Slider/Slider.mjs";
-import { Switch } from "./components/form/Switch/Switch.mjs";
-import { Box } from "./components/layout/Box/Box.mjs";
-import { Inline } from "./components/layout/Inline/Inline.mjs";
-import { Stack } from "./components/layout/Stack/Stack.mjs";
-import { Link } from "./components/navigation/Link/Link.mjs";
-import { BlocksProvider } from "./components/other/BlocksProvider/BlocksProvider.mjs";
-import { Portal } from "./components/other/Portal/Portal.mjs";
-import { Dialog } from "./components/overlay/Dialog/Dialog.mjs";
-import { Tooltip } from "./components/overlay/Tooltip/Tooltip.mjs";
-import { Heading } from "./components/typography/Heading/Heading.mjs";
-import { Text } from "./components/typography/Text/Text.mjs";
-import { useIsomorphicLayoutEffect } from "./hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.mjs";
-import { useKeyboard } from "./hooks/useKeyboard/useKeyboard.mjs";
-import { usePreventBodyScroll } from "./hooks/usePreventBodyScroll/usePreventBodyScroll.mjs";
-import { useRootAriaHidden } from "./hooks/useRootAriaHidden/useRootAriaHidden.mjs";
-export {
-  BlocksProvider,
-  Box,
-  Button,
-  Checkbox,
-  Dialog,
-  Divider,
-  Heading,
-  Inline,
-  Input,
-  Label,
-  Link,
-  Portal,
-  Progress,
-  Radio,
-  Select,
-  Slider,
-  Spinner,
-  Stack,
-  Switch,
-  Text,
-  Tooltip,
-  VisuallyHidden,
-  atoms,
-  classnames,
-  createAsChildTemplate,
-  getTheme,
-  makeComponentTheme,
-  makeTheme,
-  minMediaQuery,
-  setTheme,
-  style,
-  useIsomorphicLayoutEffect,
-  useKeyboard,
-  usePreventBodyScroll,
-  useRootAriaHidden,
-  vars
-};

package/dist/lib/css/atoms/atoms.cjs

@@ -1,2 +0,0 @@
-"use strict";
-require("./sprinkles.css.cjs");

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

@@ -1 +0,0 @@
-import "./sprinkles.css.mjs";

package/dist/lib/css/atoms/index.cjs

@@ -1,2 +0,0 @@
-"use strict";
-require("./sprinkles.css.cjs");

package/dist/lib/css/atoms/index.mjs

@@ -1 +0,0 @@
-import "./sprinkles.css.mjs";