@blockle/blocks 0.8.8 → 0.8.10

package/dist/styles/components/{Dialog → overlay/Dialog}/dialog.css.mjs

@@ -1,7 +1,7 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
 import { style } from "@vanilla-extract/css";
-import { blocksLayer } from "../../lib/css/layers/layers.css.mjs";
-setFileScope("src/components/Dialog/dialog.css.ts?used", "blocks");
+import { blocksLayer } from "../../../lib/css/layers/layers.css.mjs";
+setFileScope("src/components/overlay/Dialog/dialog.css.ts", "blocks");
 const backdrop = style({
   "@layer": {
     [blocksLayer]: {

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

@@ -0,0 +1,14 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const styles_components_display_Divider_Divider_cjs = require("../../display/Divider/Divider.cjs");
+const styles_components_typography_Heading_heading_css_cjs = require("./heading.css.cjs");
+const Heading = ({
+  className,
+  level = 1,
+  children,
+  ...restProps
+}) => {
+  const Tag = `h${level}`;
+  return /* @__PURE__ */ jsxRuntime.jsx(styles_components_display_Divider_Divider_cjs.Box, { asChild: true, className: styles_components_display_Divider_Divider_cjs.classnames(styles_components_typography_Heading_heading_css_cjs.heading, className), ...restProps, children: /* @__PURE__ */ jsxRuntime.jsx(Tag, { children }) });
+};
+exports.Heading = Heading;

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

@@ -0,0 +1,15 @@
+import { jsx } from "react/jsx-runtime";
+import { Box, classnames } from "../../display/Divider/Divider.mjs";
+import { heading } from "./heading.css.mjs";
+const Heading = ({
+  className,
+  level = 1,
+  children,
+  ...restProps
+}) => {
+  const Tag = `h${level}`;
+  return /* @__PURE__ */ jsx(Box, { asChild: true, className: classnames(heading, className), ...restProps, children: /* @__PURE__ */ jsx(Tag, { children }) });
+};
+export {
+  Heading
+};

package/dist/styles/components/{Heading → typography/Heading}/heading.css.cjs

@@ -1,8 +1,8 @@
 "use strict";
 const fileScope = require("@vanilla-extract/css/fileScope");
 const css = require("@vanilla-extract/css");
-const styles_lib_css_layers_layers_css_cjs = require("../../lib/css/layers/layers.css.cjs");
-fileScope.setFileScope("src/components/Heading/heading.css.ts?used", "blocks");
+const styles_lib_css_layers_layers_css_cjs = require("../../../lib/css/layers/layers.css.cjs");
+fileScope.setFileScope("src/components/typography/Heading/heading.css.ts", "blocks");
 const heading = css.style({
   "@layer": {
     [styles_lib_css_layers_layers_css_cjs.blocksLayer]: {

package/dist/styles/components/{Heading → typography/Heading}/heading.css.mjs

@@ -1,7 +1,7 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
 import { style } from "@vanilla-extract/css";
-import { blocksLayer } from "../../lib/css/layers/layers.css.mjs";
-setFileScope("src/components/Heading/heading.css.ts?used", "blocks");
+import { blocksLayer } from "../../../lib/css/layers/layers.css.mjs";
+setFileScope("src/components/typography/Heading/heading.css.ts", "blocks");
 const heading = style({
   "@layer": {
     [blocksLayer]: {

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

@@ -0,0 +1,9 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const styles_components_display_Divider_Divider_cjs = require("../../display/Divider/Divider.cjs");
+const styles_components_typography_Text_text_css_cjs = require("./text.css.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_display_Divider_Divider_cjs.classnames(styles_components_typography_Text_text_css_cjs.text, className), ...restProps, children: asChild ? children : /* @__PURE__ */ jsxRuntime.jsx(Tag, { children }) });
+});
+exports.Text = Text;

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

@@ -0,0 +1,10 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { Box, classnames } from "../../display/Divider/Divider.mjs";
+import { text } from "./text.css.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 }) });
+});
+export {
+  Text
+};

package/dist/styles/components/{Text → typography/Text}/text.css.cjs

@@ -1,8 +1,8 @@
 "use strict";
 const fileScope = require("@vanilla-extract/css/fileScope");
 const css = require("@vanilla-extract/css");
-const styles_lib_css_layers_layers_css_cjs = require("../../lib/css/layers/layers.css.cjs");
-fileScope.setFileScope("src/components/Text/text.css.ts?used", "blocks");
+const styles_lib_css_layers_layers_css_cjs = require("../../../lib/css/layers/layers.css.cjs");
+fileScope.setFileScope("src/components/typography/Text/text.css.ts", "blocks");
 const text = css.style({
   "@layer": {
     [styles_lib_css_layers_layers_css_cjs.blocksLayer]: {

package/dist/styles/components/{Text → typography/Text}/text.css.mjs

@@ -1,7 +1,7 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
 import { style } from "@vanilla-extract/css";
-import { blocksLayer } from "../../lib/css/layers/layers.css.mjs";
-setFileScope("src/components/Text/text.css.ts?used", "blocks");
+import { blocksLayer } from "../../../lib/css/layers/layers.css.mjs";
+setFileScope("src/components/typography/Text/text.css.ts", "blocks");
 const text = style({
   "@layer": {
     [blocksLayer]: {

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

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

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

@@ -0,0 +1 @@
+

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

@@ -3,7 +3,7 @@ const fileScope = require("@vanilla-extract/css/fileScope");
 const sprinkles = require("@vanilla-extract/sprinkles");
 const styles_lib_css_atoms_atomicProperties_cjs = require("./atomicProperties.cjs");
 const styles_lib_css_atoms_breakpoints_cjs = require("./breakpoints.cjs");
-fileScope.setFileScope("src/lib/css/atoms/sprinkles.css.ts?used", "blocks");
+fileScope.setFileScope("src/lib/css/atoms/sprinkles.css.ts", "blocks");
 const unresponsiveAtomicProperties = sprinkles.defineProperties({
   properties: styles_lib_css_atoms_atomicProperties_cjs.unresponsiveProperties,
   shorthands: {
@@ -36,10 +36,6 @@ const responsiveAtomicProperties = sprinkles.defineProperties({
     placeItems: ["justifyContent", "alignItems"]
   }
 });
-const atoms = sprinkles.createSprinkles(
-  unresponsiveAtomicProperties,
-  responsiveAtomicProperties
-  // colorAtomicProperties,
-);
+const atoms = sprinkles.createSprinkles(unresponsiveAtomicProperties, responsiveAtomicProperties);
 fileScope.endFileScope();
 exports.atoms = atoms;

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

@@ -2,7 +2,7 @@ import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
 import { defineProperties, createSprinkles } from "@vanilla-extract/sprinkles";
 import { unresponsiveProperties, responsiveProperties } from "./atomicProperties.mjs";
 import { breakpointQuery, breakpointNames } from "./breakpoints.mjs";
-setFileScope("src/lib/css/atoms/sprinkles.css.ts?used", "blocks");
+setFileScope("src/lib/css/atoms/sprinkles.css.ts", "blocks");
 const unresponsiveAtomicProperties = defineProperties({
   properties: unresponsiveProperties,
   shorthands: {
@@ -35,11 +35,7 @@ const responsiveAtomicProperties = defineProperties({
     placeItems: ["justifyContent", "alignItems"]
   }
 });
-const atoms = createSprinkles(
-  unresponsiveAtomicProperties,
-  responsiveAtomicProperties
-  // colorAtomicProperties,
-);
+const atoms = createSprinkles(unresponsiveAtomicProperties, responsiveAtomicProperties);
 endFileScope();
 export {
   atoms

package/dist/styles/lib/css/layers/layers.css.cjs

@@ -1,7 +1,7 @@
 "use strict";
 const fileScope = require("@vanilla-extract/css/fileScope");
 const css = require("@vanilla-extract/css");
-fileScope.setFileScope("src/lib/css/layers/layers.css.ts?used", "blocks");
+fileScope.setFileScope("src/lib/css/layers/layers.css.ts", "blocks");
 const blocksLayer = css.layer("blockle-blocks");
 fileScope.endFileScope();
 exports.blocksLayer = blocksLayer;

package/dist/styles/lib/css/layers/layers.css.mjs

@@ -1,6 +1,6 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
 import { layer } from "@vanilla-extract/css";
-setFileScope("src/lib/css/layers/layers.css.ts?used", "blocks");
+setFileScope("src/lib/css/layers/layers.css.ts", "blocks");
 const blocksLayer = layer("blockle-blocks");
 endFileScope();
 export {

package/dist/styles/lib/theme/vars.css.cjs

@@ -3,7 +3,7 @@ const fileScope = require("@vanilla-extract/css/fileScope");
 const css = require("@vanilla-extract/css");
 const styles_lib_theme_makeVanillaTheme_cjs = require("./makeVanillaTheme.cjs");
 const styles_lib_theme_tokens_cjs = require("./tokens.cjs");
-fileScope.setFileScope("src/lib/theme/vars.css.ts?used", "blocks");
+fileScope.setFileScope("src/lib/theme/vars.css.ts", "blocks");
 const vars = css.createThemeContract(styles_lib_theme_makeVanillaTheme_cjs.makeVanillaTheme(styles_lib_theme_tokens_cjs.tokens));
 fileScope.endFileScope();
 exports.vars = vars;

package/dist/styles/lib/theme/vars.css.mjs

@@ -2,7 +2,7 @@ import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
 import { createThemeContract } from "@vanilla-extract/css";
 import { makeVanillaTheme } from "./makeVanillaTheme.mjs";
 import { tokens } from "./tokens.mjs";
-setFileScope("src/lib/theme/vars.css.ts?used", "blocks");
+setFileScope("src/lib/theme/vars.css.ts", "blocks");
 const vars = createThemeContract(makeVanillaTheme(tokens));
 endFileScope();
 export {

package/dist/styles/lib/utils/atom-props.cjs

@@ -0,0 +1,15 @@
+"use strict";
+const styles_lib_css_atoms_sprinkles_css_cjs = require("../css/atoms/sprinkles.css.cjs");
+function getAtomsAndProps(props) {
+  const atomProps = {};
+  const otherProps = {};
+  for (const [name, value] of Object.entries(props)) {
+    if (styles_lib_css_atoms_sprinkles_css_cjs.atoms.properties.has(name)) {
+      atomProps[name] = value;
+    } else {
+      otherProps[name] = value;
+    }
+  }
+  return [atomProps, otherProps];
+}
+exports.getAtomsAndProps = getAtomsAndProps;

package/dist/styles/lib/utils/atom-props.mjs

@@ -0,0 +1,16 @@
+import { atoms } from "../css/atoms/sprinkles.css.mjs";
+function getAtomsAndProps(props) {
+  const atomProps = {};
+  const otherProps = {};
+  for (const [name, value] of Object.entries(props)) {
+    if (atoms.properties.has(name)) {
+      atomProps[name] = value;
+    } else {
+      otherProps[name] = value;
+    }
+  }
+  return [atomProps, otherProps];
+}
+export {
+  getAtomsAndProps
+};

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

@@ -5,7 +5,7 @@ const styles_lib_css_style_style_cjs = require("../../../lib/css/style/style.cjs
 const styles_lib_theme_makeComponentTheme_cjs = require("../../../lib/theme/makeComponentTheme.cjs");
 const styles_lib_theme_vars_css_cjs = require("../../../lib/theme/vars.css.cjs");
 const styles_themes_momotaro_components_helpers_css_cjs = require("./helpers.css.cjs");
-fileScope.setFileScope("src/themes/momotaro/components/button.css.ts?used", "blocks");
+fileScope.setFileScope("src/themes/momotaro/components/button.css.ts", "blocks");
 const intentColor = css.createVar("intentColor");
 const hoverBackgroundColor = css.createVar("hoverBackgroundColor");
 const button = styles_lib_theme_makeComponentTheme_cjs.makeComponentTheme("button", {

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

@@ -4,7 +4,7 @@ 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";
-setFileScope("src/themes/momotaro/components/button.css.ts?used", "blocks");
+setFileScope("src/themes/momotaro/components/button.css.ts", "blocks");
 const intentColor = createVar("intentColor");
 const hoverBackgroundColor = createVar("hoverBackgroundColor");
 const button = makeComponentTheme("button", {

package/dist/styles/themes/momotaro/components/checkbox.css.cjs

@@ -6,7 +6,7 @@ const styles_lib_theme_vars_css_cjs = require("../../../lib/theme/vars.css.cjs")
 const styles_themes_momotaro_components_helpers_css_cjs = require("./helpers.css.cjs");
 const styles_themes_momotaro_components_transitions_cjs = require("./transitions.cjs");
 const styles_lib_css_atoms_sprinkles_css_cjs = require("../../../lib/css/atoms/sprinkles.css.cjs");
-fileScope.setFileScope("src/themes/momotaro/components/checkbox.css.ts?used", "blocks");
+fileScope.setFileScope("src/themes/momotaro/components/checkbox.css.ts", "blocks");
 const checkbox = styles_lib_theme_makeComponentTheme_cjs.makeComponentTheme("checkbox", {
   base: css.style([{
     display: "flex",

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

@@ -5,7 +5,7 @@ import { vars } from "../../../lib/theme/vars.css.mjs";
 import { focusable } from "./helpers.css.mjs";
 import { bounceOut } from "./transitions.mjs";
 import { atoms } from "../../../lib/css/atoms/sprinkles.css.mjs";
-setFileScope("src/themes/momotaro/components/checkbox.css.ts?used", "blocks");
+setFileScope("src/themes/momotaro/components/checkbox.css.ts", "blocks");
 const checkbox = makeComponentTheme("checkbox", {
   base: style([{
     display: "flex",

package/dist/styles/themes/momotaro/components/dialog.css.cjs

@@ -3,7 +3,7 @@ const fileScope = require("@vanilla-extract/css/fileScope");
 const css = require("@vanilla-extract/css");
 const styles_lib_theme_makeComponentTheme_cjs = require("../../../lib/theme/makeComponentTheme.cjs");
 const styles_lib_css_atoms_sprinkles_css_cjs = require("../../../lib/css/atoms/sprinkles.css.cjs");
-fileScope.setFileScope("src/themes/momotaro/components/dialog.css.ts?used", "blocks");
+fileScope.setFileScope("src/themes/momotaro/components/dialog.css.ts", "blocks");
 const dialog = styles_lib_theme_makeComponentTheme_cjs.makeComponentTheme("dialog", {
   dialog: css.style([styles_lib_css_atoms_sprinkles_css_cjs.atoms({
     display: "flex",

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

@@ -2,7 +2,7 @@ import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
 import { style } from "@vanilla-extract/css";
 import { makeComponentTheme } from "../../../lib/theme/makeComponentTheme.mjs";
 import { atoms } from "../../../lib/css/atoms/sprinkles.css.mjs";
-setFileScope("src/themes/momotaro/components/dialog.css.ts?used", "blocks");
+setFileScope("src/themes/momotaro/components/dialog.css.ts", "blocks");
 const dialog = makeComponentTheme("dialog", {
   dialog: style([atoms({
     display: "flex",

package/dist/styles/themes/momotaro/components/divider.css.cjs

@@ -1,7 +1,7 @@
 "use strict";
 const fileScope = require("@vanilla-extract/css/fileScope");
 const styles_lib_theme_makeComponentTheme_cjs = require("../../../lib/theme/makeComponentTheme.cjs");
-fileScope.setFileScope("src/themes/momotaro/components/divider.css.ts?used", "blocks");
+fileScope.setFileScope("src/themes/momotaro/components/divider.css.ts", "blocks");
 const divider = styles_lib_theme_makeComponentTheme_cjs.makeComponentTheme("divider", {
   defaultVariants: {
     color: "textLight"

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

@@ -1,6 +1,6 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
 import { makeComponentTheme } from "../../../lib/theme/makeComponentTheme.mjs";
-setFileScope("src/themes/momotaro/components/divider.css.ts?used", "blocks");
+setFileScope("src/themes/momotaro/components/divider.css.ts", "blocks");
 const divider = makeComponentTheme("divider", {
   defaultVariants: {
     color: "textLight"

package/dist/styles/themes/momotaro/components/dropdown.css.cjs

@@ -0,0 +1,54 @@
+"use strict";
+const fileScope = require("@vanilla-extract/css/fileScope");
+const styles_lib_css_style_style_cjs = require("../../../lib/css/style/style.cjs");
+const styles_lib_theme_makeComponentTheme_cjs = require("../../../lib/theme/makeComponentTheme.cjs");
+fileScope.setFileScope("src/themes/momotaro/components/dropdown.css.ts", "blocks");
+const dropdown = styles_lib_theme_makeComponentTheme_cjs.makeComponentTheme("dropdown", {
+  base: styles_lib_css_style_style_cjs.style({
+    backgroundColor: "white",
+    borderRadius: "small",
+    boxShadow: "medium",
+    padding: "medium",
+    vars: {
+      "--spacing": "0.5rem"
+    },
+    selectors: {
+      "&[data-open]": {
+        transform: "translate(0, 0)",
+        opacity: 1
+      }
+    },
+    // Apply the animation only if the user has not requested reduced motion
+    "@media": {
+      "(prefers-reduced-motion: no-preference)": {
+        // transform: 'scale(0.9)',
+        transform: "translateY(var(--spacing))",
+        transition: "opacity 80ms linear, transform 80ms",
+        opacity: 0
+      }
+    }
+  }),
+  variants: {
+    variant: {
+      solid: styles_lib_css_style_style_cjs.style({
+        backgroundColor: "white",
+        border: "none",
+        boxShadow: "medium",
+        color: "black",
+        padding: "medium"
+      }),
+      outline: styles_lib_css_style_style_cjs.style({
+        backgroundColor: "transparent",
+        border: "1px solid black",
+        boxShadow: "none",
+        color: "black",
+        padding: "medium"
+      })
+    }
+  },
+  defaultVariants: {
+    variant: "solid"
+  }
+});
+fileScope.endFileScope();
+exports.dropdown = dropdown;

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

@@ -0,0 +1,55 @@
+import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
+import { style } from "../../../lib/css/style/style.mjs";
+import { makeComponentTheme } from "../../../lib/theme/makeComponentTheme.mjs";
+setFileScope("src/themes/momotaro/components/dropdown.css.ts", "blocks");
+const dropdown = makeComponentTheme("dropdown", {
+  base: style({
+    backgroundColor: "white",
+    borderRadius: "small",
+    boxShadow: "medium",
+    padding: "medium",
+    vars: {
+      "--spacing": "0.5rem"
+    },
+    selectors: {
+      "&[data-open]": {
+        transform: "translate(0, 0)",
+        opacity: 1
+      }
+    },
+    // Apply the animation only if the user has not requested reduced motion
+    "@media": {
+      "(prefers-reduced-motion: no-preference)": {
+        // transform: 'scale(0.9)',
+        transform: "translateY(var(--spacing))",
+        transition: "opacity 80ms linear, transform 80ms",
+        opacity: 0
+      }
+    }
+  }),
+  variants: {
+    variant: {
+      solid: style({
+        backgroundColor: "white",
+        border: "none",
+        boxShadow: "medium",
+        color: "black",
+        padding: "medium"
+      }),
+      outline: style({
+        backgroundColor: "transparent",
+        border: "1px solid black",
+        boxShadow: "none",
+        color: "black",
+        padding: "medium"
+      })
+    }
+  },
+  defaultVariants: {
+    variant: "solid"
+  }
+});
+endFileScope();
+export {
+  dropdown
+};

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

@@ -2,7 +2,7 @@
 const fileScope = require("@vanilla-extract/css/fileScope");
 const css = require("@vanilla-extract/css");
 const styles_lib_theme_vars_css_cjs = require("../../../lib/theme/vars.css.cjs");
-fileScope.setFileScope("src/themes/momotaro/components/helpers.css.ts?used", "blocks");
+fileScope.setFileScope("src/themes/momotaro/components/helpers.css.ts", "blocks");
 const focusRingColor = css.createVar("focusRingColor");
 const focusable = css.style({
   ":focus-visible": {

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

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

package/dist/styles/themes/momotaro/components/index.cjs

@@ -3,6 +3,7 @@ const styles_themes_momotaro_components_button_css_cjs = require("./button.css.c
 const styles_themes_momotaro_components_checkbox_css_cjs = require("./checkbox.css.cjs");
 const styles_themes_momotaro_components_dialog_css_cjs = require("./dialog.css.cjs");
 const styles_themes_momotaro_components_divider_css_cjs = require("./divider.css.cjs");
+const styles_themes_momotaro_components_dropdown_css_cjs = require("./dropdown.css.cjs");
 const styles_themes_momotaro_components_input_css_cjs = require("./input.css.cjs");
 const styles_themes_momotaro_components_label_css_cjs = require("./label.css.cjs");
 const styles_themes_momotaro_components_link_css_cjs = require("./link.css.cjs");
@@ -21,6 +22,7 @@ const components = {
   progress: styles_themes_momotaro_components_progress_css_cjs.progress,
   radio: styles_themes_momotaro_components_radio_css_cjs.radio,
   spinner: styles_themes_momotaro_components_spinner_css_cjs.spinner,
+  dropdown: styles_themes_momotaro_components_dropdown_css_cjs.dropdown,
   switch: styles_themes_momotaro_components_switch_css_cjs.switchTheme
 };
 exports.components = components;

package/dist/styles/themes/momotaro/components/index.mjs

@@ -2,6 +2,7 @@ import { button } from "./button.css.mjs";
 import { checkbox } from "./checkbox.css.mjs";
 import { dialog } from "./dialog.css.mjs";
 import { divider } from "./divider.css.mjs";
+import { dropdown } from "./dropdown.css.mjs";
 import { input } from "./input.css.mjs";
 import { label } from "./label.css.mjs";
 import { link } from "./link.css.mjs";
@@ -20,6 +21,7 @@ const components = {
   progress,
   radio,
   spinner,
+  dropdown,
   switch: switchTheme
 };
 export {

package/dist/styles/themes/momotaro/components/input.css.cjs

@@ -4,7 +4,7 @@ const css = require("@vanilla-extract/css");
 const styles_lib_theme_makeComponentTheme_cjs = require("../../../lib/theme/makeComponentTheme.cjs");
 const styles_lib_theme_vars_css_cjs = require("../../../lib/theme/vars.css.cjs");
 const styles_lib_css_atoms_sprinkles_css_cjs = require("../../../lib/css/atoms/sprinkles.css.cjs");
-fileScope.setFileScope("src/themes/momotaro/components/input.css.ts?used", "blocks");
+fileScope.setFileScope("src/themes/momotaro/components/input.css.ts", "blocks");
 const input = styles_lib_theme_makeComponentTheme_cjs.makeComponentTheme("input", {
   input: css.style([styles_lib_css_atoms_sprinkles_css_cjs.atoms({
     color: "text",

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

@@ -3,7 +3,7 @@ import { style } 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";
-setFileScope("src/themes/momotaro/components/input.css.ts?used", "blocks");
+setFileScope("src/themes/momotaro/components/input.css.ts", "blocks");
 const input = makeComponentTheme("input", {
   input: style([atoms({
     color: "text",

package/dist/styles/themes/momotaro/components/label.css.cjs

@@ -3,7 +3,7 @@ const fileScope = require("@vanilla-extract/css/fileScope");
 const css = require("@vanilla-extract/css");
 const styles_lib_theme_makeComponentTheme_cjs = require("../../../lib/theme/makeComponentTheme.cjs");
 const styles_lib_theme_vars_css_cjs = require("../../../lib/theme/vars.css.cjs");
-fileScope.setFileScope("src/themes/momotaro/components/label.css.ts?used", "blocks");
+fileScope.setFileScope("src/themes/momotaro/components/label.css.ts", "blocks");
 const label = styles_lib_theme_makeComponentTheme_cjs.makeComponentTheme("label", {
   base: css.style({}, "label_base"),
   variants: {

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

@@ -2,7 +2,7 @@ import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
 import { style } from "@vanilla-extract/css";
 import { makeComponentTheme } from "../../../lib/theme/makeComponentTheme.mjs";
 import { vars } from "../../../lib/theme/vars.css.mjs";
-setFileScope("src/themes/momotaro/components/label.css.ts?used", "blocks");
+setFileScope("src/themes/momotaro/components/label.css.ts", "blocks");
 const label = makeComponentTheme("label", {
   base: style({}, "label_base"),
   variants: {

package/dist/styles/themes/momotaro/components/link.css.cjs

@@ -4,7 +4,7 @@ const css = require("@vanilla-extract/css");
 const styles_lib_theme_makeComponentTheme_cjs = require("../../../lib/theme/makeComponentTheme.cjs");
 const styles_themes_momotaro_components_helpers_css_cjs = require("./helpers.css.cjs");
 const styles_lib_css_atoms_sprinkles_css_cjs = require("../../../lib/css/atoms/sprinkles.css.cjs");
-fileScope.setFileScope("src/themes/momotaro/components/link.css.ts?used", "blocks");
+fileScope.setFileScope("src/themes/momotaro/components/link.css.ts", "blocks");
 const link = styles_lib_theme_makeComponentTheme_cjs.makeComponentTheme("link", {
   base: css.style([{
     outline: "none",

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

@@ -3,7 +3,7 @@ import { style } from "@vanilla-extract/css";
 import { makeComponentTheme } from "../../../lib/theme/makeComponentTheme.mjs";
 import { focusable } from "./helpers.css.mjs";
 import { atoms } from "../../../lib/css/atoms/sprinkles.css.mjs";
-setFileScope("src/themes/momotaro/components/link.css.ts?used", "blocks");
+setFileScope("src/themes/momotaro/components/link.css.ts", "blocks");
 const link = makeComponentTheme("link", {
   base: style([{
     outline: "none",

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

@@ -4,7 +4,7 @@ const css = require("@vanilla-extract/css");
 const styles_lib_theme_makeComponentTheme_cjs = require("../../../lib/theme/makeComponentTheme.cjs");
 const styles_lib_theme_vars_css_cjs = require("../../../lib/theme/vars.css.cjs");
 const styles_lib_css_atoms_sprinkles_css_cjs = require("../../../lib/css/atoms/sprinkles.css.cjs");
-fileScope.setFileScope("src/themes/momotaro/components/progress.css.ts?used", "blocks");
+fileScope.setFileScope("src/themes/momotaro/components/progress.css.ts", "blocks");
 const indeterminateAnimation = css.keyframes({
   "0%": {
     transform: "translateX(-100%)"

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

@@ -3,7 +3,7 @@ import { keyframes, style } 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";
-setFileScope("src/themes/momotaro/components/progress.css.ts?used", "blocks");
+setFileScope("src/themes/momotaro/components/progress.css.ts", "blocks");
 const indeterminateAnimation = keyframes({
   "0%": {
     transform: "translateX(-100%)"

package/dist/styles/themes/momotaro/components/radio.css.cjs

@@ -6,7 +6,7 @@ const styles_lib_theme_vars_css_cjs = require("../../../lib/theme/vars.css.cjs")
 const styles_themes_momotaro_components_helpers_css_cjs = require("./helpers.css.cjs");
 const styles_themes_momotaro_components_transitions_cjs = require("./transitions.cjs");
 const styles_lib_css_atoms_sprinkles_css_cjs = require("../../../lib/css/atoms/sprinkles.css.cjs");
-fileScope.setFileScope("src/themes/momotaro/components/radio.css.ts?used", "blocks");
+fileScope.setFileScope("src/themes/momotaro/components/radio.css.ts", "blocks");
 const radio = styles_lib_theme_makeComponentTheme_cjs.makeComponentTheme("radio", {
   base: css.style([{
     display: "flex",

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

@@ -5,7 +5,7 @@ import { vars } from "../../../lib/theme/vars.css.mjs";
 import { focusable } from "./helpers.css.mjs";
 import { bounceOut } from "./transitions.mjs";
 import { atoms } from "../../../lib/css/atoms/sprinkles.css.mjs";
-setFileScope("src/themes/momotaro/components/radio.css.ts?used", "blocks");
+setFileScope("src/themes/momotaro/components/radio.css.ts", "blocks");
 const radio = makeComponentTheme("radio", {
   base: style([{
     display: "flex",

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

@@ -2,7 +2,7 @@
 const fileScope = require("@vanilla-extract/css/fileScope");
 const css = require("@vanilla-extract/css");
 const styles_lib_theme_makeComponentTheme_cjs = require("../../../lib/theme/makeComponentTheme.cjs");
-fileScope.setFileScope("src/themes/momotaro/components/spinner.css.ts?used", "blocks");
+fileScope.setFileScope("src/themes/momotaro/components/spinner.css.ts", "blocks");
 const spinAnimation = css.keyframes({
   "0%": {
     transform: "rotate(0deg)"

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

@@ -1,7 +1,7 @@
 import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
 import { keyframes, style } from "@vanilla-extract/css";
 import { makeComponentTheme } from "../../../lib/theme/makeComponentTheme.mjs";
-setFileScope("src/themes/momotaro/components/spinner.css.ts?used", "blocks");
+setFileScope("src/themes/momotaro/components/spinner.css.ts", "blocks");
 const spinAnimation = keyframes({
   "0%": {
     transform: "rotate(0deg)"