@voiceflow/style 1.18.1-d62a34e5bb.326 → 1.18.2-0cab83efde.52

package/build/main.d.mts

@@ -0,0 +1,251 @@
+import { clsx } from "clsx";
+import { assignInlineVars } from "@vanilla-extract/dynamic";
+import { ComplexStyleRule } from "@vanilla-extract/css";
+import { RecipeVariants, RuntimeFn, RuntimeFn as RuntimeFn$1, recipe } from "@vanilla-extract/recipes";
+import { Simplify } from "type-fest";
+export * from "@vanilla-extract/dynamic";
+export * from "@vanilla-extract/css";
+export declare const STYLED_CLASS: unique symbol;
+export type ThemeContract = Parameters<typeof assignInlineVars>[0];
+export interface DynamicOptions<Theme extends ThemeContract | null = ThemeContract, Variables extends Record<string, string> | null = Record<string, string>> {
+  /**
+   * the contract for a theme that can be overridden via a `theme` prop
+   */
+  theme?: Theme;
+  /**
+   * variables that can be overridden via a `vars` prop
+   */
+  vars?: Variables;
+}
+export type DynamicThemeProps<Theme> = Theme extends ThemeContract ? {
+  /**
+   * inline override for the theme used to style this component
+   */
+  theme?: Parameters<typeof assignInlineVars<Theme>>[1];
+} : object;
+export type DynamicVariablesProps<Variables> = Variables extends Record<string, string> ? {
+  /**
+   * inline override for variables used to styled this component
+   */
+  vars?: Partial<{ [K in keyof Variables]: string; }>;
+} : object;
+export type StyledComponentProps<Tag extends keyof JSX.IntrinsicElements, Theme, Variables, Extras extends object = object> = React.ComponentPropsWithoutRef<Tag> & DynamicThemeProps<Theme> & DynamicVariablesProps<Variables> & Extras;
+export interface StyledComponent<Props = object> extends React.FunctionComponent<Props> {
+  (props: Props, context?: any): React.ReactElement<any, any> | null;
+  [STYLED_CLASS]: string | null;
+}
+export type StyleSource = StyledComponent | string;
+export interface StyledFactory<Tag extends keyof JSX.IntrinsicElements> {
+  <Recipe extends RuntimeFn$1<Record<string, any>>, Theme extends ThemeContract | null = null, Variables extends Record<string, string> | null = null>(recipe: Recipe, sources?: StyleSource[], dynamic?: DynamicOptions<Theme, Variables>): StyledComponent<StyledComponentProps<Tag, Theme, Variables, {
+    variants: RecipeVariants<Recipe>;
+  }>>;
+  <Variant extends string, Theme extends ThemeContract | null = null, Variables extends Record<string, string> | null = null>(variants: Record<Variant, string>, sources?: StyleSource[], dynamic?: DynamicOptions<Theme, Variables>): StyledComponent<StyledComponentProps<Tag, Theme, Variables, {
+    variant: Variant;
+  }>>;
+  <Theme extends ThemeContract | null = null, Variables extends Record<string, string> | null = null>(sources: StyleSource[], dynamic?: DynamicOptions<Theme, Variables>): StyledComponent<StyledComponentProps<Tag, Theme, Variables>>;
+}
+export type FirstStyledArgument<Variants extends Record<string, any> = any> = RuntimeFn$1<Variants> | Record<string, string> | StyleSource[];
+export type SecondStyledArgument = StyleSource[] | DynamicOptions;
+export declare const styled: {
+  a: StyledFactory<"a">;
+  abbr: StyledFactory<"abbr">;
+  address: StyledFactory<"address">;
+  area: StyledFactory<"area">;
+  article: StyledFactory<"article">;
+  aside: StyledFactory<"aside">;
+  audio: StyledFactory<"audio">;
+  b: StyledFactory<"b">;
+  base: StyledFactory<"base">;
+  bdi: StyledFactory<"bdi">;
+  bdo: StyledFactory<"bdo">;
+  big: StyledFactory<"big">;
+  blockquote: StyledFactory<"blockquote">;
+  body: StyledFactory<"body">;
+  br: StyledFactory<"br">;
+  button: StyledFactory<"button">;
+  canvas: StyledFactory<"canvas">;
+  caption: StyledFactory<"caption">;
+  center: StyledFactory<"center">;
+  cite: StyledFactory<"cite">;
+  code: StyledFactory<"code">;
+  col: StyledFactory<"col">;
+  colgroup: StyledFactory<"colgroup">;
+  data: StyledFactory<"data">;
+  datalist: StyledFactory<"datalist">;
+  dd: StyledFactory<"dd">;
+  del: StyledFactory<"del">;
+  details: StyledFactory<"details">;
+  dfn: StyledFactory<"dfn">;
+  dialog: StyledFactory<"dialog">;
+  div: StyledFactory<"div">;
+  dl: StyledFactory<"dl">;
+  dt: StyledFactory<"dt">;
+  em: StyledFactory<"em">;
+  embed: StyledFactory<"embed">;
+  fieldset: StyledFactory<"fieldset">;
+  figcaption: StyledFactory<"figcaption">;
+  figure: StyledFactory<"figure">;
+  footer: StyledFactory<"footer">;
+  form: StyledFactory<"form">;
+  h1: StyledFactory<"h1">;
+  h2: StyledFactory<"h2">;
+  h3: StyledFactory<"h3">;
+  h4: StyledFactory<"h4">;
+  h5: StyledFactory<"h5">;
+  h6: StyledFactory<"h6">;
+  head: StyledFactory<"head">;
+  header: StyledFactory<"header">;
+  hgroup: StyledFactory<"hgroup">;
+  hr: StyledFactory<"hr">;
+  html: StyledFactory<"html">;
+  i: StyledFactory<"i">;
+  iframe: StyledFactory<"iframe">;
+  img: StyledFactory<"img">;
+  input: StyledFactory<"input">;
+  ins: StyledFactory<"ins">;
+  kbd: StyledFactory<"kbd">;
+  keygen: StyledFactory<"keygen">;
+  label: StyledFactory<"label">;
+  legend: StyledFactory<"legend">;
+  li: StyledFactory<"li">;
+  link: StyledFactory<"link">;
+  main: StyledFactory<"main">;
+  map: StyledFactory<"map">;
+  mark: StyledFactory<"mark">;
+  menu: StyledFactory<"menu">;
+  menuitem: StyledFactory<"menuitem">;
+  meta: StyledFactory<"meta">;
+  meter: StyledFactory<"meter">;
+  nav: StyledFactory<"nav">;
+  noindex: StyledFactory<"noindex">;
+  noscript: StyledFactory<"noscript">;
+  object: StyledFactory<"object">;
+  ol: StyledFactory<"ol">;
+  optgroup: StyledFactory<"optgroup">;
+  option: StyledFactory<"option">;
+  output: StyledFactory<"output">;
+  p: StyledFactory<"p">;
+  param: StyledFactory<"param">;
+  picture: StyledFactory<"picture">;
+  pre: StyledFactory<"pre">;
+  progress: StyledFactory<"progress">;
+  q: StyledFactory<"q">;
+  rp: StyledFactory<"rp">;
+  rt: StyledFactory<"rt">;
+  ruby: StyledFactory<"ruby">;
+  s: StyledFactory<"s">;
+  samp: StyledFactory<"samp">;
+  search: StyledFactory<"search">;
+  slot: StyledFactory<"slot">;
+  script: StyledFactory<"script">;
+  section: StyledFactory<"section">;
+  select: StyledFactory<"select">;
+  small: StyledFactory<"small">;
+  source: StyledFactory<"source">;
+  span: StyledFactory<"span">;
+  strong: StyledFactory<"strong">;
+  style: StyledFactory<"style">;
+  sub: StyledFactory<"sub">;
+  summary: StyledFactory<"summary">;
+  sup: StyledFactory<"sup">;
+  table: StyledFactory<"table">;
+  template: StyledFactory<"template">;
+  tbody: StyledFactory<"tbody">;
+  td: StyledFactory<"td">;
+  textarea: StyledFactory<"textarea">;
+  tfoot: StyledFactory<"tfoot">;
+  th: StyledFactory<"th">;
+  thead: StyledFactory<"thead">;
+  time: StyledFactory<"time">;
+  title: StyledFactory<"title">;
+  tr: StyledFactory<"tr">;
+  track: StyledFactory<"track">;
+  u: StyledFactory<"u">;
+  ul: StyledFactory<"ul">;
+  var: StyledFactory<"var">;
+  video: StyledFactory<"video">;
+  wbr: StyledFactory<"wbr">;
+  webview: StyledFactory<"webview">;
+  svg: StyledFactory<"svg">;
+  animate: StyledFactory<"animate">;
+  animateMotion: StyledFactory<"animateMotion">;
+  animateTransform: StyledFactory<"animateTransform">;
+  circle: StyledFactory<"circle">;
+  clipPath: StyledFactory<"clipPath">;
+  defs: StyledFactory<"defs">;
+  desc: StyledFactory<"desc">;
+  ellipse: StyledFactory<"ellipse">;
+  feBlend: StyledFactory<"feBlend">;
+  feColorMatrix: StyledFactory<"feColorMatrix">;
+  feComponentTransfer: StyledFactory<"feComponentTransfer">;
+  feComposite: StyledFactory<"feComposite">;
+  feConvolveMatrix: StyledFactory<"feConvolveMatrix">;
+  feDiffuseLighting: StyledFactory<"feDiffuseLighting">;
+  feDisplacementMap: StyledFactory<"feDisplacementMap">;
+  feDistantLight: StyledFactory<"feDistantLight">;
+  feDropShadow: StyledFactory<"feDropShadow">;
+  feFlood: StyledFactory<"feFlood">;
+  feFuncA: StyledFactory<"feFuncA">;
+  feFuncB: StyledFactory<"feFuncB">;
+  feFuncG: StyledFactory<"feFuncG">;
+  feFuncR: StyledFactory<"feFuncR">;
+  feGaussianBlur: StyledFactory<"feGaussianBlur">;
+  feImage: StyledFactory<"feImage">;
+  feMerge: StyledFactory<"feMerge">;
+  feMergeNode: StyledFactory<"feMergeNode">;
+  feMorphology: StyledFactory<"feMorphology">;
+  feOffset: StyledFactory<"feOffset">;
+  fePointLight: StyledFactory<"fePointLight">;
+  feSpecularLighting: StyledFactory<"feSpecularLighting">;
+  feSpotLight: StyledFactory<"feSpotLight">;
+  feTile: StyledFactory<"feTile">;
+  feTurbulence: StyledFactory<"feTurbulence">;
+  filter: StyledFactory<"filter">;
+  foreignObject: StyledFactory<"foreignObject">;
+  g: StyledFactory<"g">;
+  image: StyledFactory<"image">;
+  line: StyledFactory<"line">;
+  linearGradient: StyledFactory<"linearGradient">;
+  marker: StyledFactory<"marker">;
+  mask: StyledFactory<"mask">;
+  metadata: StyledFactory<"metadata">;
+  mpath: StyledFactory<"mpath">;
+  path: StyledFactory<"path">;
+  pattern: StyledFactory<"pattern">;
+  polygon: StyledFactory<"polygon">;
+  polyline: StyledFactory<"polyline">;
+  radialGradient: StyledFactory<"radialGradient">;
+  rect: StyledFactory<"rect">;
+  set: StyledFactory<"set">;
+  stop: StyledFactory<"stop">;
+  switch: StyledFactory<"switch">;
+  symbol: StyledFactory<"symbol">;
+  text: StyledFactory<"text">;
+  textPath: StyledFactory<"textPath">;
+  tspan: StyledFactory<"tspan">;
+  use: StyledFactory<"use">;
+  view: StyledFactory<"view">;
+};
+export declare const getStaticClass: (firstArg: FirstStyledArgument, secondArg?: SecondStyledArgument) => string | null;
+export declare const getDynamicOptions: (secondArg?: SecondStyledArgument, thirdArg?: DynamicOptions) => DynamicOptions | null;
+export declare const useDynamicClass: (firstArg: FirstStyledArgument<any>, props: {
+  variant?: string;
+  variants?: Record<string, any>;
+}) => string | null | undefined;
+export declare const useInlineStyle: (props: StyledComponentProps<keyof JSX.IntrinsicElements, ThemeContract, Record<string, string>>, dynamicOptions: DynamicOptions | null) => {};
+/**
+ * the pattern for data-testid attributes is based off of BEM naming
+ * https://getbem.com/naming/
+ */
+export declare const tid: (block: string | undefined, elements: string | [string, string, ...string[]], modifier?: string) => string | undefined;
+export declare const ThemeContext: import("react").Context<string | null>;
+export declare const ThemeConsumer: import("react").Consumer<string | null>;
+export interface ThemeProviderProps extends React.PropsWithChildren {
+  theme: string;
+}
+export declare const ThemeProvider: React.FC<ThemeProviderProps>;
+export declare const useTheme: () => string | null;
+export type VariantStyleRules = Record<string, Record<string, ComplexStyleRule | string>>;
+export type VariantProps<RecipeFn extends RuntimeFn$1<VariantStyleRules>> = Exclude<Simplify<RecipeVariants<RecipeFn>>, undefined | null>;
+export { type RuntimeFn, clsx, recipe };
+//# sourceMappingURL=main.d.mts.map

package/build/main.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"main.d.mts","names":["RuntimeFn","RuntimeFn"],"sources":["../src/styled/constants.ts","../src/styled/types.ts","../src/styled/factory.tsx","../src/styled/utils.ts","../src/testing.ts","../src/ThemeContext.tsx","../src/types.ts"],"mappings":";;;;;;;qBAAa;YCKD,gBAAgB,kBAAkB;iBAE7B,eACf,cAAc,uBAAuB,eACrC,kBAAkB,gCAAgC;;;;EAKlD,QAAQ;;;;EAIR,OAAO;;YAGG,kBAAkB,SAAS,cAAc;;;;EAK/C,QAAQ,kBAAkB,iBAAiB;;YAIrC,sBAAsB,aAChC,kBAAkB;;;;EAKZ,OAAO,WAAW,WAAW;;YAIzB,qBACV,kBAAkB,IAAI,mBACtB,OACA,WACA,kCACE,MAAM,yBAAyB,OAAO,kBAAkB,SAAS,sBAAsB,aAAa;iBAEvF,gBAAgB,wBAAwB,MAAM,kBAAkB;GAC9E,OAAO,OAAO,gBAAgB,MAAM;GACpC;;YAGS,cAAc;iBAET,cAAc,kBAAkB,IAAI;GAEjD,eAAeA,YAAU,sBACzB,cAAc,6BACd,kBAAkB,sCAElB,QAAQ,QACR,UAAU,eACV,UAAU,eAAe,OAAO,aAC/B,gBAAgB,qBAAqB,KAAK,OAAO;IAAa,UAAU,eAAe;;GAGxF,wBACA,cAAc,6BACd,kBAAkB,sCAElB,UAAU,OAAO,kBACjB,UAAU,eACV,UAAU,eAAe,OAAO,aAC/B,gBAAgB,qBAAqB,KAAK,OAAO;IAAa,SAAS;;GAEzE,cAAc,6BAA6B,kBAAkB,sCAC5D,SAAS,eACT,UAAU,eAAe,OAAO,aAC/B,gBAAgB,qBAAqB,KAAK,OAAO;;YAG1C,oBAAoB,iBAAiB,6BAC7CA,YAAU,YACV,yBACA;YAEQ,uBAAuB,gBAAgB;qBCvEtC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBCFA,iBAAkB,UAAU,qBAAqB,YAAY;qBAS7D,oBAAqB,YAAY,sBAAsB,WAAW,mBAAiB;qBAGnF,kBACX,UAAU,0BACV;EAAS;EAAkB,WAAW;;qBAS3B,iBACX,OAAO,2BAA2B,IAAI,mBAAmB,eAAe,yBACxE,gBAAgB;;;;;qBCjCL,MAAO,2BAA2B,kDAAkD;qBCHpF,8BAAY;qBACA,+BAAa;iBAErB,2BAA2B,MAAM;EAChD;;qBAGW,eAAe,MAAM,GAAG;qBAIxB;YCTD,oBAAoB,eAAe,eAAe;YAElD,aAAa,iBAAiBC,YAAU,sBAAsB,QACxE,SAAS,eAAe"}

package/build/main.mjs

@@ -0,0 +1,74 @@
+import { clsx, clsx as clsx$1 } from "clsx";
+import { createContext, createElement, useContext, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { assignInlineVars } from "@vanilla-extract/dynamic";
+import { recipe } from "@vanilla-extract/recipes";
+export * from "@vanilla-extract/dynamic";
+export * from "@vanilla-extract/css";
+// src/styled/constants.ts
+const STYLED_CLASS = Symbol("styled_class");
+// src/ThemeContext.tsx
+const ThemeContext = createContext(null);
+const { Consumer: ThemeConsumer } = ThemeContext;
+const ThemeProvider = ({ theme, children }) => /* @__PURE__ */ jsx(ThemeContext.Provider, {
+	value: theme,
+	children
+});
+const useTheme = () => useContext(ThemeContext);
+// src/styled/utils.ts
+const getStaticClass = (firstArg, secondArg) => {
+	const classNames = (Array.isArray(firstArg) ? firstArg : Array.isArray(secondArg) ? secondArg : []).map((source) => typeof source === "string" ? source : source[STYLED_CLASS]);
+	return classNames.length ? clsx$1(classNames) : null;
+};
+const getDynamicOptions = (secondArg, thirdArg) => (Array.isArray(secondArg) ? thirdArg : secondArg) ?? null;
+const useDynamicClass = (firstArg, props) => useMemo(() => {
+	if (typeof firstArg === "function") return firstArg(props.variants);
+	if (Array.isArray(firstArg) || !props.variant) return null;
+	return firstArg[props.variant];
+}, [
+	firstArg,
+	props.variants,
+	props.variant
+]);
+const useInlineStyle = (props, dynamicOptions) => {
+	const { theme, vars } = dynamicOptions ?? {};
+	return useMemo(() => {
+		const style = {};
+		if (theme && props.theme) Object.assign(style, assignInlineVars(theme, props.theme));
+		if (vars && props.vars) Object.assign(style, assignInlineVars(props.vars));
+		return style;
+	}, [props.theme, props.vars]);
+};
+// src/styled/factory.tsx
+const styled = new Proxy({}, { get: (_target, tag) => (firstArg, secondArg, thirdArg) => {
+	const staticClass = getStaticClass(firstArg, secondArg);
+	const dynamicOptions = getDynamicOptions(secondArg, thirdArg);
+	const StyledComponent = (props) => {
+		const themeClass = useTheme();
+		const dynamicClass = useDynamicClass(firstArg, props);
+		const inlineStyle = useInlineStyle(props, dynamicOptions);
+		return createElement(tag, {
+			...props,
+			className: clsx$1(themeClass, staticClass, dynamicClass, props.className),
+			style: {
+				...inlineStyle,
+				...props.style
+			}
+		});
+	};
+	return Object.assign(StyledComponent, { [STYLED_CLASS]: staticClass });
+} });
+// src/testing.ts
+/**
+* the pattern for data-testid attributes is based off of BEM naming
+* https://getbem.com/naming/
+*/
+const tid = (block, elements, modifier) => {
+	if (!block) return void 0;
+	const blockElement = [block, ...typeof elements === "string" ? [elements] : elements].join("__");
+	if (!modifier) return blockElement;
+	return `${blockElement}--${modifier}`;
+};
+export { STYLED_CLASS, ThemeConsumer, ThemeContext, ThemeProvider, clsx, getDynamicOptions, getStaticClass, recipe, styled, tid, useDynamicClass, useInlineStyle, useTheme };
+
+//# sourceMappingURL=main.mjs.map

package/build/main.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"main.mjs","names":["clsx","clsx"],"sources":["../src/styled/constants.ts","../src/ThemeContext.tsx","../src/styled/utils.ts","../src/styled/factory.tsx","../src/testing.ts"],"sourcesContent":["export const STYLED_CLASS = Symbol('styled_class');\n","import { createContext, useContext } from 'react';\n\nexport const ThemeContext = createContext<string | null>(null);\nexport const { Consumer: ThemeConsumer } = ThemeContext;\n\nexport interface ThemeProviderProps extends React.PropsWithChildren {\n  theme: string;\n}\n\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({ theme, children }) => (\n  <ThemeContext.Provider value={theme}>{children}</ThemeContext.Provider>\n);\n\nexport const useTheme = () => useContext(ThemeContext);\n","import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { clsx } from 'clsx';\nimport { useMemo } from 'react';\n\nimport { STYLED_CLASS } from './constants';\nimport type {\n  DynamicOptions,\n  FirstStyledArgument,\n  SecondStyledArgument,\n  StyledComponentProps,\n  ThemeContract,\n} from './types';\n\nexport const getStaticClass = (firstArg: FirstStyledArgument, secondArg?: SecondStyledArgument): string | null => {\n  // oxlint-disable-next-line no-nested-ternary\n  const classNames = (Array.isArray(firstArg) ? firstArg : Array.isArray(secondArg) ? secondArg : []).map((source) =>\n    typeof source === 'string' ? source : source[STYLED_CLASS]\n  );\n\n  return classNames.length ? clsx(classNames) : null;\n};\n\nexport const getDynamicOptions = (secondArg?: SecondStyledArgument, thirdArg?: DynamicOptions): DynamicOptions | null =>\n  (Array.isArray(secondArg) ? thirdArg : secondArg) ?? null;\n\nexport const useDynamicClass = (\n  firstArg: FirstStyledArgument<any>,\n  props: { variant?: string; variants?: Record<string, any> }\n) =>\n  useMemo(() => {\n    if (typeof firstArg === 'function') return firstArg(props.variants);\n    if (Array.isArray(firstArg) || !props.variant) return null;\n\n    return firstArg[props.variant];\n  }, [firstArg, props.variants, props.variant]);\n\nexport const useInlineStyle = (\n  props: StyledComponentProps<keyof JSX.IntrinsicElements, ThemeContract, Record<string, string>>,\n  dynamicOptions: DynamicOptions | null\n) => {\n  const { theme, vars } = dynamicOptions ?? {};\n\n  return useMemo(() => {\n    const style = {};\n\n    if (theme && props.theme) {\n      Object.assign(style, assignInlineVars(theme, props.theme));\n    }\n\n    if (vars && props.vars) {\n      Object.assign(style, assignInlineVars(props.vars as Record<string, string>));\n    }\n\n    return style;\n  }, [props.theme, props.vars]);\n};\n","import { clsx } from 'clsx';\nimport { createElement } from 'react';\n\nimport { useTheme } from '../ThemeContext';\nimport { STYLED_CLASS } from './constants';\nimport type {\n  DynamicOptions,\n  FirstStyledArgument,\n  SecondStyledArgument,\n  StyledComponent,\n  StyledComponentProps,\n  StyledFactory,\n} from './types';\nimport { getDynamicOptions, getStaticClass, useDynamicClass, useInlineStyle } from './utils';\n\nexport const styled = new Proxy<{\n  [Tag in keyof JSX.IntrinsicElements]: StyledFactory<Tag>;\n}>({} as any, {\n  get:\n    <Tag extends keyof JSX.IntrinsicElements>(_target: unknown, tag: Tag): StyledFactory<Tag> =>\n    (firstArg: FirstStyledArgument, secondArg?: SecondStyledArgument, thirdArg?: DynamicOptions) => {\n      const staticClass = getStaticClass(firstArg, secondArg);\n      const dynamicOptions = getDynamicOptions(secondArg, thirdArg);\n\n      const StyledComponent = (props: StyledComponentProps<Tag, any, any, { variant?: any; variants?: any }>) => {\n        const themeClass = useTheme();\n        const dynamicClass = useDynamicClass(firstArg, props);\n        const inlineStyle = useInlineStyle(props, dynamicOptions);\n\n        return createElement(tag, {\n          ...(props as React.ComponentPropsWithoutRef<Tag>),\n          className: clsx(themeClass, staticClass, dynamicClass, props.className),\n          style: { ...inlineStyle, ...props.style },\n        });\n      };\n\n      return Object.assign(StyledComponent, { [STYLED_CLASS]: staticClass }) as StyledComponent<any>;\n    },\n});\n","/**\n * the pattern for data-testid attributes is based off of BEM naming\n * https://getbem.com/naming/\n */\n\nexport const tid = (block: string | undefined, elements: string | [string, string, ...string[]], modifier?: string) => {\n  if (!block) return undefined;\n\n  const elementList = typeof elements === 'string' ? [elements] : elements;\n  const blockElement = [block, ...elementList].join('__');\n\n  if (!modifier) return blockElement;\n\n  return `${blockElement}--${modifier}`;\n};\n"],"mappings":";;;;;;;;AAAA,MAAa,eAAe,OAAO,cAAc;;ACEjD,MAAa,eAAe,cAA6B,IAAI;AAC7D,MAAa,EAAE,UAAU,kBAAkB;AAM3C,MAAa,iBAA+C,EAAE,OAAO,eACnE,oBAAC,aAAa,UAAd;CAAuB,OAAO;CAAQ;AAAgC,CAAA;AAGxE,MAAa,iBAAiB,WAAW,YAAY;;ACArD,MAAa,kBAAkB,UAA+B,cAAoD;CAEhH,MAAM,cAAc,MAAM,QAAQ,QAAQ,IAAI,WAAW,MAAM,QAAQ,SAAS,IAAI,YAAY,CAAC,EAAA,CAAG,KAAK,WACvG,OAAO,WAAW,WAAW,SAAS,OAAO,aAC/C;CAEA,OAAO,WAAW,SAASA,OAAK,UAAU,IAAI;AAChD;AAEA,MAAa,qBAAqB,WAAkC,cACjE,MAAM,QAAQ,SAAS,IAAI,WAAW,cAAc;AAEvD,MAAa,mBACX,UACA,UAEA,cAAc;CACZ,IAAI,OAAO,aAAa,YAAY,OAAO,SAAS,MAAM,QAAQ;CAClE,IAAI,MAAM,QAAQ,QAAQ,KAAK,CAAC,MAAM,SAAS,OAAO;CAEtD,OAAO,SAAS,MAAM;AACxB,GAAG;CAAC;CAAU,MAAM;CAAU,MAAM;AAAO,CAAC;AAE9C,MAAa,kBACX,OACA,mBACG;CACH,MAAM,EAAE,OAAO,SAAS,kBAAkB,CAAC;CAE3C,OAAO,cAAc;EACnB,MAAM,QAAQ,CAAC;EAEf,IAAI,SAAS,MAAM,OACjB,OAAO,OAAO,OAAO,iBAAiB,OAAO,MAAM,KAAK,CAAC;EAG3D,IAAI,QAAQ,MAAM,MAChB,OAAO,OAAO,OAAO,iBAAiB,MAAM,IAA8B,CAAC;EAG7E,OAAO;CACT,GAAG,CAAC,MAAM,OAAO,MAAM,IAAI,CAAC;AAC9B;;ACxCA,MAAa,SAAS,IAAI,MAEvB,CAAC,GAAU,EACZ,MAC4C,SAAkB,SAC3D,UAA+B,WAAkC,aAA8B;CAC9F,MAAM,cAAc,eAAe,UAAU,SAAS;CACtD,MAAM,iBAAiB,kBAAkB,WAAW,QAAQ;CAE5D,MAAM,mBAAmB,UAAkF;EACzG,MAAM,aAAa,SAAS;EAC5B,MAAM,eAAe,gBAAgB,UAAU,KAAK;EACpD,MAAM,cAAc,eAAe,OAAO,cAAc;EAExD,OAAO,cAAc,KAAK;GACxB,GAAI;GACJ,WAAWC,OAAK,YAAY,aAAa,cAAc,MAAM,SAAS;GACtE,OAAO;IAAE,GAAG;IAAa,GAAG,MAAM;GAAM;EAC1C,CAAC;CACH;CAEA,OAAO,OAAO,OAAO,iBAAiB,GAAG,eAAe,YAAY,CAAC;AACvE,EACJ,CAAC;;;;;;ACjCD,MAAa,OAAO,OAA2B,UAAkD,aAAsB;CACrH,IAAI,CAAC,OAAO,OAAO,KAAA;CAGnB,MAAM,eAAe,CAAC,OAAO,GADT,OAAO,aAAa,WAAW,CAAC,QAAQ,IAAI,QACrB,CAAC,CAAC,KAAK,IAAI;CAEtD,IAAI,CAAC,UAAU,OAAO;CAEtB,OAAO,GAAG,aAAa,IAAI;AAC7B"}

package/package.json

@@ -1,15 +1,16 @@
 {
   "name": "@voiceflow/style",
-  "version": "1.18.1-d62a34e5bb.326+d62a34e5bb",
+  "version": "1.18.2-0cab83efde.52+0cab83efde",
   "files": [
     "build"
   ],
   "type": "module",
-  "main": "build/main.js",
-  "types": "build/main.d.ts",
+  "exports": {
+    ".": "./build/main.mjs"
+  },
   "scripts": {
     "build": "yarn g:turbo run build:cmd --filter=@voiceflow/style...",
-    "build:cmd": "yarn g:build:pkg",
+    "build:cmd": "yarn g:tsdown",
     "clean": "yarn g:rimraf build",
     "lint": "yarn g:run-p -c lint:oxlint lint:oxfmt",
     "lint:oxlint": "yarn g:oxlint .",
@@ -45,5 +46,5 @@
   "volta": {
     "extends": "../../package.json"
   },
-  "gitHead": "d62a34e5bb81701f3598352878597be927a46f2b"
+  "gitHead": "0cab83efdeac6207189632a19dc13e95af07fbce"
 }

package/build/ThemeContext.d.ts

@@ -1,8 +0,0 @@
-export declare const ThemeContext: import("react").Context<string | null>;
-export declare const ThemeConsumer: import("react").Consumer<string | null>;
-export interface ThemeProviderProps extends React.PropsWithChildren {
-    theme: string;
-}
-export declare const ThemeProvider: React.FC<ThemeProviderProps>;
-export declare const useTheme: () => string | null;
-//# sourceMappingURL=ThemeContext.d.ts.map

package/build/ThemeContext.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../src/ThemeContext.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY,wCAAqC,CAAC;AAC/D,eAAO,MAAkB,aAAa,yCAAiB,CAAC;AAExD,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,iBAAiB;IACjE,KAAK,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAEtD,CAAC;AAEF,eAAO,MAAM,QAAQ,qBAAiC,CAAC"}

package/build/ThemeContext.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext } from 'react';
-export const ThemeContext = createContext(null);
-export const { Consumer: ThemeConsumer } = ThemeContext;
-export const ThemeProvider = ({ theme, children }) => (_jsx(ThemeContext.Provider, { value: theme, children: children }));
-export const useTheme = () => useContext(ThemeContext);
-//# sourceMappingURL=ThemeContext.js.map

package/build/ThemeContext.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ThemeContext.js","sourceRoot":"","sources":["../src/ThemeContext.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAElD,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAAgB,IAAI,CAAC,CAAC;AAC/D,MAAM,CAAC,MAAM,EAAE,QAAQ,EAAE,aAAa,EAAE,GAAG,YAAY,CAAC;AAMxD,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAClF,KAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,YAAG,QAAQ,GAAyB,CACxE,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC"}

package/build/__fixtures__/Button/Button.component.d.ts

@@ -1,5 +0,0 @@
-export interface ButtonProps extends React.PropsWithChildren {
-    onClick?: React.MouseEventHandler<HTMLButtonElement>;
-}
-export declare const Button: React.FC<ButtonProps>;
-//# sourceMappingURL=Button.component.d.ts.map

package/build/__fixtures__/Button/Button.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.component.d.ts","sourceRoot":"","sources":["../../../src/__fixtures__/Button/Button.component.tsx"],"names":[],"mappings":"AAEA,MAAM,WAAW,WAAY,SAAQ,KAAK,CAAC,iBAAiB;IAC1D,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CACtD;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAA4E,CAAC"}

package/build/__fixtures__/Button/Button.component.js

@@ -1,4 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as S from './Button.styled.js';
-export const Button = ({ onClick, children }) => _jsx(S.Base, { onClick: onClick, children: children });
-//# sourceMappingURL=Button.component.js.map

package/build/__fixtures__/Button/Button.component.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.component.js","sourceRoot":"","sources":["../../../src/__fixtures__/Button/Button.component.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,CAAC,MAAM,iBAAiB,CAAC;AAMrC,MAAM,CAAC,MAAM,MAAM,GAA0B,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,KAAC,CAAC,CAAC,IAAI,IAAC,OAAO,EAAE,OAAO,YAAG,QAAQ,GAAU,CAAC"}

package/build/__fixtures__/Button/Button.css.d.ts

@@ -1,2 +0,0 @@
-export declare const base: string;
-//# sourceMappingURL=Button.css.d.ts.map

package/build/__fixtures__/Button/Button.css.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.css.d.ts","sourceRoot":"","sources":["../../../src/__fixtures__/Button/Button.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,QAIf,CAAC"}

package/build/__fixtures__/Button/Button.css.js

@@ -1,7 +0,0 @@
-import { style } from '../../main.js';
-export const base = style({
-    padding: 20,
-    borderRadius: 10,
-    margin: 10,
-});
-//# sourceMappingURL=Button.css.js.map

package/build/__fixtures__/Button/Button.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.css.js","sourceRoot":"","sources":["../../../src/__fixtures__/Button/Button.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAC;AAE/B,MAAM,CAAC,MAAM,IAAI,GAAG,KAAK,CAAC;IACxB,OAAO,EAAE,EAAE;IACX,YAAY,EAAE,EAAE;IAChB,MAAM,EAAE,EAAE;CACX,CAAC,CAAC"}

package/build/__fixtures__/Button/Button.styled.d.ts

@@ -1,2 +0,0 @@
-export declare const Base: import("../../main.js").StyledComponent<import("../../main.js").StyledComponentProps<"button", null, null, object>>;
-//# sourceMappingURL=Button.styled.d.ts.map

package/build/__fixtures__/Button/Button.styled.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.styled.d.ts","sourceRoot":"","sources":["../../../src/__fixtures__/Button/Button.styled.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,uGAAwB,CAAC"}

package/build/__fixtures__/Button/Button.styled.js

@@ -1,4 +0,0 @@
-import { styled } from '../../main.js';
-import { base } from './Button.css.js';
-export const Base = styled.button([base]);
-//# sourceMappingURL=Button.styled.js.map

package/build/__fixtures__/Button/Button.styled.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.styled.js","sourceRoot":"","sources":["../../../src/__fixtures__/Button/Button.styled.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAEhC,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,MAAM,CAAC,MAAM,IAAI,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC"}

package/build/__fixtures__/Button/index.d.ts

@@ -1,7 +0,0 @@
-import * as styled from './Button.styled.js';
-import * as css from './Button.css.js';
-export type { ButtonProps } from './Button.component.js';
-export declare const Button: import("react").FC<import("./Button.component.js").ButtonProps> & typeof styled & {
-    css: typeof css;
-};
-//# sourceMappingURL=index.d.ts.map

package/build/__fixtures__/Button/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/__fixtures__/Button/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,MAAM,iBAAiB,CAAC;AAE1C,OAAO,KAAK,GAAG,MAAM,cAAc,CAAC;AAEpC,YAAY,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEtD,eAAO,MAAM,MAAM;;CAAkD,CAAC"}

package/build/__fixtures__/Button/index.js

@@ -1,5 +0,0 @@
-import { Button as ButtonComponent } from './Button.component.js';
-import * as styled from './Button.styled.js';
-import * as css from './Button.css.js';
-export const Button = Object.assign(ButtonComponent, styled, { css });
-//# sourceMappingURL=index.js.map

package/build/__fixtures__/Button/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/__fixtures__/Button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,KAAK,MAAM,MAAM,iBAAiB,CAAC;AAE1C,OAAO,KAAK,GAAG,MAAM,cAAc,CAAC;AAIpC,MAAM,CAAC,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,EAAE,EAAE,GAAG,EAAE,CAAC,CAAC"}

package/build/__fixtures__/InlineThemedButton/InlineThemedButton.component.d.ts

@@ -1,6 +0,0 @@
-import type { ButtonProps } from '../Button/index.js';
-export interface InlineThemedButtonProps extends ButtonProps {
-    brandColor: string;
-}
-export declare const InlineThemedButton: React.FC<InlineThemedButtonProps>;
-//# sourceMappingURL=InlineThemedButton.component.d.ts.map

package/build/__fixtures__/InlineThemedButton/InlineThemedButton.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InlineThemedButton.component.d.ts","sourceRoot":"","sources":["../../../src/__fixtures__/InlineThemedButton/InlineThemedButton.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAK7C,MAAM,WAAW,uBAAwB,SAAQ,WAAW;IAC1D,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAIhE,CAAC"}

package/build/__fixtures__/InlineThemedButton/InlineThemedButton.component.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as S from './InlineThemedButton.styled.js';
-import * as Theme from '../theme.css.js';
-export const InlineThemedButton = ({ brandColor, onClick, children }) => (_jsx(S.Base, { onClick: onClick, theme: { color: { brand: brandColor }, spacing: Theme.spacing }, children: children }));
-//# sourceMappingURL=InlineThemedButton.component.js.map

package/build/__fixtures__/InlineThemedButton/InlineThemedButton.component.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"InlineThemedButton.component.js","sourceRoot":"","sources":["../../../src/__fixtures__/InlineThemedButton/InlineThemedButton.component.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,CAAC,MAAM,6BAA6B,CAAC;AAEjD,OAAO,KAAK,KAAK,MAAM,cAAc,CAAC;AAMtC,MAAM,CAAC,MAAM,kBAAkB,GAAsC,CAAC,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAC1G,KAAC,CAAC,CAAC,IAAI,IAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,YACtF,QAAQ,GACF,CACV,CAAC"}

package/build/__fixtures__/InlineThemedButton/InlineThemedButton.css.d.ts

@@ -1,2 +0,0 @@
-export declare const themed: string;
-//# sourceMappingURL=InlineThemedButton.css.d.ts.map

package/build/__fixtures__/InlineThemedButton/InlineThemedButton.css.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InlineThemedButton.css.d.ts","sourceRoot":"","sources":["../../../src/__fixtures__/InlineThemedButton/InlineThemedButton.css.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM,QAGjB,CAAC"}

package/build/__fixtures__/InlineThemedButton/InlineThemedButton.css.js

@@ -1,7 +0,0 @@
-import { style } from '../../main.js';
-import * as Theme from '../theme.css.js';
-export const themed = style({
-    color: Theme.vars.color.brand,
-    borderRadius: 0,
-});
-//# sourceMappingURL=InlineThemedButton.css.js.map

package/build/__fixtures__/InlineThemedButton/InlineThemedButton.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"InlineThemedButton.css.js","sourceRoot":"","sources":["../../../src/__fixtures__/InlineThemedButton/InlineThemedButton.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAC;AAE/B,OAAO,KAAK,KAAK,MAAM,cAAc,CAAC;AAEtC,MAAM,CAAC,MAAM,MAAM,GAAG,KAAK,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK;IAC7B,YAAY,EAAE,CAAC;CAChB,CAAC,CAAC"}

package/build/__fixtures__/InlineThemedButton/InlineThemedButton.styled.d.ts

@@ -1,11 +0,0 @@
-export declare const Base: import("../../main.js").StyledComponent<import("../../main.js").StyledComponentProps<"button", {
-    color: {
-        brand: `var(--${string})`;
-    };
-    spacing: {
-        sm: `var(--${string})`;
-        md: `var(--${string})`;
-        lg: `var(--${string})`;
-    };
-}, null, object>>;
-//# sourceMappingURL=InlineThemedButton.styled.d.ts.map

package/build/__fixtures__/InlineThemedButton/InlineThemedButton.styled.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InlineThemedButton.styled.d.ts","sourceRoot":"","sources":["../../../src/__fixtures__/InlineThemedButton/InlineThemedButton.styled.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,IAAI;;;;;;;;;iBAA8D,CAAC"}

package/build/__fixtures__/InlineThemedButton/InlineThemedButton.styled.js

@@ -1,6 +0,0 @@
-import { styled } from '../../main.js';
-import { Button } from '../Button/index.js';
-import * as Theme from '../theme.css.js';
-import { themed } from './InlineThemedButton.css.js';
-export const Base = styled.button([Button.Base, themed], { theme: Theme.vars });
-//# sourceMappingURL=InlineThemedButton.styled.js.map

package/build/__fixtures__/InlineThemedButton/InlineThemedButton.styled.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"InlineThemedButton.styled.js","sourceRoot":"","sources":["../../../src/__fixtures__/InlineThemedButton/InlineThemedButton.styled.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAEhC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAEnC,OAAO,KAAK,KAAK,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,MAAM,CAAC,MAAM,IAAI,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC"}

package/build/__fixtures__/InlineThemedButton/index.d.ts

@@ -1,5 +0,0 @@
-import * as css from './InlineThemedButton.css.js';
-export declare const InlineThemedButton: import("react").FC<import("./InlineThemedButton.component.js").InlineThemedButtonProps> & {
-    css: typeof css;
-};
-//# sourceMappingURL=index.d.ts.map

package/build/__fixtures__/InlineThemedButton/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/__fixtures__/InlineThemedButton/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,GAAG,MAAM,0BAA0B,CAAC;AAEhD,eAAO,MAAM,kBAAkB;;CAAsD,CAAC"}

package/build/__fixtures__/InlineThemedButton/index.js

@@ -1,4 +0,0 @@
-import { InlineThemedButton as InlineThemedButtonComponent } from './InlineThemedButton.component.js';
-import * as css from './InlineThemedButton.css.js';
-export const InlineThemedButton = Object.assign(InlineThemedButtonComponent, { css });
-//# sourceMappingURL=index.js.map

package/build/__fixtures__/InlineThemedButton/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/__fixtures__/InlineThemedButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,IAAI,2BAA2B,EAAE,MAAM,gCAAgC,CAAC;AAEnG,OAAO,KAAK,GAAG,MAAM,0BAA0B,CAAC;AAEhD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,MAAM,CAAC,2BAA2B,EAAE,EAAE,GAAG,EAAE,CAAC,CAAC"}

package/build/__fixtures__/InlineVarButton/InlineVarButton.component.d.ts

@@ -1,6 +0,0 @@
-import type { ButtonProps } from '../Button/index.js';
-export interface InlineVarButtonProps extends ButtonProps {
-    brandColor: string;
-}
-export declare const InlineVarButton: React.FC<InlineVarButtonProps>;
-//# sourceMappingURL=InlineVarButton.component.d.ts.map

package/build/__fixtures__/InlineVarButton/InlineVarButton.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InlineVarButton.component.d.ts","sourceRoot":"","sources":["../../../src/__fixtures__/InlineVarButton/InlineVarButton.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAG7C,MAAM,WAAW,oBAAqB,SAAQ,WAAW;IACvD,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAI1D,CAAC"}

package/build/__fixtures__/InlineVarButton/InlineVarButton.component.js

@@ -1,4 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as S from './InlineVarButton.styled.js';
-export const InlineVarButton = ({ brandColor, onClick, children }) => (_jsx(S.Base, { onClick: onClick, vars: { brandColor }, children: children }));
-//# sourceMappingURL=InlineVarButton.component.js.map

package/build/__fixtures__/InlineVarButton/InlineVarButton.component.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"InlineVarButton.component.js","sourceRoot":"","sources":["../../../src/__fixtures__/InlineVarButton/InlineVarButton.component.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,CAAC,MAAM,0BAA0B,CAAC;AAM9C,MAAM,CAAC,MAAM,eAAe,GAAmC,CAAC,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CACpG,KAAC,CAAC,CAAC,IAAI,IAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,UAAU,EAAE,YAC3C,QAAQ,GACF,CACV,CAAC"}

package/build/__fixtures__/InlineVarButton/InlineVarButton.css.d.ts

@@ -1,3 +0,0 @@
-export declare const colorVar: `var(--${string})`;
-export declare const base: string;
-//# sourceMappingURL=InlineVarButton.css.d.ts.map

package/build/__fixtures__/InlineVarButton/InlineVarButton.css.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InlineVarButton.css.d.ts","sourceRoot":"","sources":["../../../src/__fixtures__/InlineVarButton/InlineVarButton.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,QAAQ,oBAAc,CAAC;AAEpC,eAAO,MAAM,IAAI,QAOf,CAAC"}

package/build/__fixtures__/InlineVarButton/InlineVarButton.css.js

@@ -1,10 +0,0 @@
-import { createVar, style } from '../../main.js';
-export const colorVar = createVar();
-export const base = style({
-    vars: {
-        [colorVar]: 'red',
-    },
-    backgroundColor: colorVar,
-    borderRadius: 0,
-});
-//# sourceMappingURL=InlineVarButton.css.js.map