boreal-ui 0.0.72 → 0.0.74

package/dist/core/Typography-DdTiWRgQ.cjs

@@ -0,0 +1,193 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const borealStyleConfig = require("./boreal-style-config-C1UIwOFN.cjs");
+const classNames = require("./classNames-BcWMx052.cjs");
+const DEFAULT_TAG_BY_VARIANT = {
+  display: "h1",
+  h1: "h1",
+  h2: "h2",
+  h3: "h3",
+  h4: "h4",
+  h5: "h5",
+  h6: "h6",
+  "body-lg": "p",
+  body: "p",
+  "body-sm": "p",
+  label: "span",
+  caption: "span",
+  overline: "span",
+  code: "code"
+};
+const variantClassMap = {
+  display: "display",
+  h1: "h1",
+  h2: "h2",
+  h3: "h3",
+  h4: "h4",
+  h5: "h5",
+  h6: "h6",
+  "body-lg": "bodyLg",
+  body: "body",
+  "body-sm": "bodySm",
+  label: "label",
+  caption: "caption",
+  overline: "overline",
+  code: "code"
+};
+const alignClassMap = {
+  left: "alignLeft",
+  center: "alignCenter",
+  right: "alignRight",
+  inherit: "alignInherit"
+};
+const weightClassMap = {
+  light: "weightLight",
+  normal: "weightNormal",
+  medium: "weightMedium",
+  bold: "weightBold",
+  bolder: "weightBolder",
+  inherit: "weightInherit"
+};
+const themeClassMap = {
+  primary: "primary",
+  secondary: "secondary",
+  tertiary: "tertiary",
+  quaternary: "quaternary",
+  clear: "clear",
+  success: "success",
+  warning: "warning",
+  error: "error",
+  inherit: "themeInherit"
+};
+function TypographyBase({
+  children,
+  variant = "body",
+  as,
+  align = "inherit",
+  weight = "inherit",
+  theme = borealStyleConfig.getDefaultTheme(),
+  italic = false,
+  underline = false,
+  truncate = false,
+  noWrap = false,
+  srOnly = false,
+  className,
+  style,
+  id,
+  title,
+  testId,
+  role,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  "aria-hidden": ariaHidden,
+  "aria-live": ariaLive,
+  "aria-atomic": ariaAtomic,
+  "aria-busy": ariaBusy,
+  classMap: classMap2,
+  combineClassNames
+}) {
+  const Component = as ?? DEFAULT_TAG_BY_VARIANT[variant];
+  const resolvedClassName = React.useMemo(
+    () => combineClassNames(
+      classMap2.typography,
+      classMap2[variantClassMap[variant]],
+      classMap2[alignClassMap[align]],
+      classMap2[weightClassMap[weight]],
+      classMap2[themeClassMap[theme]],
+      italic && classMap2.italic,
+      underline && classMap2.underline,
+      truncate && classMap2.truncate,
+      noWrap && classMap2.noWrap,
+      srOnly && classMap2.srOnly,
+      className
+    ),
+    [
+      classMap2,
+      variant,
+      align,
+      weight,
+      theme,
+      italic,
+      underline,
+      truncate,
+      noWrap,
+      srOnly,
+      className,
+      combineClassNames
+    ]
+  );
+  return React.createElement(
+    Component,
+    {
+      id,
+      title,
+      style,
+      role,
+      className: resolvedClassName,
+      "data-testid": testId ?? "typography",
+      "aria-label": ariaLabelledBy ? void 0 : ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-describedby": ariaDescribedBy,
+      "aria-hidden": ariaHidden,
+      "aria-live": ariaLive,
+      "aria-atomic": ariaLive ? ariaAtomic : void 0,
+      "aria-busy": ariaLive ? ariaBusy : void 0
+    },
+    children
+  );
+}
+TypographyBase.displayName = "TypographyBase";
+const classMap = {
+  typography: "typography",
+  display: "typography_display",
+  h1: "typography_h1",
+  h2: "typography_h2",
+  h3: "typography_h3",
+  h4: "typography_h4",
+  h5: "typography_h5",
+  h6: "typography_h6",
+  bodyLg: "typography_body-lg",
+  body: "typography_body",
+  bodySm: "typography_body-sm",
+  label: "typography_label",
+  caption: "typography_caption",
+  overline: "typography_overline",
+  code: "typography_code",
+  alignLeft: "typography_align-left",
+  alignCenter: "typography_align-center",
+  alignRight: "typography_align-right",
+  alignInherit: "typography_align-inherit",
+  weightLight: "typography_weight-light",
+  weightNormal: "typography_weight-normal",
+  weightMedium: "typography_weight-medium",
+  weightBold: "typography_weight-bold",
+  weightBolder: "typography_weight-bolder",
+  weightInherit: "typography_weight-inherit",
+  primary: "typography_primary",
+  secondary: "typography_secondary",
+  tertiary: "typography_tertiary",
+  quaternary: "typography_quaternary",
+  clear: "typography_clear",
+  success: "typography_success",
+  warning: "typography_warning",
+  error: "typography_error",
+  themeInherit: "typography_theme-inherit",
+  italic: "typography_italic",
+  underline: "typography_underline",
+  truncate: "typography_truncate",
+  noWrap: "typography_no-wrap"
+};
+function Typography(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TypographyBase,
+    {
+      ...props,
+      classMap,
+      combineClassNames: classNames.combineClassNames
+    }
+  );
+}
+exports.Typography = Typography;
+//# sourceMappingURL=Typography-DdTiWRgQ.cjs.map

package/dist/core/Typography-DdTiWRgQ.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typography-DdTiWRgQ.cjs","sources":["../../src/components/Typography/TypographyBase.tsx","../../src/components/Typography/core/Typography.tsx"],"sourcesContent":["import { createElement, JSX, useMemo } from \"react\";\r\nimport {\r\n  TypographyAlign,\r\n  TypographyBaseProps,\r\n  TypographyTheme,\r\n  TypographyVariant,\r\n  TypographyWeight,\r\n} from \"./Typography.types\";\r\nimport { getDefaultTheme } from \"@/config/boreal-style-config\";\r\n\r\nconst DEFAULT_TAG_BY_VARIANT: Record<\r\n  TypographyVariant,\r\n  keyof JSX.IntrinsicElements\r\n> = {\r\n  display: \"h1\",\r\n  h1: \"h1\",\r\n  h2: \"h2\",\r\n  h3: \"h3\",\r\n  h4: \"h4\",\r\n  h5: \"h5\",\r\n  h6: \"h6\",\r\n  \"body-lg\": \"p\",\r\n  body: \"p\",\r\n  \"body-sm\": \"p\",\r\n  label: \"span\",\r\n  caption: \"span\",\r\n  overline: \"span\",\r\n  code: \"code\",\r\n};\r\n\r\nconst variantClassMap: Record<TypographyVariant, string> = {\r\n  display: \"display\",\r\n  h1: \"h1\",\r\n  h2: \"h2\",\r\n  h3: \"h3\",\r\n  h4: \"h4\",\r\n  h5: \"h5\",\r\n  h6: \"h6\",\r\n  \"body-lg\": \"bodyLg\",\r\n  body: \"body\",\r\n  \"body-sm\": \"bodySm\",\r\n  label: \"label\",\r\n  caption: \"caption\",\r\n  overline: \"overline\",\r\n  code: \"code\",\r\n};\r\n\r\nconst alignClassMap: Record<TypographyAlign, string> = {\r\n  left: \"alignLeft\",\r\n  center: \"alignCenter\",\r\n  right: \"alignRight\",\r\n  inherit: \"alignInherit\",\r\n};\r\n\r\nconst weightClassMap: Record<TypographyWeight, string> = {\r\n  light: \"weightLight\",\r\n  normal: \"weightNormal\",\r\n  medium: \"weightMedium\",\r\n  bold: \"weightBold\",\r\n  bolder: \"weightBolder\",\r\n  inherit: \"weightInherit\",\r\n};\r\n\r\nconst themeClassMap: Record<TypographyTheme, string> = {\r\n  primary: \"primary\",\r\n  secondary: \"secondary\",\r\n  tertiary: \"tertiary\",\r\n  quaternary: \"quaternary\",\r\n  clear: \"clear\",\r\n  success: \"success\",\r\n  warning: \"warning\",\r\n  error: \"error\",\r\n  inherit: \"themeInherit\",\r\n};\r\n\r\nfunction TypographyBase({\r\n  children,\r\n  variant = \"body\",\r\n  as,\r\n  align = \"inherit\",\r\n  weight = \"inherit\",\r\n  theme = getDefaultTheme(),\r\n  italic = false,\r\n  underline = false,\r\n  truncate = false,\r\n  noWrap = false,\r\n  srOnly = false,\r\n  className,\r\n  style,\r\n  id,\r\n  title,\r\n  testId,\r\n  role,\r\n  \"aria-label\": ariaLabel,\r\n  \"aria-labelledby\": ariaLabelledBy,\r\n  \"aria-describedby\": ariaDescribedBy,\r\n  \"aria-hidden\": ariaHidden,\r\n  \"aria-live\": ariaLive,\r\n  \"aria-atomic\": ariaAtomic,\r\n  \"aria-busy\": ariaBusy,\r\n  classMap,\r\n  combineClassNames,\r\n}: TypographyBaseProps): JSX.Element {\r\n  const Component = as ?? DEFAULT_TAG_BY_VARIANT[variant];\r\n\r\n  const resolvedClassName = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.typography,\r\n        classMap[variantClassMap[variant]],\r\n        classMap[alignClassMap[align]],\r\n        classMap[weightClassMap[weight]],\r\n        classMap[themeClassMap[theme]],\r\n        italic && classMap.italic,\r\n        underline && classMap.underline,\r\n        truncate && classMap.truncate,\r\n        noWrap && classMap.noWrap,\r\n        srOnly && classMap.srOnly,\r\n        className,\r\n      ),\r\n    [\r\n      classMap,\r\n      variant,\r\n      align,\r\n      weight,\r\n      theme,\r\n      italic,\r\n      underline,\r\n      truncate,\r\n      noWrap,\r\n      srOnly,\r\n      className,\r\n      combineClassNames,\r\n    ],\r\n  );\r\n\r\n  return createElement(\r\n    Component,\r\n    {\r\n      id,\r\n      title,\r\n      style,\r\n      role,\r\n      className: resolvedClassName,\r\n      \"data-testid\": testId ?? \"typography\",\r\n\r\n      \"aria-label\": ariaLabelledBy ? undefined : ariaLabel,\r\n      \"aria-labelledby\": ariaLabelledBy,\r\n      \"aria-describedby\": ariaDescribedBy,\r\n      \"aria-hidden\": ariaHidden,\r\n      \"aria-live\": ariaLive,\r\n      \"aria-atomic\": ariaLive ? ariaAtomic : undefined,\r\n      \"aria-busy\": ariaLive ? ariaBusy : undefined,\r\n    },\r\n    children,\r\n  );\r\n}\r\n\r\nTypographyBase.displayName = \"TypographyBase\";\r\nexport default TypographyBase;\r\n","\"use client\";\r\n\r\nimport { JSX } from \"react\";\r\nimport TypographyBase from \"../TypographyBase\";\r\nimport { TypographyProps } from \"../Typography.types\";\r\nimport { combineClassNames } from \"@/utils/classNames\";\r\nimport \"./Typography.scss\";\r\n\r\nconst classMap = {\r\n  typography: \"typography\",\r\n  display: \"typography_display\",\r\n  h1: \"typography_h1\",\r\n  h2: \"typography_h2\",\r\n  h3: \"typography_h3\",\r\n  h4: \"typography_h4\",\r\n  h5: \"typography_h5\",\r\n  h6: \"typography_h6\",\r\n  bodyLg: \"typography_body-lg\",\r\n  body: \"typography_body\",\r\n  bodySm: \"typography_body-sm\",\r\n  label: \"typography_label\",\r\n  caption: \"typography_caption\",\r\n  overline: \"typography_overline\",\r\n  code: \"typography_code\",\r\n  alignLeft: \"typography_align-left\",\r\n  alignCenter: \"typography_align-center\",\r\n  alignRight: \"typography_align-right\",\r\n  alignInherit: \"typography_align-inherit\",\r\n  weightLight: \"typography_weight-light\",\r\n  weightNormal: \"typography_weight-normal\",\r\n  weightMedium: \"typography_weight-medium\",\r\n  weightBold: \"typography_weight-bold\",\r\n  weightBolder: \"typography_weight-bolder\",\r\n  weightInherit: \"typography_weight-inherit\",\r\n  primary: \"typography_primary\",\r\n  secondary: \"typography_secondary\",\r\n  tertiary: \"typography_tertiary\",\r\n  quaternary: \"typography_quaternary\",\r\n  clear: \"typography_clear\",\r\n  success: \"typography_success\",\r\n  warning: \"typography_warning\",\r\n  error: \"typography_error\",\r\n  themeInherit: \"typography_theme-inherit\",\r\n  italic: \"typography_italic\",\r\n  underline: \"typography_underline\",\r\n  truncate: \"typography_truncate\",\r\n  noWrap: \"typography_no-wrap\",\r\n};\r\n\r\nexport default function Typography(props: TypographyProps): JSX.Element {\r\n  return (\r\n    <TypographyBase\r\n      {...props}\r\n      classMap={classMap}\r\n      combineClassNames={combineClassNames}\r\n    />\r\n  );\r\n}\r\n"],"names":["getDefaultTheme","classMap","useMemo","createElement","jsx","combineClassNames"],"mappings":"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"}

package/dist/core/Typography.cjs.js

@@ -1,4 +1,4 @@
 "use strict";
-const Typography = require("./Typography-D9WF2TVi.cjs");
+const Typography = require("./Typography-DdTiWRgQ.cjs");
 module.exports = Typography.Typography;
 //# sourceMappingURL=Typography.cjs.js.map

package/dist/core/Typography.js

@@ -1,4 +1,4 @@
-import { T } from "./Typography-DeV9eoQj.js";
+import { T } from "./Typography-D0hPzK5Y.js";
 export {
   T as default
 };

package/dist/core/boreal-ui.css

@@ -7569,6 +7569,8 @@ samp {
 }
 .checkbox {
   display: inline-flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
   align-items: center;
   justify-content: center;
   cursor: pointer;
@@ -7925,9 +7927,14 @@ samp {
   border: none;
   transform: none;
 }
+.checkbox_label-wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--spacing-xs);
+}
 .checkbox_label {
   color: var(--text-color-primary);
-  margin-bottom: -1px;
   font-family: var(--font-family-ui);
   font-size: var(--font-size-body-sm);
   font-weight: var(--font-weight-body);
@@ -11717,6 +11724,25 @@ samp {
   background-color: transparent;
   color: var(--text-color-primary);
 }
+.textInput input {
+  width: 100%;
+  padding: var(--spacing-sm);
+  border: none;
+  height: 100%;
+  background-color: transparent;
+  color: var(--text-color-primary);
+}
+.textInput input:hover {
+  background-color: transparent;
+}
+.textInput input:focus, .textInput input:focus-within {
+  outline: none;
+}
+.textInput:focus-within {
+  outline: 2px solid var(--focus-outline-color, var(--primary-color));
+  outline-offset: 3px;
+  border-radius: var(--border-radius-md);
+}
 .textInput::placeholder {
   color: var(--text-color-primary);
   opacity: 0.8;
@@ -12670,6 +12696,7 @@ samp {
   display: flex;
   flex-direction: column;
   justify-content: center;
+  align-items: center;
   gap: var(--spacing-sm);
   font-family: var(--font-family-ui);
   font-size: var(--font-size-body-sm);
@@ -12773,6 +12800,7 @@ samp {
   padding: 0;
   margin: 0;
   max-height: 300px;
+  width: 100%;
   overflow-y: auto;
 }
 @media (width <= 479.98px) {
@@ -13756,6 +13784,16 @@ samp {
   outline: 2px solid var(--focus-outline-color, var(--primary-color));
   outline-offset: 0.5px;
 }
+.data_table_wrapper .data_table_sort_button {
+  margin-left: var(--spacing-xxs);
+  background-color: transparent;
+  border: none;
+  color: var(--text-color-primary);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--spacing-xs);
+}
 .data_table_wrapper .data_table_sort_icon {
   margin-left: var(--spacing-xxs);
   font-size: 0.9em;
@@ -21297,7 +21335,7 @@ samp {
 .select_wrapper {
   position: relative;
   display: inline-flex;
-  justify-content: space-evenly;
+  justify-content: center;
   align-items: center;
   width: fit-content;
   margin: var(--spacing-xs) 0;
@@ -21528,7 +21566,7 @@ samp {
 .select {
   width: 100%;
   min-height: 40px;
-  padding: 5px 30px;
+  padding: 5px 10px;
   font-family: var(--font-family-ui);
   font-size: var(--font-size-label);
   font-weight: var(--font-weight-label);