@channel.io/bezier-react 3.0.0 → 3.0.2

package/dist/cjs/components/AlphaTokenProvider/TokenProvider.js

@@ -0,0 +1,40 @@
+'use strict';
+
+var React = require('react');
+var index = require('../../packages/bezier-tokens/dist/alpha/esm/index.js');
+var react = require('../../utils/react.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+const [TokenContextProvider, useTokenContext] =
+// FIXME: (@ed) Remove Alpha prefix after the migration is done
+react.createContext(null, 'AlphaTokenProvider');
+const tokenSet = Object.freeze({
+  light: {
+    global: index.tokens.global,
+    semantic: index.tokens.lightTheme
+  },
+  dark: {
+    global: index.tokens.global,
+    semantic: index.tokens.darkTheme
+  }
+});
+
+/**
+ * @private
+ */
+function TokenProvider({
+  themeName,
+  children
+}) {
+  return /*#__PURE__*/jsxRuntime.jsx(TokenContextProvider, {
+    value: React.useMemo(() => ({
+      themeName,
+      tokens: tokenSet[themeName]
+    }), [themeName]),
+    children: children
+  });
+}
+
+exports.TokenProvider = TokenProvider;
+exports.useAlphaTokenContext = useTokenContext;
+//# sourceMappingURL=TokenProvider.js.map

package/dist/cjs/components/AlphaTokenProvider/TokenProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TokenProvider.js","sources":["../../../../src/components/AlphaTokenProvider/TokenProvider.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo } from 'react'\n\nimport { tokens } from '@channel.io/bezier-tokens/alpha'\n\nimport { type ThemeName } from '~/src/types/tokens'\nimport { createContext } from '~/src/utils/react'\n\nimport {\n  type ThemeSpecificTokens,\n  type TokenContextValue,\n  type TokenProviderProps,\n} from './TokenProvider.types'\n\nconst [TokenContextProvider, useTokenContext] =\n  // FIXME: (@ed) Remove Alpha prefix after the migration is done\n  createContext<TokenContextValue | null>(null, 'AlphaTokenProvider')\n\nexport { useTokenContext as useAlphaTokenContext }\n\nconst tokenSet: Record<ThemeName, ThemeSpecificTokens> = Object.freeze({\n  light: {\n    global: tokens.global,\n    semantic: tokens.lightTheme,\n  },\n  dark: {\n    global: tokens.global,\n    semantic: tokens.darkTheme,\n  },\n})\n\n/**\n * @private\n */\nexport function TokenProvider({ themeName, children }: TokenProviderProps) {\n  return (\n    <TokenContextProvider\n      value={useMemo(\n        () => ({\n          themeName,\n          tokens: tokenSet[themeName],\n        }),\n        [themeName]\n      )}\n    >\n      {children}\n    </TokenContextProvider>\n  )\n}\n"],"names":["TokenContextProvider","useTokenContext","createContext","tokenSet","Object","freeze","light","global","tokens","semantic","lightTheme","dark","darkTheme","TokenProvider","themeName","children","_jsx","value","useMemo"],"mappings":";;;;;;;AAeA,MAAM,CAACA,oBAAoB,EAAEC,eAAe,CAAC;AAC3C;AACAC,mBAAa,CAA2B,IAAI,EAAE,oBAAoB;AAIpE,MAAMC,QAAgD,GAAGC,MAAM,CAACC,MAAM,CAAC;AACrEC,EAAAA,KAAK,EAAE;IACLC,MAAM,EAAEC,YAAM,CAACD,MAAM;IACrBE,QAAQ,EAAED,YAAM,CAACE;GAClB;AACDC,EAAAA,IAAI,EAAE;IACJJ,MAAM,EAAEC,YAAM,CAACD,MAAM;IACrBE,QAAQ,EAAED,YAAM,CAACI;AACnB;AACF,CAAC,CAAC;;AAEF;AACA;AACA;AACO,SAASC,aAAaA,CAAC;EAAEC,SAAS;AAAEC,EAAAA;AAA6B,CAAC,EAAE;EACzE,oBACEC,cAAA,CAAChB,oBAAoB,EAAA;IACnBiB,KAAK,EAAEC,aAAO,CACZ,OAAO;MACLJ,SAAS;MACTN,MAAM,EAAEL,QAAQ,CAACW,SAAS;AAC5B,KAAC,CAAC,EACF,CAACA,SAAS,CACZ,CAAE;AAAAC,IAAAA,QAAA,EAEDA;AAAQ,GACW,CAAC;AAE3B;;;;;"}

package/dist/cjs/components/AppProvider/AppProvider.js

@@ -6,6 +6,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var WindowProvider = require('../WindowProvider/WindowProvider.js');
 var FeatureProvider = require('../FeatureProvider/FeatureProvider.js');
 var TokenProvider = require('../TokenProvider/TokenProvider.js');
+var TokenProvider$1 = require('../AlphaTokenProvider/TokenProvider.js');
 
 const defaultWindow = ssrWindow_esm.getWindow();
 
@@ -48,7 +49,10 @@ function AppProvider({
       features: features,
       children: /*#__PURE__*/jsxRuntime.jsx(TokenProvider.TokenProvider, {
         themeName: themeName,
-        children: children
+        children: /*#__PURE__*/jsxRuntime.jsx(TokenProvider$1.TokenProvider, {
+          themeName: themeName,
+          children: children
+        })
       })
     })
   });

package/dist/cjs/components/AppProvider/AppProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppProvider.js","sources":["../../../../src/components/AppProvider/AppProvider.tsx"],"sourcesContent":["'use client'\n\nimport { useEffect } from 'react'\n\nimport { getWindow } from 'ssr-window'\n\nimport { FeatureProvider } from '~/src/components/FeatureProvider'\nimport { TokenProvider } from '~/src/components/TokenProvider'\nimport { WindowProvider } from '~/src/components/WindowProvider'\n\nimport { type AppProviderProps } from './AppProvider.types'\n\nconst defaultWindow = getWindow()\n\n/**\n * `AppProvider` is a required wrapper component that provides context for the app.\n * @example\n *\n * ```tsx\n * import React from 'react'\n * import { createRoot } from 'react-dom/client'\n * import { AppProvider } from '@channel.io/bezier-react'\n *\n * const container = document.getElementById('root')\n * const root = createRoot(container)\n *\n * root.render(\n *   <AppProvider themeName=\"light\">\n *     <App />\n *   </AppProvider>,\n * )\n * ```\n */\nexport function AppProvider({\n  children,\n  themeName = 'light',\n  features = [],\n  window = defaultWindow,\n}: AppProviderProps) {\n  useEffect(\n    function updateRootThemeDataAttribute() {\n      const rootElement = window.document.documentElement\n      // TODO: Change data attribute constant to import from bezier-tokens\n      rootElement.setAttribute('data-bezier-theme', themeName)\n      return function cleanup() {\n        rootElement.removeAttribute('data-bezier-theme')\n      }\n    },\n    [window, themeName]\n  )\n\n  return (\n    <WindowProvider window={window}>\n      <FeatureProvider features={features}>\n        <TokenProvider themeName={themeName}>{children}</TokenProvider>\n      </FeatureProvider>\n    </WindowProvider>\n  )\n}\n"],"names":["defaultWindow","getWindow","AppProvider","children","themeName","features","window","useEffect","updateRootThemeDataAttribute","rootElement","document","documentElement","setAttribute","cleanup","removeAttribute","_jsx","WindowProvider","FeatureProvider","TokenProvider"],"mappings":";;;;;;;;;AAYA,MAAMA,aAAa,GAAGC,uBAAS,EAAE;;AAEjC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,WAAWA,CAAC;EAC1BC,QAAQ;AACRC,EAAAA,SAAS,GAAG,OAAO;AACnBC,EAAAA,QAAQ,GAAG,EAAE;AACbC,EAAAA,MAAM,GAAGN;AACO,CAAC,EAAE;AACnBO,EAAAA,eAAS,CACP,SAASC,4BAA4BA,GAAG;AACtC,IAAA,MAAMC,WAAW,GAAGH,MAAM,CAACI,QAAQ,CAACC,eAAe;AACnD;AACAF,IAAAA,WAAW,CAACG,YAAY,CAAC,mBAAmB,EAAER,SAAS,CAAC;IACxD,OAAO,SAASS,OAAOA,GAAG;AACxBJ,MAAAA,WAAW,CAACK,eAAe,CAAC,mBAAmB,CAAC;KACjD;AACH,GAAC,EACD,CAACR,MAAM,EAAEF,SAAS,CACpB,CAAC;EAED,oBACEW,cAAA,CAACC,6BAAc,EAAA;AAACV,IAAAA,MAAM,EAAEA,MAAO;IAAAH,QAAA,eAC7BY,cAAA,CAACE,+BAAe,EAAA;AAACZ,MAAAA,QAAQ,EAAEA,QAAS;MAAAF,QAAA,eAClCY,cAAA,CAACG,2BAAa,EAAA;AAACd,QAAAA,SAAS,EAAEA,SAAU;AAAAD,QAAAA,QAAA,EAAEA;OAAwB;KAC/C;AAAC,GACJ,CAAC;AAErB;;;;"}
+{"version":3,"file":"AppProvider.js","sources":["../../../../src/components/AppProvider/AppProvider.tsx"],"sourcesContent":["'use client'\n\nimport { useEffect } from 'react'\n\nimport { getWindow } from 'ssr-window'\n\nimport { AlphaTokenProvider } from '~/src/components/AlphaTokenProvider'\nimport { FeatureProvider } from '~/src/components/FeatureProvider'\nimport { TokenProvider } from '~/src/components/TokenProvider'\nimport { WindowProvider } from '~/src/components/WindowProvider'\n\nimport { type AppProviderProps } from './AppProvider.types'\n\nconst defaultWindow = getWindow()\n\n/**\n * `AppProvider` is a required wrapper component that provides context for the app.\n * @example\n *\n * ```tsx\n * import React from 'react'\n * import { createRoot } from 'react-dom/client'\n * import { AppProvider } from '@channel.io/bezier-react'\n *\n * const container = document.getElementById('root')\n * const root = createRoot(container)\n *\n * root.render(\n *   <AppProvider themeName=\"light\">\n *     <App />\n *   </AppProvider>,\n * )\n * ```\n */\nexport function AppProvider({\n  children,\n  themeName = 'light',\n  features = [],\n  window = defaultWindow,\n}: AppProviderProps) {\n  useEffect(\n    function updateRootThemeDataAttribute() {\n      const rootElement = window.document.documentElement\n      // TODO: Change data attribute constant to import from bezier-tokens\n      rootElement.setAttribute('data-bezier-theme', themeName)\n      return function cleanup() {\n        rootElement.removeAttribute('data-bezier-theme')\n      }\n    },\n    [window, themeName]\n  )\n\n  return (\n    <WindowProvider window={window}>\n      <FeatureProvider features={features}>\n        <TokenProvider themeName={themeName}>\n          <AlphaTokenProvider themeName={themeName}>\n            {children}\n          </AlphaTokenProvider>\n        </TokenProvider>\n      </FeatureProvider>\n    </WindowProvider>\n  )\n}\n"],"names":["defaultWindow","getWindow","AppProvider","children","themeName","features","window","useEffect","updateRootThemeDataAttribute","rootElement","document","documentElement","setAttribute","cleanup","removeAttribute","_jsx","WindowProvider","FeatureProvider","TokenProvider","AlphaTokenProvider"],"mappings":";;;;;;;;;;AAaA,MAAMA,aAAa,GAAGC,uBAAS,EAAE;;AAEjC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,WAAWA,CAAC;EAC1BC,QAAQ;AACRC,EAAAA,SAAS,GAAG,OAAO;AACnBC,EAAAA,QAAQ,GAAG,EAAE;AACbC,EAAAA,MAAM,GAAGN;AACO,CAAC,EAAE;AACnBO,EAAAA,eAAS,CACP,SAASC,4BAA4BA,GAAG;AACtC,IAAA,MAAMC,WAAW,GAAGH,MAAM,CAACI,QAAQ,CAACC,eAAe;AACnD;AACAF,IAAAA,WAAW,CAACG,YAAY,CAAC,mBAAmB,EAAER,SAAS,CAAC;IACxD,OAAO,SAASS,OAAOA,GAAG;AACxBJ,MAAAA,WAAW,CAACK,eAAe,CAAC,mBAAmB,CAAC;KACjD;AACH,GAAC,EACD,CAACR,MAAM,EAAEF,SAAS,CACpB,CAAC;EAED,oBACEW,cAAA,CAACC,6BAAc,EAAA;AAACV,IAAAA,MAAM,EAAEA,MAAO;IAAAH,QAAA,eAC7BY,cAAA,CAACE,+BAAe,EAAA;AAACZ,MAAAA,QAAQ,EAAEA,QAAS;MAAAF,QAAA,eAClCY,cAAA,CAACG,2BAAa,EAAA;AAACd,QAAAA,SAAS,EAAEA,SAAU;QAAAD,QAAA,eAClCY,cAAA,CAACI,6BAAkB,EAAA;AAACf,UAAAA,SAAS,EAAEA,SAAU;AAAAD,UAAAA,QAAA,EACtCA;SACiB;OACP;KACA;AAAC,GACJ,CAAC;AAErB;;;;"}

package/dist/cjs/components/Banner/Banner.js

@@ -71,12 +71,12 @@ const Banner = /*#__PURE__*/React.forwardRef(function Banner({
     children: [!type.isNil(icon) && /*#__PURE__*/jsxRuntime.jsx("div", {
       className: Banner_module.default.Center,
       children: bezierIcons.isBezierIcon(icon) ? /*#__PURE__*/jsxRuntime.jsx(Icon.Icon, {
-        className: Banner_module.default.Icon,
+        className: index.default(!iconColor && Banner_module.default.Icon),
         source: icon,
         color: iconColor,
         size: "s"
       }) : /*#__PURE__*/jsxRuntime.jsx(LegacyIcon.LegacyIcon, {
-        className: Banner_module.default.Icon,
+        className: index.default(!iconColor && Banner_module.default.Icon),
         name: icon,
         color: iconColor,
         size: "s"

package/dist/cjs/components/Banner/Banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.js","sources":["../../../../src/components/Banner/Banner.tsx"],"sourcesContent":["'use client'\n\nimport { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { warn } from '~/src/utils/assert'\nimport { isNil } from '~/src/utils/type'\n\nimport { Button } from '~/src/components/Button'\nimport { Icon } from '~/src/components/Icon'\nimport { LegacyIcon, isIconName } from '~/src/components/LegacyIcon'\nimport { Text } from '~/src/components/Text'\n\nimport {\n  type BannerProps,\n  type BannerVariant,\n  type RenderLinkFunc,\n} from './Banner.types'\n\nimport styles from './Banner.module.scss'\n\nconst BANNER_TEST_ID = 'bezier-banner'\n\nfunction getActionButtonColorVariant(variant: BannerVariant) {\n  return (\n    {\n      default: 'monochrome-dark',\n      blue: 'blue',\n      cobalt: 'cobalt',\n      green: 'green',\n      orange: 'orange',\n      red: 'red',\n      alt: 'monochrome-dark',\n    } as const\n  )[variant]\n}\n\nconst externalLinkRenderer: RenderLinkFunc = ({ content, linkTo }) => (\n  <a\n    href={linkTo}\n    target=\"_blank\"\n    rel=\"noopener noreferrer\"\n  >\n    {content}\n  </a>\n)\n\n/**\n * `Banner` is a component you use when you want to communicate instructions, warnings, recommendations, and other information well.\n * @example\n * ```tsx\n * <Banner\n *   variant=\"blue\"\n *   icon={LightbulbIcon}\n *   content=\"Information here.\"\n * />\n * ```\n */\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>(function Banner(\n  {\n    className,\n    variant = 'default',\n    icon,\n    iconColor,\n    content,\n    hasLink = false,\n    linkText,\n    linkTo,\n    renderLink = externalLinkRenderer,\n    actionIcon,\n    onClickAction,\n    ...rest\n  },\n  forwardedRef\n) {\n  if (isIconName(icon)) {\n    warn(\n      'Deprecation: IconName as a value for the icon property of Banner has been deprecated. Use the Icon of bezier-icons instead.'\n    )\n  }\n\n  return (\n    <div\n      ref={forwardedRef}\n      className={classNames(\n        styles.Banner,\n        styles[`variant-${variant}`],\n        className\n      )}\n      data-testid={BANNER_TEST_ID}\n      {...rest}\n    >\n      {!isNil(icon) && (\n        <div className={styles.Center}>\n          {isBezierIcon(icon) ? (\n            <Icon\n              className={styles.Icon}\n              source={icon}\n              color={iconColor}\n              size=\"s\"\n            />\n          ) : (\n            <LegacyIcon\n              className={styles.Icon}\n              name={icon}\n              color={iconColor}\n              size=\"s\"\n            />\n          )}\n        </div>\n      )}\n\n      <div className={styles.Content}>\n        <Text typo=\"14\">\n          {content}\n\n          {hasLink &&\n            renderLink({\n              content: (\n                <Text\n                  className={styles.Link}\n                  typo=\"14\"\n                  bold\n                >\n                  {linkText}\n                </Text>\n              ),\n              linkTo,\n            })}\n        </Text>\n      </div>\n\n      {!isNil(actionIcon) && (\n        <div className={styles.Center}>\n          <Button\n            size=\"xs\"\n            colorVariant={getActionButtonColorVariant(variant)}\n            styleVariant=\"tertiary\"\n            leftContent={actionIcon}\n            onClick={onClickAction}\n          />\n        </div>\n      )}\n    </div>\n  )\n})\n"],"names":["BANNER_TEST_ID","getActionButtonColorVariant","variant","default","blue","cobalt","green","orange","red","alt","externalLinkRenderer","content","linkTo","_jsx","href","target","rel","children","Banner","forwardRef","className","icon","iconColor","hasLink","linkText","renderLink","actionIcon","onClickAction","rest","forwardedRef","isIconName","warn","_jsxs","ref","classNames","styles","isNil","Center","isBezierIcon","Icon","source","color","size","LegacyIcon","name","Content","Text","typo","Link","bold","Button","colorVariant","styleVariant","leftContent","onClick"],"mappings":"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"}
+{"version":3,"file":"Banner.js","sources":["../../../../src/components/Banner/Banner.tsx"],"sourcesContent":["'use client'\n\nimport { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { warn } from '~/src/utils/assert'\nimport { isNil } from '~/src/utils/type'\n\nimport { Button } from '~/src/components/Button'\nimport { Icon } from '~/src/components/Icon'\nimport { LegacyIcon, isIconName } from '~/src/components/LegacyIcon'\nimport { Text } from '~/src/components/Text'\n\nimport {\n  type BannerProps,\n  type BannerVariant,\n  type RenderLinkFunc,\n} from './Banner.types'\n\nimport styles from './Banner.module.scss'\n\nconst BANNER_TEST_ID = 'bezier-banner'\n\nfunction getActionButtonColorVariant(variant: BannerVariant) {\n  return (\n    {\n      default: 'monochrome-dark',\n      blue: 'blue',\n      cobalt: 'cobalt',\n      green: 'green',\n      orange: 'orange',\n      red: 'red',\n      alt: 'monochrome-dark',\n    } as const\n  )[variant]\n}\n\nconst externalLinkRenderer: RenderLinkFunc = ({ content, linkTo }) => (\n  <a\n    href={linkTo}\n    target=\"_blank\"\n    rel=\"noopener noreferrer\"\n  >\n    {content}\n  </a>\n)\n\n/**\n * `Banner` is a component you use when you want to communicate instructions, warnings, recommendations, and other information well.\n * @example\n * ```tsx\n * <Banner\n *   variant=\"blue\"\n *   icon={LightbulbIcon}\n *   content=\"Information here.\"\n * />\n * ```\n */\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>(function Banner(\n  {\n    className,\n    variant = 'default',\n    icon,\n    iconColor,\n    content,\n    hasLink = false,\n    linkText,\n    linkTo,\n    renderLink = externalLinkRenderer,\n    actionIcon,\n    onClickAction,\n    ...rest\n  },\n  forwardedRef\n) {\n  if (isIconName(icon)) {\n    warn(\n      'Deprecation: IconName as a value for the icon property of Banner has been deprecated. Use the Icon of bezier-icons instead.'\n    )\n  }\n\n  return (\n    <div\n      ref={forwardedRef}\n      className={classNames(\n        styles.Banner,\n        styles[`variant-${variant}`],\n        className\n      )}\n      data-testid={BANNER_TEST_ID}\n      {...rest}\n    >\n      {!isNil(icon) && (\n        <div className={styles.Center}>\n          {isBezierIcon(icon) ? (\n            <Icon\n              className={classNames(!iconColor && styles.Icon)}\n              source={icon}\n              color={iconColor}\n              size=\"s\"\n            />\n          ) : (\n            <LegacyIcon\n              className={classNames(!iconColor && styles.Icon)}\n              name={icon}\n              color={iconColor}\n              size=\"s\"\n            />\n          )}\n        </div>\n      )}\n\n      <div className={styles.Content}>\n        <Text typo=\"14\">\n          {content}\n\n          {hasLink &&\n            renderLink({\n              content: (\n                <Text\n                  className={styles.Link}\n                  typo=\"14\"\n                  bold\n                >\n                  {linkText}\n                </Text>\n              ),\n              linkTo,\n            })}\n        </Text>\n      </div>\n\n      {!isNil(actionIcon) && (\n        <div className={styles.Center}>\n          <Button\n            size=\"xs\"\n            colorVariant={getActionButtonColorVariant(variant)}\n            styleVariant=\"tertiary\"\n            leftContent={actionIcon}\n            onClick={onClickAction}\n          />\n        </div>\n      )}\n    </div>\n  )\n})\n"],"names":["BANNER_TEST_ID","getActionButtonColorVariant","variant","default","blue","cobalt","green","orange","red","alt","externalLinkRenderer","content","linkTo","_jsx","href","target","rel","children","Banner","forwardRef","className","icon","iconColor","hasLink","linkText","renderLink","actionIcon","onClickAction","rest","forwardedRef","isIconName","warn","_jsxs","ref","classNames","styles","isNil","Center","isBezierIcon","Icon","source","color","size","LegacyIcon","name","Content","Text","typo","Link","bold","Button","colorVariant","styleVariant","leftContent","onClick"],"mappings":"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"}

package/dist/cjs/components/ThemeProvider/ThemeProvider.js

@@ -4,6 +4,7 @@ var React = require('react');
 var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
 var jsxRuntime = require('react/jsx-runtime');
 var TokenProvider = require('../TokenProvider/TokenProvider.js');
+var TokenProvider$1 = require('../AlphaTokenProvider/TokenProvider.js');
 
 /**
  * `useThemeName` is a hook that returns the current theme name.
@@ -19,6 +20,14 @@ function useTokens() {
   return TokenProvider.useTokenContext('useTokens').tokens;
 }
 
+/**
+ * `useAlphaTokens` is a hook that returns the alpha tokens of the current theme.
+ * @internal
+ */
+function useAlphaTokens() {
+  return TokenProvider$1.useAlphaTokenContext('useAlphaTokens').tokens;
+}
+
 /**
  * `ThemeProvider` is a wrapper component that provides theme context.
  *
@@ -31,13 +40,16 @@ const ThemeProvider = /*#__PURE__*/React.forwardRef(function ThemeProvider({
 }, forwardedRef) {
   return /*#__PURE__*/jsxRuntime.jsx(TokenProvider.TokenProvider, {
     themeName: themeName,
-    children: /*#__PURE__*/jsxRuntime.jsx(index.Slot, {
-      ref: forwardedRef
-      // TODO: Change data attribute constant to import from bezier-tokens
-      ,
-      "data-bezier-theme": themeName,
-      ...rest,
-      children: children
+    children: /*#__PURE__*/jsxRuntime.jsx(TokenProvider$1.TokenProvider, {
+      themeName: themeName,
+      children: /*#__PURE__*/jsxRuntime.jsx(index.Slot, {
+        ref: forwardedRef
+        // TODO: Change data attribute constant to import from bezier-tokens
+        ,
+        "data-bezier-theme": themeName,
+        ...rest,
+        children: children
+      })
     })
   });
 });
@@ -95,6 +107,7 @@ exports.DarkThemeProvider = DarkThemeProvider;
 exports.InvertedThemeProvider = InvertedThemeProvider;
 exports.LightThemeProvider = LightThemeProvider;
 exports.ThemeProvider = ThemeProvider;
+exports.useAlphaTokens = useAlphaTokens;
 exports.useThemeName = useThemeName;
 exports.useTokens = useTokens;
 //# sourceMappingURL=ThemeProvider.js.map

package/dist/cjs/components/ThemeProvider/ThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.js","sources":["../../../../src/components/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["'use client'\n\nimport { forwardRef } from 'react'\n\nimport { Slot } from '@radix-ui/react-slot'\n\nimport { TokenProvider, useTokenContext } from '~/src/components/TokenProvider'\n\nimport {\n  type FixedThemeProviderProps,\n  type ThemeProviderProps,\n} from './ThemeProvider.types'\n\n/**\n * `useThemeName` is a hook that returns the current theme name.\n */\nexport function useThemeName() {\n  return useTokenContext('useThemeName').themeName\n}\n\n/**\n * `useTokens` is a hook that returns the design tokens of the current theme.\n */\nexport function useTokens() {\n  return useTokenContext('useTokens').tokens\n}\n\n/**\n * `ThemeProvider` is a wrapper component that provides theme context.\n *\n * Components that pass to children **must spread props and forward ref.**\n */\nexport const ThemeProvider = forwardRef<HTMLElement, ThemeProviderProps>(\n  function ThemeProvider({ themeName, children, ...rest }, forwardedRef) {\n    return (\n      <TokenProvider themeName={themeName}>\n        <Slot\n          ref={forwardedRef}\n          // TODO: Change data attribute constant to import from bezier-tokens\n          data-bezier-theme={themeName}\n          {...rest}\n        >\n          {children}\n        </Slot>\n      </TokenProvider>\n    )\n  }\n)\n\n/**\n * `LightThemeProvider` is a wrapper component that provides light theme context.\n *\n * Components that pass to children **must spread props and forward ref.**\n */\nexport const LightThemeProvider = forwardRef<\n  HTMLElement,\n  FixedThemeProviderProps\n>(function LightTheme({ children, ...rest }, forwardedRef) {\n  return (\n    <ThemeProvider\n      ref={forwardedRef}\n      themeName=\"light\"\n      {...rest}\n    >\n      {children}\n    </ThemeProvider>\n  )\n})\n\n/**\n * `DarkThemeProvider` is a wrapper component that provides dark theme context.\n *\n * Components that pass to children **must spread props and forward ref.**\n */\nexport const DarkThemeProvider = forwardRef<\n  HTMLElement,\n  FixedThemeProviderProps\n>(function DarkTheme({ children, ...rest }, forwardedRef) {\n  return (\n    <ThemeProvider\n      ref={forwardedRef}\n      themeName=\"dark\"\n      {...rest}\n    >\n      {children}\n    </ThemeProvider>\n  )\n})\n\n/**\n * `InvertedThemeProvider` is a wrapper component that provides inverted theme context.\n */\nexport const InvertedThemeProvider = forwardRef<\n  HTMLElement,\n  FixedThemeProviderProps\n>(function InvertedTheme({ children, ...rest }, forwardedRef) {\n  return (\n    <ThemeProvider\n      ref={forwardedRef}\n      themeName={useThemeName() === 'light' ? 'dark' : 'light'}\n      {...rest}\n    >\n      {children}\n    </ThemeProvider>\n  )\n})\n"],"names":["useThemeName","useTokenContext","themeName","useTokens","tokens","ThemeProvider","forwardRef","children","rest","forwardedRef","_jsx","TokenProvider","Slot","ref","LightThemeProvider","LightTheme","DarkThemeProvider","DarkTheme","InvertedThemeProvider","InvertedTheme"],"mappings":";;;;;;;AAaA;AACA;AACA;AACO,SAASA,YAAYA,GAAG;AAC7B,EAAA,OAAOC,6BAAe,CAAC,cAAc,CAAC,CAACC,SAAS;AAClD;;AAEA;AACA;AACA;AACO,SAASC,SAASA,GAAG;AAC1B,EAAA,OAAOF,6BAAe,CAAC,WAAW,CAAC,CAACG,MAAM;AAC5C;;AAEA;AACA;AACA;AACA;AACA;MACaC,aAAa,gBAAGC,gBAAU,CACrC,SAASD,aAAaA,CAAC;EAAEH,SAAS;EAAEK,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,YAAY,EAAE;EACrE,oBACEC,cAAA,CAACC,2BAAa,EAAA;AAACT,IAAAA,SAAS,EAAEA,SAAU;IAAAK,QAAA,eAClCG,cAAA,CAACE,UAAI,EAAA;AACHC,MAAAA,GAAG,EAAEJ;AACL;AAAA;AACA,MAAA,mBAAA,EAAmBP,SAAU;AAAA,MAAA,GACzBM,IAAI;AAAAD,MAAAA,QAAA,EAEPA;KACG;AAAC,GACM,CAAC;AAEpB,CACF;;AAEA;AACA;AACA;AACA;AACA;MACaO,kBAAkB,gBAAGR,gBAAU,CAG1C,SAASS,UAAUA,CAAC;EAAER,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,YAAY,EAAE;EACzD,oBACEC,cAAA,CAACL,aAAa,EAAA;AACZQ,IAAAA,GAAG,EAAEJ,YAAa;AAClBP,IAAAA,SAAS,EAAC,OAAO;AAAA,IAAA,GACbM,IAAI;AAAAD,IAAAA,QAAA,EAEPA;AAAQ,GACI,CAAC;AAEpB,CAAC;;AAED;AACA;AACA;AACA;AACA;MACaS,iBAAiB,gBAAGV,gBAAU,CAGzC,SAASW,SAASA,CAAC;EAAEV,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,YAAY,EAAE;EACxD,oBACEC,cAAA,CAACL,aAAa,EAAA;AACZQ,IAAAA,GAAG,EAAEJ,YAAa;AAClBP,IAAAA,SAAS,EAAC,MAAM;AAAA,IAAA,GACZM,IAAI;AAAAD,IAAAA,QAAA,EAEPA;AAAQ,GACI,CAAC;AAEpB,CAAC;;AAED;AACA;AACA;MACaW,qBAAqB,gBAAGZ,gBAAU,CAG7C,SAASa,aAAaA,CAAC;EAAEZ,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,YAAY,EAAE;EAC5D,oBACEC,cAAA,CAACL,aAAa,EAAA;AACZQ,IAAAA,GAAG,EAAEJ,YAAa;IAClBP,SAAS,EAAEF,YAAY,EAAE,KAAK,OAAO,GAAG,MAAM,GAAG,OAAQ;AAAA,IAAA,GACrDQ,IAAI;AAAAD,IAAAA,QAAA,EAEPA;AAAQ,GACI,CAAC;AAEpB,CAAC;;;;;;;;;"}
+{"version":3,"file":"ThemeProvider.js","sources":["../../../../src/components/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["'use client'\n\nimport { forwardRef } from 'react'\n\nimport { Slot } from '@radix-ui/react-slot'\n\nimport {\n  AlphaTokenProvider,\n  useAlphaTokenContext,\n} from '~/src/components/AlphaTokenProvider'\nimport { TokenProvider, useTokenContext } from '~/src/components/TokenProvider'\n\nimport {\n  type FixedThemeProviderProps,\n  type ThemeProviderProps,\n} from './ThemeProvider.types'\n\n/**\n * `useThemeName` is a hook that returns the current theme name.\n */\nexport function useThemeName() {\n  return useTokenContext('useThemeName').themeName\n}\n\n/**\n * `useTokens` is a hook that returns the design tokens of the current theme.\n */\nexport function useTokens() {\n  return useTokenContext('useTokens').tokens\n}\n\n/**\n * `useAlphaTokens` is a hook that returns the alpha tokens of the current theme.\n * @internal\n */\nexport function useAlphaTokens() {\n  return useAlphaTokenContext('useAlphaTokens').tokens\n}\n\n/**\n * `ThemeProvider` is a wrapper component that provides theme context.\n *\n * Components that pass to children **must spread props and forward ref.**\n */\nexport const ThemeProvider = forwardRef<HTMLElement, ThemeProviderProps>(\n  function ThemeProvider({ themeName, children, ...rest }, forwardedRef) {\n    return (\n      <TokenProvider themeName={themeName}>\n        <AlphaTokenProvider themeName={themeName}>\n          <Slot\n            ref={forwardedRef}\n            // TODO: Change data attribute constant to import from bezier-tokens\n            data-bezier-theme={themeName}\n            {...rest}\n          >\n            {children}\n          </Slot>\n        </AlphaTokenProvider>\n      </TokenProvider>\n    )\n  }\n)\n\n/**\n * `LightThemeProvider` is a wrapper component that provides light theme context.\n *\n * Components that pass to children **must spread props and forward ref.**\n */\nexport const LightThemeProvider = forwardRef<\n  HTMLElement,\n  FixedThemeProviderProps\n>(function LightTheme({ children, ...rest }, forwardedRef) {\n  return (\n    <ThemeProvider\n      ref={forwardedRef}\n      themeName=\"light\"\n      {...rest}\n    >\n      {children}\n    </ThemeProvider>\n  )\n})\n\n/**\n * `DarkThemeProvider` is a wrapper component that provides dark theme context.\n *\n * Components that pass to children **must spread props and forward ref.**\n */\nexport const DarkThemeProvider = forwardRef<\n  HTMLElement,\n  FixedThemeProviderProps\n>(function DarkTheme({ children, ...rest }, forwardedRef) {\n  return (\n    <ThemeProvider\n      ref={forwardedRef}\n      themeName=\"dark\"\n      {...rest}\n    >\n      {children}\n    </ThemeProvider>\n  )\n})\n\n/**\n * `InvertedThemeProvider` is a wrapper component that provides inverted theme context.\n */\nexport const InvertedThemeProvider = forwardRef<\n  HTMLElement,\n  FixedThemeProviderProps\n>(function InvertedTheme({ children, ...rest }, forwardedRef) {\n  return (\n    <ThemeProvider\n      ref={forwardedRef}\n      themeName={useThemeName() === 'light' ? 'dark' : 'light'}\n      {...rest}\n    >\n      {children}\n    </ThemeProvider>\n  )\n})\n"],"names":["useThemeName","useTokenContext","themeName","useTokens","tokens","useAlphaTokens","useAlphaTokenContext","ThemeProvider","forwardRef","children","rest","forwardedRef","_jsx","TokenProvider","AlphaTokenProvider","Slot","ref","LightThemeProvider","LightTheme","DarkThemeProvider","DarkTheme","InvertedThemeProvider","InvertedTheme"],"mappings":";;;;;;;;AAiBA;AACA;AACA;AACO,SAASA,YAAYA,GAAG;AAC7B,EAAA,OAAOC,6BAAe,CAAC,cAAc,CAAC,CAACC,SAAS;AAClD;;AAEA;AACA;AACA;AACO,SAASC,SAASA,GAAG;AAC1B,EAAA,OAAOF,6BAAe,CAAC,WAAW,CAAC,CAACG,MAAM;AAC5C;;AAEA;AACA;AACA;AACA;AACO,SAASC,cAAcA,GAAG;AAC/B,EAAA,OAAOC,oCAAoB,CAAC,gBAAgB,CAAC,CAACF,MAAM;AACtD;;AAEA;AACA;AACA;AACA;AACA;MACaG,aAAa,gBAAGC,gBAAU,CACrC,SAASD,aAAaA,CAAC;EAAEL,SAAS;EAAEO,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,YAAY,EAAE;EACrE,oBACEC,cAAA,CAACC,2BAAa,EAAA;AAACX,IAAAA,SAAS,EAAEA,SAAU;IAAAO,QAAA,eAClCG,cAAA,CAACE,6BAAkB,EAAA;AAACZ,MAAAA,SAAS,EAAEA,SAAU;MAAAO,QAAA,eACvCG,cAAA,CAACG,UAAI,EAAA;AACHC,QAAAA,GAAG,EAAEL;AACL;AAAA;AACA,QAAA,mBAAA,EAAmBT,SAAU;AAAA,QAAA,GACzBQ,IAAI;AAAAD,QAAAA,QAAA,EAEPA;OACG;KACY;AAAC,GACR,CAAC;AAEpB,CACF;;AAEA;AACA;AACA;AACA;AACA;MACaQ,kBAAkB,gBAAGT,gBAAU,CAG1C,SAASU,UAAUA,CAAC;EAAET,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,YAAY,EAAE;EACzD,oBACEC,cAAA,CAACL,aAAa,EAAA;AACZS,IAAAA,GAAG,EAAEL,YAAa;AAClBT,IAAAA,SAAS,EAAC,OAAO;AAAA,IAAA,GACbQ,IAAI;AAAAD,IAAAA,QAAA,EAEPA;AAAQ,GACI,CAAC;AAEpB,CAAC;;AAED;AACA;AACA;AACA;AACA;MACaU,iBAAiB,gBAAGX,gBAAU,CAGzC,SAASY,SAASA,CAAC;EAAEX,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,YAAY,EAAE;EACxD,oBACEC,cAAA,CAACL,aAAa,EAAA;AACZS,IAAAA,GAAG,EAAEL,YAAa;AAClBT,IAAAA,SAAS,EAAC,MAAM;AAAA,IAAA,GACZQ,IAAI;AAAAD,IAAAA,QAAA,EAEPA;AAAQ,GACI,CAAC;AAEpB,CAAC;;AAED;AACA;AACA;MACaY,qBAAqB,gBAAGb,gBAAU,CAG7C,SAASc,aAAaA,CAAC;EAAEb,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,YAAY,EAAE;EAC5D,oBACEC,cAAA,CAACL,aAAa,EAAA;AACZS,IAAAA,GAAG,EAAEL,YAAa;IAClBT,SAAS,EAAEF,YAAY,EAAE,KAAK,OAAO,GAAG,MAAM,GAAG,OAAQ;AAAA,IAAA,GACrDU,IAAI;AAAAD,IAAAA,QAAA,EAEPA;AAAQ,GACI,CAAC;AAEpB,CAAC;;;;;;;;;;"}

package/dist/cjs/index.js

@@ -1,6 +1,7 @@
 'use strict';
 
 var index = require('./packages/bezier-tokens/dist/esm/index.js');
+var index$1 = require('./packages/bezier-tokens/dist/alpha/esm/index.js');
 var useKeyboardActionLockerWhileComposing = require('./hooks/useKeyboardActionLockerWhileComposing.js');
 var Avatar = require('./components/AlphaAvatar/Avatar.js');
 var AvatarGroup = require('./components/AlphaAvatarGroup/AvatarGroup.js');
@@ -79,6 +80,7 @@ var WindowProvider = require('./components/WindowProvider/WindowProvider.js');
 
 
 exports.tokens = index.tokens;
+exports.alphaTokens = index$1.tokens;
 exports.COMMON_IME_CONTROL_KEYS = useKeyboardActionLockerWhileComposing.COMMON_IME_CONTROL_KEYS;
 exports.useKeyboardActionLockerWhileComposing = useKeyboardActionLockerWhileComposing.useKeyboardActionLockerWhileComposing;
 exports.AlphaAvatar = Avatar.Avatar;
@@ -198,6 +200,7 @@ exports.DarkThemeProvider = ThemeProvider.DarkThemeProvider;
 exports.InvertedThemeProvider = ThemeProvider.InvertedThemeProvider;
 exports.LightThemeProvider = ThemeProvider.LightThemeProvider;
 exports.ThemeProvider = ThemeProvider.ThemeProvider;
+exports.useAlphaTokens = ThemeProvider.useAlphaTokens;
 exports.useThemeName = ThemeProvider.useThemeName;
 exports.useTokens = ThemeProvider.useTokens;
 exports.ToastProvider = Toast.ToastProvider;

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}