@ultraviolet/ui 3.0.0-beta.5 → 3.0.0-beta.7

package/dist/components/Separator/index.cjs

@@ -2,41 +2,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
-const _styled = require("@emotion/styled/base");
-const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
-const _styled__default = /* @__PURE__ */ _interopDefaultCompat(_styled);
-const StyledIconWrapper = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
-  shouldForwardProp: (prop) => !["direction", "sentiment"].includes(prop),
-  target: "e1d1zom91"
-} : {
-  shouldForwardProp: (prop) => !["direction", "sentiment"].includes(prop),
-  target: "e1d1zom91",
-  label: "StyledIconWrapper"
-})("display:flex;flex-direction:", ({
-  direction
-}) => direction === "vertical" ? "column" : "row", ";align-items:center;svg{fill:", ({
-  sentiment,
-  theme
-}) => sentiment === "neutral" ? theme.colors.neutral.borderWeak : theme.colors[sentiment].border, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlcGFyYXRvci9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZW1CIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlcGFyYXRvci9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCdcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgdHlwZSB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHR5cGUgeyBDb2xvciB9IGZyb20gJy4uLy4uL3RoZW1lJ1xuXG50eXBlIERpcmVjdGlvbiA9ICdob3Jpem9udGFsJyB8ICd2ZXJ0aWNhbCdcblxudHlwZSBTdHlsZWRJY29uUHJvcHMgPSB7XG4gIGRpcmVjdGlvbjogRGlyZWN0aW9uXG4gIHNlbnRpbWVudDogQ29sb3Jcbn1cblxuY29uc3QgU3R5bGVkSWNvbldyYXBwZXIgPSBzdHlsZWQoJ2RpdicsIHtcbiAgc2hvdWxkRm9yd2FyZFByb3A6IHByb3AgPT4gIVsnZGlyZWN0aW9uJywgJ3NlbnRpbWVudCddLmluY2x1ZGVzKHByb3ApLFxufSk8U3R5bGVkSWNvblByb3BzPmBcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246ICR7KHsgZGlyZWN0aW9uIH0pID0+XG4gICAgZGlyZWN0aW9uID09PSAndmVydGljYWwnID8gJ2NvbHVtbicgOiAncm93J307XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cbiAgc3ZnIHtcbiAgICBmaWxsOiAkeyh7IHNlbnRpbWVudCwgdGhlbWUgfSkgPT4gKHNlbnRpbWVudCA9PT0gJ25ldXRyYWwnID8gdGhlbWUuY29sb3JzLm5ldXRyYWwuYm9yZGVyV2VhayA6IHRoZW1lLmNvbG9yc1tzZW50aW1lbnRdLmJvcmRlcil9O1xuICB9XG5gXG5cbnR5cGUgSG9yaXpvbnRhbFNlcGFyYXRvclByb3BzID0gT21pdDxTZXBhcmF0b3JQcm9wcywgJ2NvbG9yJyB8ICdzZW50aW1lbnQnPiAmIHtcbiAgaGFzSWNvbj86IGJvb2xlYW5cbiAgc2VudGltZW50OiBDb2xvclxufVxuXG5jb25zdCBTdHlsZWRIciA9IHN0eWxlZCgnaHInLCB7XG4gIHNob3VsZEZvcndhcmRQcm9wOiBwcm9wID0+XG4gICAgIVsnZGlyZWN0aW9uJywgJ3RoaWNrbmVzcycsICdoYXNJY29uJywgJ3NlbnRpbWVudCddLmluY2x1ZGVzKHByb3ApLFxufSk8SG9yaXpvbnRhbFNlcGFyYXRvclByb3BzPmBcbiAgbWFyZ2luOiAwO1xuICBib3JkZXI6IDA7XG4gIHdpZHRoOiAkeyh7IGRpcmVjdGlvbiwgdGhpY2tuZXNzID0gMSB9KSA9PlxuICAgIGRpcmVjdGlvbiA9PT0gJ3ZlcnRpY2FsJyA/IGAke3RoaWNrbmVzc31weGAgOiAnYXV0byd9O1xuICBoZWlnaHQ6ICR7KHsgZGlyZWN0aW9uLCB0aGlja25lc3MgPSAxIH0pID0+XG4gICAgZGlyZWN0aW9uID09PSAnaG9yaXpvbnRhbCcgPyBgJHt0aGlja25lc3N9cHhgIDogJ2F1dG8nfTtcbiAgZmxleC1zaHJpbms6IDA7XG4gIGJhY2tncm91bmQtY29sb3I6ICR7KHsgdGhlbWUsIHNlbnRpbWVudCB9KSA9PlxuICAgIHNlbnRpbWVudCA9PT0gJ25ldXRyYWwnXG4gICAgICA/IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJvcmRlcldlYWtcbiAgICAgIDogdGhlbWUuY29sb3JzW3NlbnRpbWVudF0uYm9yZGVyfTtcbiAgJHsoeyBoYXNJY29uIH0pID0+IGhhc0ljb24gJiYgYGZsZXg6IDE7YH1cbmBcblxudHlwZSBTZXBhcmF0b3JQcm9wcyA9IHtcbiAgZGlyZWN0aW9uPzogRGlyZWN0aW9uXG4gIHRoaWNrbmVzcz86IG51bWJlclxuICBzZW50aW1lbnQ/OiBDb2xvclxuICBjbGFzc05hbWU/OiBzdHJpbmdcbiAgJ2RhdGEtdGVzdGlkJz86IHN0cmluZ1xuICBjaGlsZHJlbj86IFJlYWN0Tm9kZVxufVxuXG4vKipcbiAqIFNlcGFyYXRvciBjb21wb25lbnQgdXNlZCB0byBzZXBhcmF0ZSBjb250ZW50IHdpdGggYSBob3Jpem9udGFsIG9yIHZlcnRpY2FsIGxpbmUuXG4gKi9cbmV4cG9ydCBjb25zdCBTZXBhcmF0b3IgPSAoe1xuICBkaXJlY3Rpb24gPSAnaG9yaXpvbnRhbCcsXG4gIHRoaWNrbmVzcyA9IDEsXG4gIHNlbnRpbWVudCA9ICduZXV0cmFsJyxcbiAgY2xhc3NOYW1lLFxuICAnZGF0YS10ZXN0aWQnOiBkYXRhVGVzdElkLFxuICBjaGlsZHJlbixcbn06IFNlcGFyYXRvclByb3BzKSA9PlxuICBjaGlsZHJlbiA/IChcbiAgICA8U3R5bGVkSWNvbldyYXBwZXJcbiAgICAgIGFyaWEtb3JpZW50YXRpb249e2RpcmVjdGlvbn1cbiAgICAgIGNsYXNzTmFtZT17Y2xhc3NOYW1lfVxuICAgICAgZGF0YS10ZXN0aWQ9e2RhdGFUZXN0SWR9XG4gICAgICBkaXJlY3Rpb249e2RpcmVjdGlvbn1cbiAgICAgIHJvbGU9XCJzZXBhcmF0b3JcIlxuICAgICAgc2VudGltZW50PXtzZW50aW1lbnR9XG4gICAgPlxuICAgICAgPFN0eWxlZEhyXG4gICAgICAgIGRpcmVjdGlvbj17ZGlyZWN0aW9ufVxuICAgICAgICBoYXNJY29uXG4gICAgICAgIHNlbnRpbWVudD17c2VudGltZW50fVxuICAgICAgICB0aGlja25lc3M9e3RoaWNrbmVzc31cbiAgICAgIC8+XG4gICAgICB7Y2hpbGRyZW59XG4gICAgICA8U3R5bGVkSHJcbiAgICAgICAgZGlyZWN0aW9uPXtkaXJlY3Rpb259XG4gICAgICAgIGhhc0ljb25cbiAgICAgICAgc2VudGltZW50PXtzZW50aW1lbnR9XG4gICAgICAgIHRoaWNrbmVzcz17dGhpY2tuZXNzfVxuICAgICAgLz5cbiAgICA8L1N0eWxlZEljb25XcmFwcGVyPlxuICApIDogKFxuICAgIDxTdHlsZWRIclxuICAgICAgYXJpYS1vcmllbnRhdGlvbj17ZGlyZWN0aW9ufVxuICAgICAgY2xhc3NOYW1lPXtjbGFzc05hbWV9XG4gICAgICBkYXRhLXRlc3RpZD17ZGF0YVRlc3RJZH1cbiAgICAgIGRpcmVjdGlvbj17ZGlyZWN0aW9ufVxuICAgICAgcm9sZT1cInNlcGFyYXRvclwiXG4gICAgICBzZW50aW1lbnQ9e3NlbnRpbWVudH1cbiAgICAgIHRoaWNrbmVzcz17dGhpY2tuZXNzfVxuICAgIC8+XG4gIClcbiJdfQ== */"));
-const StyledHr = /* @__PURE__ */ _styled__default.default("hr", process.env.NODE_ENV === "production" ? {
-  shouldForwardProp: (prop) => !["direction", "thickness", "hasIcon", "sentiment"].includes(prop),
-  target: "e1d1zom90"
-} : {
-  shouldForwardProp: (prop) => !["direction", "thickness", "hasIcon", "sentiment"].includes(prop),
-  target: "e1d1zom90",
-  label: "StyledHr"
-})("margin:0;border:0;width:", ({
-  direction,
-  thickness = 1
-}) => direction === "vertical" ? `${thickness}px` : "auto", ";height:", ({
-  direction,
-  thickness = 1
-}) => direction === "horizontal" ? `${thickness}px` : "auto", ";flex-shrink:0;background-color:", ({
-  theme,
-  sentiment
-}) => sentiment === "neutral" ? theme.colors.neutral.borderWeak : theme.colors[sentiment].border, ";", ({
-  hasIcon
-}) => hasIcon && `flex: 1;`, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlcGFyYXRvci9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0M0QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay91bHRyYXZpb2xldC91bHRyYXZpb2xldC9wYWNrYWdlcy91aS9zcmMvY29tcG9uZW50cy9TZXBhcmF0b3IvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHR5cGUgeyBSZWFjdE5vZGUgfSBmcm9tICdyZWFjdCdcbmltcG9ydCB0eXBlIHsgQ29sb3IgfSBmcm9tICcuLi8uLi90aGVtZSdcblxudHlwZSBEaXJlY3Rpb24gPSAnaG9yaXpvbnRhbCcgfCAndmVydGljYWwnXG5cbnR5cGUgU3R5bGVkSWNvblByb3BzID0ge1xuICBkaXJlY3Rpb246IERpcmVjdGlvblxuICBzZW50aW1lbnQ6IENvbG9yXG59XG5cbmNvbnN0IFN0eWxlZEljb25XcmFwcGVyID0gc3R5bGVkKCdkaXYnLCB7XG4gIHNob3VsZEZvcndhcmRQcm9wOiBwcm9wID0+ICFbJ2RpcmVjdGlvbicsICdzZW50aW1lbnQnXS5pbmNsdWRlcyhwcm9wKSxcbn0pPFN0eWxlZEljb25Qcm9wcz5gXG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtZGlyZWN0aW9uOiAkeyh7IGRpcmVjdGlvbiB9KSA9PlxuICAgIGRpcmVjdGlvbiA9PT0gJ3ZlcnRpY2FsJyA/ICdjb2x1bW4nIDogJ3Jvdyd9O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuXG4gIHN2ZyB7XG4gICAgZmlsbDogJHsoeyBzZW50aW1lbnQsIHRoZW1lIH0pID0+IChzZW50aW1lbnQgPT09ICduZXV0cmFsJyA/IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJvcmRlcldlYWsgOiB0aGVtZS5jb2xvcnNbc2VudGltZW50XS5ib3JkZXIpfTtcbiAgfVxuYFxuXG50eXBlIEhvcml6b250YWxTZXBhcmF0b3JQcm9wcyA9IE9taXQ8U2VwYXJhdG9yUHJvcHMsICdjb2xvcicgfCAnc2VudGltZW50Jz4gJiB7XG4gIGhhc0ljb24/OiBib29sZWFuXG4gIHNlbnRpbWVudDogQ29sb3Jcbn1cblxuY29uc3QgU3R5bGVkSHIgPSBzdHlsZWQoJ2hyJywge1xuICBzaG91bGRGb3J3YXJkUHJvcDogcHJvcCA9PlxuICAgICFbJ2RpcmVjdGlvbicsICd0aGlja25lc3MnLCAnaGFzSWNvbicsICdzZW50aW1lbnQnXS5pbmNsdWRlcyhwcm9wKSxcbn0pPEhvcml6b250YWxTZXBhcmF0b3JQcm9wcz5gXG4gIG1hcmdpbjogMDtcbiAgYm9yZGVyOiAwO1xuICB3aWR0aDogJHsoeyBkaXJlY3Rpb24sIHRoaWNrbmVzcyA9IDEgfSkgPT5cbiAgICBkaXJlY3Rpb24gPT09ICd2ZXJ0aWNhbCcgPyBgJHt0aGlja25lc3N9cHhgIDogJ2F1dG8nfTtcbiAgaGVpZ2h0OiAkeyh7IGRpcmVjdGlvbiwgdGhpY2tuZXNzID0gMSB9KSA9PlxuICAgIGRpcmVjdGlvbiA9PT0gJ2hvcml6b250YWwnID8gYCR7dGhpY2tuZXNzfXB4YCA6ICdhdXRvJ307XG4gIGZsZXgtc2hyaW5rOiAwO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lLCBzZW50aW1lbnQgfSkgPT5cbiAgICBzZW50aW1lbnQgPT09ICduZXV0cmFsJ1xuICAgICAgPyB0aGVtZS5jb2xvcnMubmV1dHJhbC5ib3JkZXJXZWFrXG4gICAgICA6IHRoZW1lLmNvbG9yc1tzZW50aW1lbnRdLmJvcmRlcn07XG4gICR7KHsgaGFzSWNvbiB9KSA9PiBoYXNJY29uICYmIGBmbGV4OiAxO2B9XG5gXG5cbnR5cGUgU2VwYXJhdG9yUHJvcHMgPSB7XG4gIGRpcmVjdGlvbj86IERpcmVjdGlvblxuICB0aGlja25lc3M/OiBudW1iZXJcbiAgc2VudGltZW50PzogQ29sb3JcbiAgY2xhc3NOYW1lPzogc3RyaW5nXG4gICdkYXRhLXRlc3RpZCc/OiBzdHJpbmdcbiAgY2hpbGRyZW4/OiBSZWFjdE5vZGVcbn1cblxuLyoqXG4gKiBTZXBhcmF0b3IgY29tcG9uZW50IHVzZWQgdG8gc2VwYXJhdGUgY29udGVudCB3aXRoIGEgaG9yaXpvbnRhbCBvciB2ZXJ0aWNhbCBsaW5lLlxuICovXG5leHBvcnQgY29uc3QgU2VwYXJhdG9yID0gKHtcbiAgZGlyZWN0aW9uID0gJ2hvcml6b250YWwnLFxuICB0aGlja25lc3MgPSAxLFxuICBzZW50aW1lbnQgPSAnbmV1dHJhbCcsXG4gIGNsYXNzTmFtZSxcbiAgJ2RhdGEtdGVzdGlkJzogZGF0YVRlc3RJZCxcbiAgY2hpbGRyZW4sXG59OiBTZXBhcmF0b3JQcm9wcykgPT5cbiAgY2hpbGRyZW4gPyAoXG4gICAgPFN0eWxlZEljb25XcmFwcGVyXG4gICAgICBhcmlhLW9yaWVudGF0aW9uPXtkaXJlY3Rpb259XG4gICAgICBjbGFzc05hbWU9e2NsYXNzTmFtZX1cbiAgICAgIGRhdGEtdGVzdGlkPXtkYXRhVGVzdElkfVxuICAgICAgZGlyZWN0aW9uPXtkaXJlY3Rpb259XG4gICAgICByb2xlPVwic2VwYXJhdG9yXCJcbiAgICAgIHNlbnRpbWVudD17c2VudGltZW50fVxuICAgID5cbiAgICAgIDxTdHlsZWRIclxuICAgICAgICBkaXJlY3Rpb249e2RpcmVjdGlvbn1cbiAgICAgICAgaGFzSWNvblxuICAgICAgICBzZW50aW1lbnQ9e3NlbnRpbWVudH1cbiAgICAgICAgdGhpY2tuZXNzPXt0aGlja25lc3N9XG4gICAgICAvPlxuICAgICAge2NoaWxkcmVufVxuICAgICAgPFN0eWxlZEhyXG4gICAgICAgIGRpcmVjdGlvbj17ZGlyZWN0aW9ufVxuICAgICAgICBoYXNJY29uXG4gICAgICAgIHNlbnRpbWVudD17c2VudGltZW50fVxuICAgICAgICB0aGlja25lc3M9e3RoaWNrbmVzc31cbiAgICAgIC8+XG4gICAgPC9TdHlsZWRJY29uV3JhcHBlcj5cbiAgKSA6IChcbiAgICA8U3R5bGVkSHJcbiAgICAgIGFyaWEtb3JpZW50YXRpb249e2RpcmVjdGlvbn1cbiAgICAgIGNsYXNzTmFtZT17Y2xhc3NOYW1lfVxuICAgICAgZGF0YS10ZXN0aWQ9e2RhdGFUZXN0SWR9XG4gICAgICBkaXJlY3Rpb249e2RpcmVjdGlvbn1cbiAgICAgIHJvbGU9XCJzZXBhcmF0b3JcIlxuICAgICAgc2VudGltZW50PXtzZW50aW1lbnR9XG4gICAgICB0aGlja25lc3M9e3RoaWNrbmVzc31cbiAgICAvPlxuICApXG4iXX0= */"));
+const dynamic = require("@vanilla-extract/dynamic");
+const styles_css = require("./styles.css.cjs");
 const Separator = ({
   direction = "horizontal",
   thickness = 1,
@@ -44,9 +11,29 @@ const Separator = ({
   className,
   "data-testid": dataTestId,
   children
-}) => children ? /* @__PURE__ */ jsxRuntime.jsxs(StyledIconWrapper, { "aria-orientation": direction, className, "data-testid": dataTestId, direction, role: "separator", sentiment, children: [
-  /* @__PURE__ */ jsxRuntime.jsx(StyledHr, { direction, hasIcon: true, sentiment, thickness }),
+}) => children ? /* @__PURE__ */ jsxRuntime.jsxs("div", { "aria-orientation": direction, className: `${className ? `${className} ` : ""}${styles_css.iconWraperSeparator({
+  direction,
+  sentiment
+})}`, "data-testid": dataTestId, role: "separator", children: [
+  /* @__PURE__ */ jsxRuntime.jsx("hr", { className: styles_css.hr({
+    direction,
+    hasIcon: true,
+    sentiment
+  }), style: dynamic.assignInlineVars({
+    [styles_css.thicknessSeparator]: `${thickness}px`
+  }) }),
   children,
-  /* @__PURE__ */ jsxRuntime.jsx(StyledHr, { direction, hasIcon: true, sentiment, thickness })
-] }) : /* @__PURE__ */ jsxRuntime.jsx(StyledHr, { "aria-orientation": direction, className, "data-testid": dataTestId, direction, role: "separator", sentiment, thickness });
+  /* @__PURE__ */ jsxRuntime.jsx("hr", { className: styles_css.hr({
+    direction,
+    hasIcon: true,
+    sentiment
+  }), style: dynamic.assignInlineVars({
+    [styles_css.thicknessSeparator]: `${thickness}px`
+  }) })
+] }) : /* @__PURE__ */ jsxRuntime.jsx("hr", { "aria-orientation": direction, className: `${className ? `${className} ` : ""}${styles_css.hr({
+  direction,
+  sentiment
+})}`, "data-testid": dataTestId, role: "separator", style: dynamic.assignInlineVars({
+  [styles_css.thicknessSeparator]: `${thickness}px`
+}) });
 exports.Separator = Separator;

package/dist/components/Separator/index.d.ts

@@ -1,14 +1,11 @@
 import type { ReactNode } from 'react';
-import type { Color } from '../../theme';
-type Direction = 'horizontal' | 'vertical';
+import type { SeparatorVariants } from './styles.css';
 type SeparatorProps = {
-    direction?: Direction;
     thickness?: number;
-    sentiment?: Color;
     className?: string;
     'data-testid'?: string;
     children?: ReactNode;
-};
+} & SeparatorVariants;
 /**
  * Separator component used to separate content with a horizontal or vertical line.
  */

package/dist/components/Separator/index.js

@@ -1,38 +1,7 @@
 "use client";
 import { jsxs, jsx } from "@emotion/react/jsx-runtime";
-import _styled from "@emotion/styled/base";
-const StyledIconWrapper = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
-  shouldForwardProp: (prop) => !["direction", "sentiment"].includes(prop),
-  target: "e1d1zom91"
-} : {
-  shouldForwardProp: (prop) => !["direction", "sentiment"].includes(prop),
-  target: "e1d1zom91",
-  label: "StyledIconWrapper"
-})("display:flex;flex-direction:", ({
-  direction
-}) => direction === "vertical" ? "column" : "row", ";align-items:center;svg{fill:", ({
-  sentiment,
-  theme
-}) => sentiment === "neutral" ? theme.colors.neutral.borderWeak : theme.colors[sentiment].border, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlcGFyYXRvci9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZW1CIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlcGFyYXRvci9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCdcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgdHlwZSB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHR5cGUgeyBDb2xvciB9IGZyb20gJy4uLy4uL3RoZW1lJ1xuXG50eXBlIERpcmVjdGlvbiA9ICdob3Jpem9udGFsJyB8ICd2ZXJ0aWNhbCdcblxudHlwZSBTdHlsZWRJY29uUHJvcHMgPSB7XG4gIGRpcmVjdGlvbjogRGlyZWN0aW9uXG4gIHNlbnRpbWVudDogQ29sb3Jcbn1cblxuY29uc3QgU3R5bGVkSWNvbldyYXBwZXIgPSBzdHlsZWQoJ2RpdicsIHtcbiAgc2hvdWxkRm9yd2FyZFByb3A6IHByb3AgPT4gIVsnZGlyZWN0aW9uJywgJ3NlbnRpbWVudCddLmluY2x1ZGVzKHByb3ApLFxufSk8U3R5bGVkSWNvblByb3BzPmBcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246ICR7KHsgZGlyZWN0aW9uIH0pID0+XG4gICAgZGlyZWN0aW9uID09PSAndmVydGljYWwnID8gJ2NvbHVtbicgOiAncm93J307XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cbiAgc3ZnIHtcbiAgICBmaWxsOiAkeyh7IHNlbnRpbWVudCwgdGhlbWUgfSkgPT4gKHNlbnRpbWVudCA9PT0gJ25ldXRyYWwnID8gdGhlbWUuY29sb3JzLm5ldXRyYWwuYm9yZGVyV2VhayA6IHRoZW1lLmNvbG9yc1tzZW50aW1lbnRdLmJvcmRlcil9O1xuICB9XG5gXG5cbnR5cGUgSG9yaXpvbnRhbFNlcGFyYXRvclByb3BzID0gT21pdDxTZXBhcmF0b3JQcm9wcywgJ2NvbG9yJyB8ICdzZW50aW1lbnQnPiAmIHtcbiAgaGFzSWNvbj86IGJvb2xlYW5cbiAgc2VudGltZW50OiBDb2xvclxufVxuXG5jb25zdCBTdHlsZWRIciA9IHN0eWxlZCgnaHInLCB7XG4gIHNob3VsZEZvcndhcmRQcm9wOiBwcm9wID0+XG4gICAgIVsnZGlyZWN0aW9uJywgJ3RoaWNrbmVzcycsICdoYXNJY29uJywgJ3NlbnRpbWVudCddLmluY2x1ZGVzKHByb3ApLFxufSk8SG9yaXpvbnRhbFNlcGFyYXRvclByb3BzPmBcbiAgbWFyZ2luOiAwO1xuICBib3JkZXI6IDA7XG4gIHdpZHRoOiAkeyh7IGRpcmVjdGlvbiwgdGhpY2tuZXNzID0gMSB9KSA9PlxuICAgIGRpcmVjdGlvbiA9PT0gJ3ZlcnRpY2FsJyA/IGAke3RoaWNrbmVzc31weGAgOiAnYXV0byd9O1xuICBoZWlnaHQ6ICR7KHsgZGlyZWN0aW9uLCB0aGlja25lc3MgPSAxIH0pID0+XG4gICAgZGlyZWN0aW9uID09PSAnaG9yaXpvbnRhbCcgPyBgJHt0aGlja25lc3N9cHhgIDogJ2F1dG8nfTtcbiAgZmxleC1zaHJpbms6IDA7XG4gIGJhY2tncm91bmQtY29sb3I6ICR7KHsgdGhlbWUsIHNlbnRpbWVudCB9KSA9PlxuICAgIHNlbnRpbWVudCA9PT0gJ25ldXRyYWwnXG4gICAgICA/IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJvcmRlcldlYWtcbiAgICAgIDogdGhlbWUuY29sb3JzW3NlbnRpbWVudF0uYm9yZGVyfTtcbiAgJHsoeyBoYXNJY29uIH0pID0+IGhhc0ljb24gJiYgYGZsZXg6IDE7YH1cbmBcblxudHlwZSBTZXBhcmF0b3JQcm9wcyA9IHtcbiAgZGlyZWN0aW9uPzogRGlyZWN0aW9uXG4gIHRoaWNrbmVzcz86IG51bWJlclxuICBzZW50aW1lbnQ/OiBDb2xvclxuICBjbGFzc05hbWU/OiBzdHJpbmdcbiAgJ2RhdGEtdGVzdGlkJz86IHN0cmluZ1xuICBjaGlsZHJlbj86IFJlYWN0Tm9kZVxufVxuXG4vKipcbiAqIFNlcGFyYXRvciBjb21wb25lbnQgdXNlZCB0byBzZXBhcmF0ZSBjb250ZW50IHdpdGggYSBob3Jpem9udGFsIG9yIHZlcnRpY2FsIGxpbmUuXG4gKi9cbmV4cG9ydCBjb25zdCBTZXBhcmF0b3IgPSAoe1xuICBkaXJlY3Rpb24gPSAnaG9yaXpvbnRhbCcsXG4gIHRoaWNrbmVzcyA9IDEsXG4gIHNlbnRpbWVudCA9ICduZXV0cmFsJyxcbiAgY2xhc3NOYW1lLFxuICAnZGF0YS10ZXN0aWQnOiBkYXRhVGVzdElkLFxuICBjaGlsZHJlbixcbn06IFNlcGFyYXRvclByb3BzKSA9PlxuICBjaGlsZHJlbiA/IChcbiAgICA8U3R5bGVkSWNvbldyYXBwZXJcbiAgICAgIGFyaWEtb3JpZW50YXRpb249e2RpcmVjdGlvbn1cbiAgICAgIGNsYXNzTmFtZT17Y2xhc3NOYW1lfVxuICAgICAgZGF0YS10ZXN0aWQ9e2RhdGFUZXN0SWR9XG4gICAgICBkaXJlY3Rpb249e2RpcmVjdGlvbn1cbiAgICAgIHJvbGU9XCJzZXBhcmF0b3JcIlxuICAgICAgc2VudGltZW50PXtzZW50aW1lbnR9XG4gICAgPlxuICAgICAgPFN0eWxlZEhyXG4gICAgICAgIGRpcmVjdGlvbj17ZGlyZWN0aW9ufVxuICAgICAgICBoYXNJY29uXG4gICAgICAgIHNlbnRpbWVudD17c2VudGltZW50fVxuICAgICAgICB0aGlja25lc3M9e3RoaWNrbmVzc31cbiAgICAgIC8+XG4gICAgICB7Y2hpbGRyZW59XG4gICAgICA8U3R5bGVkSHJcbiAgICAgICAgZGlyZWN0aW9uPXtkaXJlY3Rpb259XG4gICAgICAgIGhhc0ljb25cbiAgICAgICAgc2VudGltZW50PXtzZW50aW1lbnR9XG4gICAgICAgIHRoaWNrbmVzcz17dGhpY2tuZXNzfVxuICAgICAgLz5cbiAgICA8L1N0eWxlZEljb25XcmFwcGVyPlxuICApIDogKFxuICAgIDxTdHlsZWRIclxuICAgICAgYXJpYS1vcmllbnRhdGlvbj17ZGlyZWN0aW9ufVxuICAgICAgY2xhc3NOYW1lPXtjbGFzc05hbWV9XG4gICAgICBkYXRhLXRlc3RpZD17ZGF0YVRlc3RJZH1cbiAgICAgIGRpcmVjdGlvbj17ZGlyZWN0aW9ufVxuICAgICAgcm9sZT1cInNlcGFyYXRvclwiXG4gICAgICBzZW50aW1lbnQ9e3NlbnRpbWVudH1cbiAgICAgIHRoaWNrbmVzcz17dGhpY2tuZXNzfVxuICAgIC8+XG4gIClcbiJdfQ== */"));
-const StyledHr = /* @__PURE__ */ _styled("hr", process.env.NODE_ENV === "production" ? {
-  shouldForwardProp: (prop) => !["direction", "thickness", "hasIcon", "sentiment"].includes(prop),
-  target: "e1d1zom90"
-} : {
-  shouldForwardProp: (prop) => !["direction", "thickness", "hasIcon", "sentiment"].includes(prop),
-  target: "e1d1zom90",
-  label: "StyledHr"
-})("margin:0;border:0;width:", ({
-  direction,
-  thickness = 1
-}) => direction === "vertical" ? `${thickness}px` : "auto", ";height:", ({
-  direction,
-  thickness = 1
-}) => direction === "horizontal" ? `${thickness}px` : "auto", ";flex-shrink:0;background-color:", ({
-  theme,
-  sentiment
-}) => sentiment === "neutral" ? theme.colors.neutral.borderWeak : theme.colors[sentiment].border, ";", ({
-  hasIcon
-}) => hasIcon && `flex: 1;`, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlcGFyYXRvci9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0M0QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay91bHRyYXZpb2xldC91bHRyYXZpb2xldC9wYWNrYWdlcy91aS9zcmMvY29tcG9uZW50cy9TZXBhcmF0b3IvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHR5cGUgeyBSZWFjdE5vZGUgfSBmcm9tICdyZWFjdCdcbmltcG9ydCB0eXBlIHsgQ29sb3IgfSBmcm9tICcuLi8uLi90aGVtZSdcblxudHlwZSBEaXJlY3Rpb24gPSAnaG9yaXpvbnRhbCcgfCAndmVydGljYWwnXG5cbnR5cGUgU3R5bGVkSWNvblByb3BzID0ge1xuICBkaXJlY3Rpb246IERpcmVjdGlvblxuICBzZW50aW1lbnQ6IENvbG9yXG59XG5cbmNvbnN0IFN0eWxlZEljb25XcmFwcGVyID0gc3R5bGVkKCdkaXYnLCB7XG4gIHNob3VsZEZvcndhcmRQcm9wOiBwcm9wID0+ICFbJ2RpcmVjdGlvbicsICdzZW50aW1lbnQnXS5pbmNsdWRlcyhwcm9wKSxcbn0pPFN0eWxlZEljb25Qcm9wcz5gXG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtZGlyZWN0aW9uOiAkeyh7IGRpcmVjdGlvbiB9KSA9PlxuICAgIGRpcmVjdGlvbiA9PT0gJ3ZlcnRpY2FsJyA/ICdjb2x1bW4nIDogJ3Jvdyd9O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuXG4gIHN2ZyB7XG4gICAgZmlsbDogJHsoeyBzZW50aW1lbnQsIHRoZW1lIH0pID0+IChzZW50aW1lbnQgPT09ICduZXV0cmFsJyA/IHRoZW1lLmNvbG9ycy5uZXV0cmFsLmJvcmRlcldlYWsgOiB0aGVtZS5jb2xvcnNbc2VudGltZW50XS5ib3JkZXIpfTtcbiAgfVxuYFxuXG50eXBlIEhvcml6b250YWxTZXBhcmF0b3JQcm9wcyA9IE9taXQ8U2VwYXJhdG9yUHJvcHMsICdjb2xvcicgfCAnc2VudGltZW50Jz4gJiB7XG4gIGhhc0ljb24/OiBib29sZWFuXG4gIHNlbnRpbWVudDogQ29sb3Jcbn1cblxuY29uc3QgU3R5bGVkSHIgPSBzdHlsZWQoJ2hyJywge1xuICBzaG91bGRGb3J3YXJkUHJvcDogcHJvcCA9PlxuICAgICFbJ2RpcmVjdGlvbicsICd0aGlja25lc3MnLCAnaGFzSWNvbicsICdzZW50aW1lbnQnXS5pbmNsdWRlcyhwcm9wKSxcbn0pPEhvcml6b250YWxTZXBhcmF0b3JQcm9wcz5gXG4gIG1hcmdpbjogMDtcbiAgYm9yZGVyOiAwO1xuICB3aWR0aDogJHsoeyBkaXJlY3Rpb24sIHRoaWNrbmVzcyA9IDEgfSkgPT5cbiAgICBkaXJlY3Rpb24gPT09ICd2ZXJ0aWNhbCcgPyBgJHt0aGlja25lc3N9cHhgIDogJ2F1dG8nfTtcbiAgaGVpZ2h0OiAkeyh7IGRpcmVjdGlvbiwgdGhpY2tuZXNzID0gMSB9KSA9PlxuICAgIGRpcmVjdGlvbiA9PT0gJ2hvcml6b250YWwnID8gYCR7dGhpY2tuZXNzfXB4YCA6ICdhdXRvJ307XG4gIGZsZXgtc2hyaW5rOiAwO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lLCBzZW50aW1lbnQgfSkgPT5cbiAgICBzZW50aW1lbnQgPT09ICduZXV0cmFsJ1xuICAgICAgPyB0aGVtZS5jb2xvcnMubmV1dHJhbC5ib3JkZXJXZWFrXG4gICAgICA6IHRoZW1lLmNvbG9yc1tzZW50aW1lbnRdLmJvcmRlcn07XG4gICR7KHsgaGFzSWNvbiB9KSA9PiBoYXNJY29uICYmIGBmbGV4OiAxO2B9XG5gXG5cbnR5cGUgU2VwYXJhdG9yUHJvcHMgPSB7XG4gIGRpcmVjdGlvbj86IERpcmVjdGlvblxuICB0aGlja25lc3M/OiBudW1iZXJcbiAgc2VudGltZW50PzogQ29sb3JcbiAgY2xhc3NOYW1lPzogc3RyaW5nXG4gICdkYXRhLXRlc3RpZCc/OiBzdHJpbmdcbiAgY2hpbGRyZW4/OiBSZWFjdE5vZGVcbn1cblxuLyoqXG4gKiBTZXBhcmF0b3IgY29tcG9uZW50IHVzZWQgdG8gc2VwYXJhdGUgY29udGVudCB3aXRoIGEgaG9yaXpvbnRhbCBvciB2ZXJ0aWNhbCBsaW5lLlxuICovXG5leHBvcnQgY29uc3QgU2VwYXJhdG9yID0gKHtcbiAgZGlyZWN0aW9uID0gJ2hvcml6b250YWwnLFxuICB0aGlja25lc3MgPSAxLFxuICBzZW50aW1lbnQgPSAnbmV1dHJhbCcsXG4gIGNsYXNzTmFtZSxcbiAgJ2RhdGEtdGVzdGlkJzogZGF0YVRlc3RJZCxcbiAgY2hpbGRyZW4sXG59OiBTZXBhcmF0b3JQcm9wcykgPT5cbiAgY2hpbGRyZW4gPyAoXG4gICAgPFN0eWxlZEljb25XcmFwcGVyXG4gICAgICBhcmlhLW9yaWVudGF0aW9uPXtkaXJlY3Rpb259XG4gICAgICBjbGFzc05hbWU9e2NsYXNzTmFtZX1cbiAgICAgIGRhdGEtdGVzdGlkPXtkYXRhVGVzdElkfVxuICAgICAgZGlyZWN0aW9uPXtkaXJlY3Rpb259XG4gICAgICByb2xlPVwic2VwYXJhdG9yXCJcbiAgICAgIHNlbnRpbWVudD17c2VudGltZW50fVxuICAgID5cbiAgICAgIDxTdHlsZWRIclxuICAgICAgICBkaXJlY3Rpb249e2RpcmVjdGlvbn1cbiAgICAgICAgaGFzSWNvblxuICAgICAgICBzZW50aW1lbnQ9e3NlbnRpbWVudH1cbiAgICAgICAgdGhpY2tuZXNzPXt0aGlja25lc3N9XG4gICAgICAvPlxuICAgICAge2NoaWxkcmVufVxuICAgICAgPFN0eWxlZEhyXG4gICAgICAgIGRpcmVjdGlvbj17ZGlyZWN0aW9ufVxuICAgICAgICBoYXNJY29uXG4gICAgICAgIHNlbnRpbWVudD17c2VudGltZW50fVxuICAgICAgICB0aGlja25lc3M9e3RoaWNrbmVzc31cbiAgICAgIC8+XG4gICAgPC9TdHlsZWRJY29uV3JhcHBlcj5cbiAgKSA6IChcbiAgICA8U3R5bGVkSHJcbiAgICAgIGFyaWEtb3JpZW50YXRpb249e2RpcmVjdGlvbn1cbiAgICAgIGNsYXNzTmFtZT17Y2xhc3NOYW1lfVxuICAgICAgZGF0YS10ZXN0aWQ9e2RhdGFUZXN0SWR9XG4gICAgICBkaXJlY3Rpb249e2RpcmVjdGlvbn1cbiAgICAgIHJvbGU9XCJzZXBhcmF0b3JcIlxuICAgICAgc2VudGltZW50PXtzZW50aW1lbnR9XG4gICAgICB0aGlja25lc3M9e3RoaWNrbmVzc31cbiAgICAvPlxuICApXG4iXX0= */"));
+import { assignInlineVars } from "@vanilla-extract/dynamic";
+import { iconWraperSeparator, hr, thicknessSeparator } from "./styles.css.js";
 const Separator = ({
   direction = "horizontal",
   thickness = 1,
@@ -40,11 +9,31 @@ const Separator = ({
   className,
   "data-testid": dataTestId,
   children
-}) => children ? /* @__PURE__ */ jsxs(StyledIconWrapper, { "aria-orientation": direction, className, "data-testid": dataTestId, direction, role: "separator", sentiment, children: [
-  /* @__PURE__ */ jsx(StyledHr, { direction, hasIcon: true, sentiment, thickness }),
+}) => children ? /* @__PURE__ */ jsxs("div", { "aria-orientation": direction, className: `${className ? `${className} ` : ""}${iconWraperSeparator({
+  direction,
+  sentiment
+})}`, "data-testid": dataTestId, role: "separator", children: [
+  /* @__PURE__ */ jsx("hr", { className: hr({
+    direction,
+    hasIcon: true,
+    sentiment
+  }), style: assignInlineVars({
+    [thicknessSeparator]: `${thickness}px`
+  }) }),
   children,
-  /* @__PURE__ */ jsx(StyledHr, { direction, hasIcon: true, sentiment, thickness })
-] }) : /* @__PURE__ */ jsx(StyledHr, { "aria-orientation": direction, className, "data-testid": dataTestId, direction, role: "separator", sentiment, thickness });
+  /* @__PURE__ */ jsx("hr", { className: hr({
+    direction,
+    hasIcon: true,
+    sentiment
+  }), style: assignInlineVars({
+    [thicknessSeparator]: `${thickness}px`
+  }) })
+] }) : /* @__PURE__ */ jsx("hr", { "aria-orientation": direction, className: `${className ? `${className} ` : ""}${hr({
+  direction,
+  sentiment
+})}`, "data-testid": dataTestId, role: "separator", style: assignInlineVars({
+  [thicknessSeparator]: `${thickness}px`
+}) });
 export {
   Separator
 };

package/dist/components/Separator/styles.css.cjs

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+;/* empty css                            */
+const createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
+var thicknessSeparator = "var(--uv_bu43fb0)";
+var iconWraperSeparator = createRuntimeFn.createRuntimeFn({ defaultClassName: "uv_bu43fb1", variantClassNames: { direction: { horizontal: "uv_bu43fb2", vertical: "uv_bu43fb3" }, sentiment: { danger: "uv_bu43fb4", info: "uv_bu43fb5", neutral: "uv_bu43fb6", primary: "uv_bu43fb7", secondary: "uv_bu43fb8", success: "uv_bu43fb9", warning: "uv_bu43fba" } }, defaultVariants: { direction: "horizontal", sentiment: "neutral" }, compoundVariants: [] });
+var hr = createRuntimeFn.createRuntimeFn({ defaultClassName: "uv_bu43fbb", variantClassNames: { direction: { horizontal: "uv_bu43fbc", vertical: "uv_bu43fbd" }, hasIcon: { false: "uv_bu43fbe", true: "uv_bu43fbf" }, sentiment: { danger: "uv_bu43fbg", info: "uv_bu43fbh", neutral: "uv_bu43fbi", primary: "uv_bu43fbj", secondary: "uv_bu43fbk", success: "uv_bu43fbl", warning: "uv_bu43fbm" } }, defaultVariants: {}, compoundVariants: [] });
+exports.hr = hr;
+exports.iconWraperSeparator = iconWraperSeparator;
+exports.thicknessSeparator = thicknessSeparator;

package/dist/components/Separator/styles.css.d.ts

@@ -0,0 +1,125 @@
+import type { RecipeVariants } from '@vanilla-extract/recipes';
+export declare const thicknessSeparator: `var(--${string})`;
+export declare const iconWraperSeparator: import("@vanilla-extract/recipes").RuntimeFn<{
+    direction: {
+        horizontal: {
+            flexDirection: "row";
+        };
+        vertical: {
+            flexDirection: "column";
+        };
+    };
+    sentiment: {
+        danger: {
+            backgroundColor: `var(--${string})`;
+            color?: undefined;
+        } | {
+            color: `var(--${string})`;
+            backgroundColor?: undefined;
+        };
+        info: {
+            backgroundColor: `var(--${string})`;
+            color?: undefined;
+        } | {
+            color: `var(--${string})`;
+            backgroundColor?: undefined;
+        };
+        neutral: {
+            color: `var(--${string})`;
+        };
+        primary: {
+            backgroundColor: `var(--${string})`;
+            color?: undefined;
+        } | {
+            color: `var(--${string})`;
+            backgroundColor?: undefined;
+        };
+        secondary: {
+            backgroundColor: `var(--${string})`;
+            color?: undefined;
+        } | {
+            color: `var(--${string})`;
+            backgroundColor?: undefined;
+        };
+        success: {
+            backgroundColor: `var(--${string})`;
+            color?: undefined;
+        } | {
+            color: `var(--${string})`;
+            backgroundColor?: undefined;
+        };
+        warning: {
+            backgroundColor: `var(--${string})`;
+            color?: undefined;
+        } | {
+            color: `var(--${string})`;
+            backgroundColor?: undefined;
+        };
+    };
+}>;
+export declare const hr: import("@vanilla-extract/recipes").RuntimeFn<{
+    direction: {
+        horizontal: {
+            height: `var(--${string})`;
+            width: "auto";
+        };
+        vertical: {
+            height: "auto";
+            width: `var(--${string})`;
+        };
+    };
+    hasIcon: {
+        false: {};
+        true: {
+            flex: number;
+        };
+    };
+    sentiment: {
+        danger: {
+            backgroundColor: `var(--${string})`;
+            color?: undefined;
+        } | {
+            color: `var(--${string})`;
+            backgroundColor?: undefined;
+        };
+        info: {
+            backgroundColor: `var(--${string})`;
+            color?: undefined;
+        } | {
+            color: `var(--${string})`;
+            backgroundColor?: undefined;
+        };
+        neutral: {
+            backgroundColor: `var(--${string})`;
+        };
+        primary: {
+            backgroundColor: `var(--${string})`;
+            color?: undefined;
+        } | {
+            color: `var(--${string})`;
+            backgroundColor?: undefined;
+        };
+        secondary: {
+            backgroundColor: `var(--${string})`;
+            color?: undefined;
+        } | {
+            color: `var(--${string})`;
+            backgroundColor?: undefined;
+        };
+        success: {
+            backgroundColor: `var(--${string})`;
+            color?: undefined;
+        } | {
+            color: `var(--${string})`;
+            backgroundColor?: undefined;
+        };
+        warning: {
+            backgroundColor: `var(--${string})`;
+            color?: undefined;
+        } | {
+            color: `var(--${string})`;
+            backgroundColor?: undefined;
+        };
+    };
+}>;
+export type SeparatorVariants = NonNullable<RecipeVariants<typeof iconWraperSeparator>>;

package/dist/components/Separator/styles.css.js

@@ -0,0 +1,10 @@
+/* empty css                          */
+import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
+var thicknessSeparator = "var(--uv_bu43fb0)";
+var iconWraperSeparator = createRuntimeFn({ defaultClassName: "uv_bu43fb1", variantClassNames: { direction: { horizontal: "uv_bu43fb2", vertical: "uv_bu43fb3" }, sentiment: { danger: "uv_bu43fb4", info: "uv_bu43fb5", neutral: "uv_bu43fb6", primary: "uv_bu43fb7", secondary: "uv_bu43fb8", success: "uv_bu43fb9", warning: "uv_bu43fba" } }, defaultVariants: { direction: "horizontal", sentiment: "neutral" }, compoundVariants: [] });
+var hr = createRuntimeFn({ defaultClassName: "uv_bu43fbb", variantClassNames: { direction: { horizontal: "uv_bu43fbc", vertical: "uv_bu43fbd" }, hasIcon: { false: "uv_bu43fbe", true: "uv_bu43fbf" }, sentiment: { danger: "uv_bu43fbg", info: "uv_bu43fbh", neutral: "uv_bu43fbi", primary: "uv_bu43fbj", secondary: "uv_bu43fbk", success: "uv_bu43fbl", warning: "uv_bu43fbm" } }, defaultVariants: {}, compoundVariants: [] });
+export {
+  hr,
+  iconWraperSeparator,
+  thicknessSeparator
+};

package/dist/components/Text/index.cjs

@@ -2,11 +2,13 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
+const dynamic = require("@vanilla-extract/dynamic");
 const react = require("react");
 const recursivelyGetChildrenString = require("../../helpers/recursivelyGetChildrenString.cjs");
 const useIsOverflowing = require("../../hooks/useIsOverflowing.cjs");
 const index = require("../Tooltip/index.cjs");
 const style_css = require("./style.css.cjs");
+const variables_css = require("./variables.css.cjs");
 const Text = ({
   variant,
   children,
@@ -25,7 +27,8 @@ const Text = ({
   whiteSpace,
   htmlFor,
   "data-testid": dataTestId,
-  "aria-hidden": ariaHidden
+  "aria-hidden": ariaHidden,
+  style
 }) => {
   const elementRef = react.useRef(null);
   const isOverflowing = useIsOverflowing.useIsOverflowing(elementRef);
@@ -40,8 +43,11 @@ const Text = ({
     underline,
     variant
   })}`, "data-testid": dataTestId, dir, htmlFor, id, ref: elementRef, style: {
-    textAlign: placement,
-    whiteSpace
+    ...dynamic.assignInlineVars({
+      [variables_css.placementText]: placement,
+      [variables_css.whiteSpaceText]: whiteSpace
+    }),
+    ...style
   }, children }) });
 };
 exports.Text = Text;

package/dist/components/Text/index.d.ts

@@ -26,9 +26,10 @@ type TextProps = {
     'aria-hidden'?: boolean;
     strikeThrough?: boolean;
     whiteSpace?: WhiteSpaceProps;
+    style?: CSSProperties;
 };
 /**
  * Text component is used to display text with different variants and sentiments.
  */
-export declare const Text: ({ variant, children, as: Component, sentiment, oneLine, placement, prominence, className, disabled, italic, underline, strikeThrough, id, dir, whiteSpace, htmlFor, "data-testid": dataTestId, "aria-hidden": ariaHidden, }: TextProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const Text: ({ variant, children, as: Component, sentiment, oneLine, placement, prominence, className, disabled, italic, underline, strikeThrough, id, dir, whiteSpace, htmlFor, "data-testid": dataTestId, "aria-hidden": ariaHidden, style, }: TextProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Text/index.js

@@ -1,10 +1,12 @@
 "use client";
 import { jsx } from "@emotion/react/jsx-runtime";
+import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { useRef } from "react";
 import recursivelyGetChildrenString from "../../helpers/recursivelyGetChildrenString.js";
 import { useIsOverflowing } from "../../hooks/useIsOverflowing.js";
 import { Tooltip } from "../Tooltip/index.js";
 import { text } from "./style.css.js";
+import { whiteSpaceText, placementText } from "./variables.css.js";
 const Text = ({
   variant,
   children,
@@ -23,7 +25,8 @@ const Text = ({
   whiteSpace,
   htmlFor,
   "data-testid": dataTestId,
-  "aria-hidden": ariaHidden
+  "aria-hidden": ariaHidden,
+  style
 }) => {
   const elementRef = useRef(null);
   const isOverflowing = useIsOverflowing(elementRef);
@@ -38,8 +41,11 @@ const Text = ({
     underline,
     variant
   })}`, "data-testid": dataTestId, dir, htmlFor, id, ref: elementRef, style: {
-    textAlign: placement,
-    whiteSpace
+    ...assignInlineVars({
+      [placementText]: placement,
+      [whiteSpaceText]: whiteSpace
+    }),
+    ...style
   }, children }) });
 };
 export {

package/dist/components/Text/style.css.cjs

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+;/* empty css                               */
 ;/* empty css                           */
 const createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
 var text = createRuntimeFn.createRuntimeFn({ defaultClassName: "uv_m4c9ow0", variantClassNames: { strikeThrough: { true: "uv_m4c9ow1", false: "uv_m4c9ow2" }, italic: { true: "uv_m4c9ow3", false: "uv_m4c9ow4" }, underline: { true: "uv_m4c9ow5", false: "uv_m4c9ow6" }, oneLine: { true: "uv_m4c9ow7", false: "uv_m4c9ow8" }, sentiment: { primary: "uv_m4c9ow9", secondary: "uv_m4c9owa", neutral: "uv_m4c9owb", success: "uv_m4c9owc", danger: "uv_m4c9owd", warning: "uv_m4c9owe", info: "uv_m4c9owf", black: "uv_m4c9owg", white: "uv_m4c9owh" }, prominence: { "default": "uv_m4c9owi", strong: "uv_m4c9owj", stronger: "uv_m4c9owk", weak: "uv_m4c9owl" }, variant: { body: "uv_m4c9owm", bodySmall: "uv_m4c9own", bodySmallStrong: "uv_m4c9owo", bodySmallStronger: "uv_m4c9owp", bodyStrong: "uv_m4c9owq", bodyStronger: "uv_m4c9owr", caption: "uv_m4c9ows", captionSmall: "uv_m4c9owt", captionSmallStrong: "uv_m4c9owu", captionSmallStronger: "uv_m4c9owv", captionStrong: "uv_m4c9oww", captionStronger: "uv_m4c9owx", code: "uv_m4c9owy", codeStrong: "uv_m4c9owz", codeStronger: "uv_m4c9ow10", heading: "uv_m4c9ow11", headingLarge: "uv_m4c9ow12", headingLargeStrong: "uv_m4c9ow13", headingLargeStronger: "uv_m4c9ow14", headingSmall: "uv_m4c9ow15", headingSmallStrong: "uv_m4c9ow16", headingSmallStronger: "uv_m4c9ow17", headingStrong: "uv_m4c9ow18", headingStronger: "uv_m4c9ow19" }, disabled: { true: "uv_m4c9ow1a", false: "uv_m4c9ow1b" } }, defaultVariants: { strikeThrough: false, italic: false, underline: false, oneLine: false, sentiment: void 0, prominence: "default", variant: "body", disabled: false }, compoundVariants: [[{ sentiment: "primary", prominence: "default", disabled: false }, "uv_m4c9ow1c"], [{ sentiment: "primary", prominence: "strong", disabled: false }, "uv_m4c9ow1d"], [{ sentiment: "primary", prominence: "stronger", disabled: false }, "uv_m4c9ow1e"], [{ sentiment: "primary", prominence: "weak", disabled: false }, "uv_m4c9ow1f"], [{ sentiment: "secondary", prominence: "default", disabled: false }, "uv_m4c9ow1g"], [{ sentiment: "secondary", prominence: "strong", disabled: false }, "uv_m4c9ow1h"], [{ sentiment: "secondary", prominence: "stronger", disabled: false }, "uv_m4c9ow1i"], [{ sentiment: "secondary", prominence: "weak", disabled: false }, "uv_m4c9ow1j"], [{ sentiment: "danger", prominence: "default", disabled: false }, "uv_m4c9ow1k"], [{ sentiment: "danger", prominence: "strong", disabled: false }, "uv_m4c9ow1l"], [{ sentiment: "danger", prominence: "stronger", disabled: false }, "uv_m4c9ow1m"], [{ sentiment: "danger", prominence: "weak", disabled: false }, "uv_m4c9ow1n"], [{ sentiment: "info", prominence: "default", disabled: false }, "uv_m4c9ow1o"], [{ sentiment: "info", prominence: "strong", disabled: false }, "uv_m4c9ow1p"], [{ sentiment: "info", prominence: "stronger", disabled: false }, "uv_m4c9ow1q"], [{ sentiment: "info", prominence: "weak", disabled: false }, "uv_m4c9ow1r"], [{ sentiment: "success", prominence: "default", disabled: false }, "uv_m4c9ow1s"], [{ sentiment: "success", prominence: "strong", disabled: false }, "uv_m4c9ow1t"], [{ sentiment: "success", prominence: "stronger", disabled: false }, "uv_m4c9ow1u"], [{ sentiment: "success", prominence: "weak", disabled: false }, "uv_m4c9ow1v"], [{ sentiment: "warning", prominence: "default", disabled: false }, "uv_m4c9ow1w"], [{ sentiment: "warning", prominence: "strong", disabled: false }, "uv_m4c9ow1x"], [{ sentiment: "warning", prominence: "stronger", disabled: false }, "uv_m4c9ow1y"], [{ sentiment: "warning", prominence: "weak", disabled: false }, "uv_m4c9ow1z"], [{ sentiment: "neutral", prominence: "default", disabled: false }, "uv_m4c9ow20"], [{ sentiment: "neutral", prominence: "strong", disabled: false }, "uv_m4c9ow21"], [{ sentiment: "neutral", prominence: "stronger", disabled: false }, "uv_m4c9ow22"], [{ sentiment: "neutral", prominence: "weak", disabled: false }, "uv_m4c9ow23"], [{ sentiment: "black", prominence: "default", disabled: false }, "uv_m4c9ow24"], [{ sentiment: "black", prominence: "strong", disabled: false }, "uv_m4c9ow25"], [{ sentiment: "black", prominence: "stronger", disabled: false }, "uv_m4c9ow26"], [{ sentiment: "black", prominence: "weak", disabled: false }, "uv_m4c9ow27"], [{ sentiment: "white", prominence: "default", disabled: false }, "uv_m4c9ow28"], [{ sentiment: "white", prominence: "strong", disabled: false }, "uv_m4c9ow29"], [{ sentiment: "white", prominence: "stronger", disabled: false }, "uv_m4c9ow2a"], [{ sentiment: "white", prominence: "weak", disabled: false }, "uv_m4c9ow2b"], [{ sentiment: "primary", prominence: "default", disabled: true }, "uv_m4c9ow2c"], [{ sentiment: "primary", prominence: "strong", disabled: true }, "uv_m4c9ow2d"], [{ sentiment: "primary", prominence: "stronger", disabled: true }, "uv_m4c9ow2e"], [{ sentiment: "primary", prominence: "weak", disabled: true }, "uv_m4c9ow2f"], [{ sentiment: "secondary", prominence: "default", disabled: true }, "uv_m4c9ow2g"], [{ sentiment: "secondary", prominence: "strong", disabled: true }, "uv_m4c9ow2h"], [{ sentiment: "secondary", prominence: "stronger", disabled: true }, "uv_m4c9ow2i"], [{ sentiment: "secondary", prominence: "weak", disabled: true }, "uv_m4c9ow2j"], [{ sentiment: "danger", prominence: "default", disabled: true }, "uv_m4c9ow2k"], [{ sentiment: "danger", prominence: "strong", disabled: true }, "uv_m4c9ow2l"], [{ sentiment: "danger", prominence: "stronger", disabled: true }, "uv_m4c9ow2m"], [{ sentiment: "danger", prominence: "weak", disabled: true }, "uv_m4c9ow2n"], [{ sentiment: "info", prominence: "default", disabled: true }, "uv_m4c9ow2o"], [{ sentiment: "info", prominence: "strong", disabled: true }, "uv_m4c9ow2p"], [{ sentiment: "info", prominence: "stronger", disabled: true }, "uv_m4c9ow2q"], [{ sentiment: "info", prominence: "weak", disabled: true }, "uv_m4c9ow2r"], [{ sentiment: "success", prominence: "default", disabled: true }, "uv_m4c9ow2s"], [{ sentiment: "success", prominence: "strong", disabled: true }, "uv_m4c9ow2t"], [{ sentiment: "success", prominence: "stronger", disabled: true }, "uv_m4c9ow2u"], [{ sentiment: "success", prominence: "weak", disabled: true }, "uv_m4c9ow2v"], [{ sentiment: "warning", prominence: "default", disabled: true }, "uv_m4c9ow2w"], [{ sentiment: "warning", prominence: "strong", disabled: true }, "uv_m4c9ow2x"], [{ sentiment: "warning", prominence: "stronger", disabled: true }, "uv_m4c9ow2y"], [{ sentiment: "warning", prominence: "weak", disabled: true }, "uv_m4c9ow2z"], [{ sentiment: "neutral", prominence: "default", disabled: true }, "uv_m4c9ow30"], [{ sentiment: "neutral", prominence: "strong", disabled: true }, "uv_m4c9ow31"], [{ sentiment: "neutral", prominence: "stronger", disabled: true }, "uv_m4c9ow32"], [{ sentiment: "neutral", prominence: "weak", disabled: true }, "uv_m4c9ow33"], [{ sentiment: "black", prominence: "default", disabled: true }, "uv_m4c9ow34"], [{ sentiment: "black", prominence: "strong", disabled: true }, "uv_m4c9ow35"], [{ sentiment: "black", prominence: "stronger", disabled: true }, "uv_m4c9ow36"], [{ sentiment: "black", prominence: "weak", disabled: true }, "uv_m4c9ow37"], [{ sentiment: "white", prominence: "default", disabled: true }, "uv_m4c9ow38"], [{ sentiment: "white", prominence: "strong", disabled: true }, "uv_m4c9ow39"], [{ sentiment: "white", prominence: "stronger", disabled: true }, "uv_m4c9ow3a"], [{ sentiment: "white", prominence: "weak", disabled: true }, "uv_m4c9ow3b"], [{ prominence: "default", disabled: false }, "uv_m4c9ow3c"], [{ prominence: "strong", disabled: false }, "uv_m4c9ow3d"], [{ prominence: "stronger", disabled: false }, "uv_m4c9ow3e"], [{ prominence: "weak", disabled: false }, "uv_m4c9ow3f"]] });

package/dist/components/Text/style.css.js

@@ -1,3 +1,4 @@
+/* empty css                             */
 /* empty css                         */
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
 var text = createRuntimeFn({ defaultClassName: "uv_m4c9ow0", variantClassNames: { strikeThrough: { true: "uv_m4c9ow1", false: "uv_m4c9ow2" }, italic: { true: "uv_m4c9ow3", false: "uv_m4c9ow4" }, underline: { true: "uv_m4c9ow5", false: "uv_m4c9ow6" }, oneLine: { true: "uv_m4c9ow7", false: "uv_m4c9ow8" }, sentiment: { primary: "uv_m4c9ow9", secondary: "uv_m4c9owa", neutral: "uv_m4c9owb", success: "uv_m4c9owc", danger: "uv_m4c9owd", warning: "uv_m4c9owe", info: "uv_m4c9owf", black: "uv_m4c9owg", white: "uv_m4c9owh" }, prominence: { "default": "uv_m4c9owi", strong: "uv_m4c9owj", stronger: "uv_m4c9owk", weak: "uv_m4c9owl" }, variant: { body: "uv_m4c9owm", bodySmall: "uv_m4c9own", bodySmallStrong: "uv_m4c9owo", bodySmallStronger: "uv_m4c9owp", bodyStrong: "uv_m4c9owq", bodyStronger: "uv_m4c9owr", caption: "uv_m4c9ows", captionSmall: "uv_m4c9owt", captionSmallStrong: "uv_m4c9owu", captionSmallStronger: "uv_m4c9owv", captionStrong: "uv_m4c9oww", captionStronger: "uv_m4c9owx", code: "uv_m4c9owy", codeStrong: "uv_m4c9owz", codeStronger: "uv_m4c9ow10", heading: "uv_m4c9ow11", headingLarge: "uv_m4c9ow12", headingLargeStrong: "uv_m4c9ow13", headingLargeStronger: "uv_m4c9ow14", headingSmall: "uv_m4c9ow15", headingSmallStrong: "uv_m4c9ow16", headingSmallStronger: "uv_m4c9ow17", headingStrong: "uv_m4c9ow18", headingStronger: "uv_m4c9ow19" }, disabled: { true: "uv_m4c9ow1a", false: "uv_m4c9ow1b" } }, defaultVariants: { strikeThrough: false, italic: false, underline: false, oneLine: false, sentiment: void 0, prominence: "default", variant: "body", disabled: false }, compoundVariants: [[{ sentiment: "primary", prominence: "default", disabled: false }, "uv_m4c9ow1c"], [{ sentiment: "primary", prominence: "strong", disabled: false }, "uv_m4c9ow1d"], [{ sentiment: "primary", prominence: "stronger", disabled: false }, "uv_m4c9ow1e"], [{ sentiment: "primary", prominence: "weak", disabled: false }, "uv_m4c9ow1f"], [{ sentiment: "secondary", prominence: "default", disabled: false }, "uv_m4c9ow1g"], [{ sentiment: "secondary", prominence: "strong", disabled: false }, "uv_m4c9ow1h"], [{ sentiment: "secondary", prominence: "stronger", disabled: false }, "uv_m4c9ow1i"], [{ sentiment: "secondary", prominence: "weak", disabled: false }, "uv_m4c9ow1j"], [{ sentiment: "danger", prominence: "default", disabled: false }, "uv_m4c9ow1k"], [{ sentiment: "danger", prominence: "strong", disabled: false }, "uv_m4c9ow1l"], [{ sentiment: "danger", prominence: "stronger", disabled: false }, "uv_m4c9ow1m"], [{ sentiment: "danger", prominence: "weak", disabled: false }, "uv_m4c9ow1n"], [{ sentiment: "info", prominence: "default", disabled: false }, "uv_m4c9ow1o"], [{ sentiment: "info", prominence: "strong", disabled: false }, "uv_m4c9ow1p"], [{ sentiment: "info", prominence: "stronger", disabled: false }, "uv_m4c9ow1q"], [{ sentiment: "info", prominence: "weak", disabled: false }, "uv_m4c9ow1r"], [{ sentiment: "success", prominence: "default", disabled: false }, "uv_m4c9ow1s"], [{ sentiment: "success", prominence: "strong", disabled: false }, "uv_m4c9ow1t"], [{ sentiment: "success", prominence: "stronger", disabled: false }, "uv_m4c9ow1u"], [{ sentiment: "success", prominence: "weak", disabled: false }, "uv_m4c9ow1v"], [{ sentiment: "warning", prominence: "default", disabled: false }, "uv_m4c9ow1w"], [{ sentiment: "warning", prominence: "strong", disabled: false }, "uv_m4c9ow1x"], [{ sentiment: "warning", prominence: "stronger", disabled: false }, "uv_m4c9ow1y"], [{ sentiment: "warning", prominence: "weak", disabled: false }, "uv_m4c9ow1z"], [{ sentiment: "neutral", prominence: "default", disabled: false }, "uv_m4c9ow20"], [{ sentiment: "neutral", prominence: "strong", disabled: false }, "uv_m4c9ow21"], [{ sentiment: "neutral", prominence: "stronger", disabled: false }, "uv_m4c9ow22"], [{ sentiment: "neutral", prominence: "weak", disabled: false }, "uv_m4c9ow23"], [{ sentiment: "black", prominence: "default", disabled: false }, "uv_m4c9ow24"], [{ sentiment: "black", prominence: "strong", disabled: false }, "uv_m4c9ow25"], [{ sentiment: "black", prominence: "stronger", disabled: false }, "uv_m4c9ow26"], [{ sentiment: "black", prominence: "weak", disabled: false }, "uv_m4c9ow27"], [{ sentiment: "white", prominence: "default", disabled: false }, "uv_m4c9ow28"], [{ sentiment: "white", prominence: "strong", disabled: false }, "uv_m4c9ow29"], [{ sentiment: "white", prominence: "stronger", disabled: false }, "uv_m4c9ow2a"], [{ sentiment: "white", prominence: "weak", disabled: false }, "uv_m4c9ow2b"], [{ sentiment: "primary", prominence: "default", disabled: true }, "uv_m4c9ow2c"], [{ sentiment: "primary", prominence: "strong", disabled: true }, "uv_m4c9ow2d"], [{ sentiment: "primary", prominence: "stronger", disabled: true }, "uv_m4c9ow2e"], [{ sentiment: "primary", prominence: "weak", disabled: true }, "uv_m4c9ow2f"], [{ sentiment: "secondary", prominence: "default", disabled: true }, "uv_m4c9ow2g"], [{ sentiment: "secondary", prominence: "strong", disabled: true }, "uv_m4c9ow2h"], [{ sentiment: "secondary", prominence: "stronger", disabled: true }, "uv_m4c9ow2i"], [{ sentiment: "secondary", prominence: "weak", disabled: true }, "uv_m4c9ow2j"], [{ sentiment: "danger", prominence: "default", disabled: true }, "uv_m4c9ow2k"], [{ sentiment: "danger", prominence: "strong", disabled: true }, "uv_m4c9ow2l"], [{ sentiment: "danger", prominence: "stronger", disabled: true }, "uv_m4c9ow2m"], [{ sentiment: "danger", prominence: "weak", disabled: true }, "uv_m4c9ow2n"], [{ sentiment: "info", prominence: "default", disabled: true }, "uv_m4c9ow2o"], [{ sentiment: "info", prominence: "strong", disabled: true }, "uv_m4c9ow2p"], [{ sentiment: "info", prominence: "stronger", disabled: true }, "uv_m4c9ow2q"], [{ sentiment: "info", prominence: "weak", disabled: true }, "uv_m4c9ow2r"], [{ sentiment: "success", prominence: "default", disabled: true }, "uv_m4c9ow2s"], [{ sentiment: "success", prominence: "strong", disabled: true }, "uv_m4c9ow2t"], [{ sentiment: "success", prominence: "stronger", disabled: true }, "uv_m4c9ow2u"], [{ sentiment: "success", prominence: "weak", disabled: true }, "uv_m4c9ow2v"], [{ sentiment: "warning", prominence: "default", disabled: true }, "uv_m4c9ow2w"], [{ sentiment: "warning", prominence: "strong", disabled: true }, "uv_m4c9ow2x"], [{ sentiment: "warning", prominence: "stronger", disabled: true }, "uv_m4c9ow2y"], [{ sentiment: "warning", prominence: "weak", disabled: true }, "uv_m4c9ow2z"], [{ sentiment: "neutral", prominence: "default", disabled: true }, "uv_m4c9ow30"], [{ sentiment: "neutral", prominence: "strong", disabled: true }, "uv_m4c9ow31"], [{ sentiment: "neutral", prominence: "stronger", disabled: true }, "uv_m4c9ow32"], [{ sentiment: "neutral", prominence: "weak", disabled: true }, "uv_m4c9ow33"], [{ sentiment: "black", prominence: "default", disabled: true }, "uv_m4c9ow34"], [{ sentiment: "black", prominence: "strong", disabled: true }, "uv_m4c9ow35"], [{ sentiment: "black", prominence: "stronger", disabled: true }, "uv_m4c9ow36"], [{ sentiment: "black", prominence: "weak", disabled: true }, "uv_m4c9ow37"], [{ sentiment: "white", prominence: "default", disabled: true }, "uv_m4c9ow38"], [{ sentiment: "white", prominence: "strong", disabled: true }, "uv_m4c9ow39"], [{ sentiment: "white", prominence: "stronger", disabled: true }, "uv_m4c9ow3a"], [{ sentiment: "white", prominence: "weak", disabled: true }, "uv_m4c9ow3b"], [{ prominence: "default", disabled: false }, "uv_m4c9ow3c"], [{ prominence: "strong", disabled: false }, "uv_m4c9ow3d"], [{ prominence: "stronger", disabled: false }, "uv_m4c9ow3e"], [{ prominence: "weak", disabled: false }, "uv_m4c9ow3f"]] });

package/dist/components/Text/variables.css.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+var placementText = "var(--uv_qabug40)";
+var whiteSpaceText = "var(--uv_qabug41)";
+exports.placementText = placementText;
+exports.whiteSpaceText = whiteSpaceText;

package/dist/components/Text/variables.css.d.ts

@@ -0,0 +1,2 @@
+export declare const placementText: `var(--${string})`;
+export declare const whiteSpaceText: `var(--${string})`;

package/dist/components/Text/variables.css.js

@@ -0,0 +1,6 @@
+var placementText = "var(--uv_qabug40)";
+var whiteSpaceText = "var(--uv_qabug41)";
+export {
+  placementText,
+  whiteSpaceText
+};

package/dist/components/Tooltip/index.cjs

@@ -2,27 +2,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
-const _styled = require("@emotion/styled/base");
 const react = require("react");
 const index = require("../Popup/index.cjs");
-const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
-const _styled__default = /* @__PURE__ */ _interopDefaultCompat(_styled);
-function _EMOTION_STRINGIFIED_CSS_ERROR__() {
-  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
-}
-const StyledPopup = /* @__PURE__ */ _styled__default.default(index.Popup, process.env.NODE_ENV === "production" ? {
-  target: "e1h4zly10"
-} : {
-  target: "e1h4zly10",
-  label: "StyledPopup"
-})(process.env.NODE_ENV === "production" ? {
-  name: "je8g23",
-  styles: "pointer-events:none"
-} : {
-  name: "je8g23",
-  styles: "pointer-events:none/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1Rvb2x0aXAvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJCaUMiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvdWx0cmF2aW9sZXQvdWx0cmF2aW9sZXQvcGFja2FnZXMvdWkvc3JjL2NvbXBvbmVudHMvVG9vbHRpcC9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCdcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgdHlwZSB7IENvbXBvbmVudFByb3BzLCBSZWYgfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IGZvcndhcmRSZWYgfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IFBvcHVwIH0gZnJvbSAnLi4vUG9wdXAnXG5cbnR5cGUgVG9vbHRpcFByb3BzID0gUGljazxcbiAgQ29tcG9uZW50UHJvcHM8dHlwZW9mIFBvcHVwPixcbiAgfCAnaWQnXG4gIHwgJ2NoaWxkcmVuJ1xuICB8ICdtYXhXaWR0aCdcbiAgfCAndGV4dCdcbiAgfCAnY2xhc3NOYW1lJ1xuICB8ICd2aXNpYmxlJ1xuICB8ICdpbm5lclJlZidcbiAgfCAncm9sZSdcbiAgfCAnZGF0YS10ZXN0aWQnXG4gIHwgJ2NvbnRhaW5lckZ1bGxXaWR0aCdcbiAgfCAnY29udGFpbmVyRnVsbEhlaWdodCdcbiAgfCAncG9ydGFsVGFyZ2V0J1xuICB8ICd0YWJJbmRleCdcbiAgfCAnZGVib3VuY2VEZWxheSdcbj4gJiB7XG4gIHBsYWNlbWVudD86IEV4Y2x1ZGU8Q29tcG9uZW50UHJvcHM8dHlwZW9mIFBvcHVwPlsncGxhY2VtZW50J10sICduZXN0ZWQtbWVudSc+XG59XG5cbmNvbnN0IFN0eWxlZFBvcHVwID0gc3R5bGVkKFBvcHVwKWBcbiAgcG9pbnRlci1ldmVudHM6IG5vbmU7XG5gXG5cbi8qKlxuICogVG9vbHRpcCBjb21wb25lbnQgaXMgdXNlZCB0byBkaXNwbGF5IGFkZGl0aW9uYWwgaW5mb3JtYXRpb24gb24gaG92ZXIgb3IgZm9jdXMuXG4gKiBJdCBpcyB1c2VkIHRvIGV4cGxhaW4gdGhlIHB1cnBvc2Ugb2YgdGhlIGVsZW1lbnQgaXQgaXMgYXR0YWNoZWQgdG8uXG4gKi9cbmV4cG9ydCBjb25zdCBUb29sdGlwID0gZm9yd2FyZFJlZihcbiAgKFxuICAgIHtcbiAgICAgIGNoaWxkcmVuLFxuICAgICAgdGV4dCA9ICcnLFxuICAgICAgcGxhY2VtZW50ID0gJ2F1dG8nLFxuICAgICAgaWQsXG4gICAgICBjbGFzc05hbWUsXG4gICAgICBjb250YWluZXJGdWxsV2lkdGgsXG4gICAgICBjb250YWluZXJGdWxsSGVpZ2h0LFxuICAgICAgbWF4V2lkdGggPSAyMzIsXG4gICAgICB2aXNpYmxlLFxuICAgICAgaW5uZXJSZWYsXG4gICAgICByb2xlID0gJ3Rvb2x0aXAnLFxuICAgICAgJ2RhdGEtdGVzdGlkJzogZGF0YVRlc3RJZCxcbiAgICAgIHBvcnRhbFRhcmdldCxcbiAgICAgIGRlYm91bmNlRGVsYXksXG4gICAgICB0YWJJbmRleCxcbiAgICB9OiBUb29sdGlwUHJvcHMsXG4gICAgdG9vbHRpcFJlZjogUmVmPEhUTUxEaXZFbGVtZW50PixcbiAgKSA9PiAoXG4gICAgPFN0eWxlZFBvcHVwXG4gICAgICBjbGFzc05hbWU9e2NsYXNzTmFtZX1cbiAgICAgIGNvbnRhaW5lckZ1bGxIZWlnaHQ9e2NvbnRhaW5lckZ1bGxIZWlnaHR9XG4gICAgICBjb250YWluZXJGdWxsV2lkdGg9e2NvbnRhaW5lckZ1bGxXaWR0aH1cbiAgICAgIGRhdGEtdGVzdGlkPXtkYXRhVGVzdElkfVxuICAgICAgZGVib3VuY2VEZWxheT17ZGVib3VuY2VEZWxheX1cbiAgICAgIGlkPXtpZH1cbiAgICAgIGlubmVyUmVmPXtpbm5lclJlZn1cbiAgICAgIG1heFdpZHRoPXttYXhXaWR0aH1cbiAgICAgIHBsYWNlbWVudD17cGxhY2VtZW50fVxuICAgICAgcG9ydGFsVGFyZ2V0PXtwb3J0YWxUYXJnZXR9XG4gICAgICByZWY9e3Rvb2x0aXBSZWZ9XG4gICAgICByb2xlPXtyb2xlfVxuICAgICAgdGFiSW5kZXg9e3RhYkluZGV4fVxuICAgICAgdGV4dD17dGV4dH1cbiAgICAgIHZpc2libGU9e3Zpc2libGV9XG4gICAgPlxuICAgICAge2NoaWxkcmVufVxuICAgIDwvU3R5bGVkUG9wdXA+XG4gICksXG4pXG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
+const styles_css = require("./styles.css.cjs");
 const Tooltip = react.forwardRef(({
   children,
   text = "",
@@ -39,5 +21,5 @@ const Tooltip = react.forwardRef(({
   portalTarget,
   debounceDelay,
   tabIndex
-}, tooltipRef) => /* @__PURE__ */ jsxRuntime.jsx(StyledPopup, { className, containerFullHeight, containerFullWidth, "data-testid": dataTestId, debounceDelay, id, innerRef, maxWidth, placement, portalTarget, ref: tooltipRef, role, tabIndex, text, visible, children }));
+}, tooltipRef) => /* @__PURE__ */ jsxRuntime.jsx(index.Popup, { className: `${className ? `${className} ` : ""}${styles_css.tooltip}`, containerFullHeight, containerFullWidth, "data-testid": dataTestId, debounceDelay, id, innerRef, maxWidth, placement, portalTarget, ref: tooltipRef, role, tabIndex, text, visible, children }));
 exports.Tooltip = Tooltip;

package/dist/components/Tooltip/index.js

@@ -1,24 +1,8 @@
 "use client";
 import { jsx } from "@emotion/react/jsx-runtime";
-import _styled from "@emotion/styled/base";
 import { forwardRef } from "react";
 import { Popup } from "../Popup/index.js";
-function _EMOTION_STRINGIFIED_CSS_ERROR__() {
-  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
-}
-const StyledPopup = /* @__PURE__ */ _styled(Popup, process.env.NODE_ENV === "production" ? {
-  target: "e1h4zly10"
-} : {
-  target: "e1h4zly10",
-  label: "StyledPopup"
-})(process.env.NODE_ENV === "production" ? {
-  name: "je8g23",
-  styles: "pointer-events:none"
-} : {
-  name: "je8g23",
-  styles: "pointer-events:none/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1Rvb2x0aXAvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJCaUMiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvdWx0cmF2aW9sZXQvdWx0cmF2aW9sZXQvcGFja2FnZXMvdWkvc3JjL2NvbXBvbmVudHMvVG9vbHRpcC9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCdcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgdHlwZSB7IENvbXBvbmVudFByb3BzLCBSZWYgfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IGZvcndhcmRSZWYgfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IFBvcHVwIH0gZnJvbSAnLi4vUG9wdXAnXG5cbnR5cGUgVG9vbHRpcFByb3BzID0gUGljazxcbiAgQ29tcG9uZW50UHJvcHM8dHlwZW9mIFBvcHVwPixcbiAgfCAnaWQnXG4gIHwgJ2NoaWxkcmVuJ1xuICB8ICdtYXhXaWR0aCdcbiAgfCAndGV4dCdcbiAgfCAnY2xhc3NOYW1lJ1xuICB8ICd2aXNpYmxlJ1xuICB8ICdpbm5lclJlZidcbiAgfCAncm9sZSdcbiAgfCAnZGF0YS10ZXN0aWQnXG4gIHwgJ2NvbnRhaW5lckZ1bGxXaWR0aCdcbiAgfCAnY29udGFpbmVyRnVsbEhlaWdodCdcbiAgfCAncG9ydGFsVGFyZ2V0J1xuICB8ICd0YWJJbmRleCdcbiAgfCAnZGVib3VuY2VEZWxheSdcbj4gJiB7XG4gIHBsYWNlbWVudD86IEV4Y2x1ZGU8Q29tcG9uZW50UHJvcHM8dHlwZW9mIFBvcHVwPlsncGxhY2VtZW50J10sICduZXN0ZWQtbWVudSc+XG59XG5cbmNvbnN0IFN0eWxlZFBvcHVwID0gc3R5bGVkKFBvcHVwKWBcbiAgcG9pbnRlci1ldmVudHM6IG5vbmU7XG5gXG5cbi8qKlxuICogVG9vbHRpcCBjb21wb25lbnQgaXMgdXNlZCB0byBkaXNwbGF5IGFkZGl0aW9uYWwgaW5mb3JtYXRpb24gb24gaG92ZXIgb3IgZm9jdXMuXG4gKiBJdCBpcyB1c2VkIHRvIGV4cGxhaW4gdGhlIHB1cnBvc2Ugb2YgdGhlIGVsZW1lbnQgaXQgaXMgYXR0YWNoZWQgdG8uXG4gKi9cbmV4cG9ydCBjb25zdCBUb29sdGlwID0gZm9yd2FyZFJlZihcbiAgKFxuICAgIHtcbiAgICAgIGNoaWxkcmVuLFxuICAgICAgdGV4dCA9ICcnLFxuICAgICAgcGxhY2VtZW50ID0gJ2F1dG8nLFxuICAgICAgaWQsXG4gICAgICBjbGFzc05hbWUsXG4gICAgICBjb250YWluZXJGdWxsV2lkdGgsXG4gICAgICBjb250YWluZXJGdWxsSGVpZ2h0LFxuICAgICAgbWF4V2lkdGggPSAyMzIsXG4gICAgICB2aXNpYmxlLFxuICAgICAgaW5uZXJSZWYsXG4gICAgICByb2xlID0gJ3Rvb2x0aXAnLFxuICAgICAgJ2RhdGEtdGVzdGlkJzogZGF0YVRlc3RJZCxcbiAgICAgIHBvcnRhbFRhcmdldCxcbiAgICAgIGRlYm91bmNlRGVsYXksXG4gICAgICB0YWJJbmRleCxcbiAgICB9OiBUb29sdGlwUHJvcHMsXG4gICAgdG9vbHRpcFJlZjogUmVmPEhUTUxEaXZFbGVtZW50PixcbiAgKSA9PiAoXG4gICAgPFN0eWxlZFBvcHVwXG4gICAgICBjbGFzc05hbWU9e2NsYXNzTmFtZX1cbiAgICAgIGNvbnRhaW5lckZ1bGxIZWlnaHQ9e2NvbnRhaW5lckZ1bGxIZWlnaHR9XG4gICAgICBjb250YWluZXJGdWxsV2lkdGg9e2NvbnRhaW5lckZ1bGxXaWR0aH1cbiAgICAgIGRhdGEtdGVzdGlkPXtkYXRhVGVzdElkfVxuICAgICAgZGVib3VuY2VEZWxheT17ZGVib3VuY2VEZWxheX1cbiAgICAgIGlkPXtpZH1cbiAgICAgIGlubmVyUmVmPXtpbm5lclJlZn1cbiAgICAgIG1heFdpZHRoPXttYXhXaWR0aH1cbiAgICAgIHBsYWNlbWVudD17cGxhY2VtZW50fVxuICAgICAgcG9ydGFsVGFyZ2V0PXtwb3J0YWxUYXJnZXR9XG4gICAgICByZWY9e3Rvb2x0aXBSZWZ9XG4gICAgICByb2xlPXtyb2xlfVxuICAgICAgdGFiSW5kZXg9e3RhYkluZGV4fVxuICAgICAgdGV4dD17dGV4dH1cbiAgICAgIHZpc2libGU9e3Zpc2libGV9XG4gICAgPlxuICAgICAge2NoaWxkcmVufVxuICAgIDwvU3R5bGVkUG9wdXA+XG4gICksXG4pXG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
+import { tooltip } from "./styles.css.js";
 const Tooltip = forwardRef(({
   children,
   text = "",
@@ -35,7 +19,7 @@ const Tooltip = forwardRef(({
   portalTarget,
   debounceDelay,
   tabIndex
-}, tooltipRef) => /* @__PURE__ */ jsx(StyledPopup, { className, containerFullHeight, containerFullWidth, "data-testid": dataTestId, debounceDelay, id, innerRef, maxWidth, placement, portalTarget, ref: tooltipRef, role, tabIndex, text, visible, children }));
+}, tooltipRef) => /* @__PURE__ */ jsx(Popup, { className: `${className ? `${className} ` : ""}${tooltip}`, containerFullHeight, containerFullWidth, "data-testid": dataTestId, debounceDelay, id, innerRef, maxWidth, placement, portalTarget, ref: tooltipRef, role, tabIndex, text, visible, children }));
 export {
   Tooltip
 };

package/dist/components/Tooltip/styles.css.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+;/* empty css                            */
+var tooltip = "uv_1y5sygv0";
+exports.tooltip = tooltip;

package/dist/components/Tooltip/styles.css.d.ts

@@ -0,0 +1 @@
+export declare const tooltip: string;

package/dist/components/Tooltip/styles.css.js

@@ -0,0 +1,5 @@
+/* empty css                          */
+var tooltip = "uv_1y5sygv0";
+export {
+  tooltip
+};