@hitachivantara/uikit-react-pentaho 0.1.3 → 0.2.0

package/dist/cjs/Canvas/BottomPanel/BottomPanel.cjs

@@ -5,8 +5,8 @@ const react = require("react");
 const reactResizeDetector = require("react-resize-detector");
 const uikitReactCore = require("@hitachivantara/uikit-react-core");
 const BottomPanel_styles = require("./BottomPanel.styles.cjs");
-const Tabs = require("../Tabs/Tabs.cjs");
-const Tab = require("../Tab/Tab.cjs");
+const PanelTabs = require("../PanelTabs/PanelTabs.cjs");
+const PanelTab = require("../PanelTab/PanelTab.cjs");
 const HvCanvasBottomPanel = react.forwardRef((props, ref) => {
   const {
     id: idProp,
@@ -78,7 +78,7 @@ const HvCanvasBottomPanel = react.forwardRef((props, ref) => {
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.tabsRoot, children: [
           /* @__PURE__ */ jsxRuntime.jsx(
-            Tabs.HvCanvasTabs,
+            PanelTabs.HvCanvasPanelTabs,
             {
               style: {
                 // @ts-ignore
@@ -88,7 +88,7 @@ const HvCanvasBottomPanel = react.forwardRef((props, ref) => {
               onChange: handleTabChange,
               value: selectedTab,
               children: tabs.map((tab, index) => /* @__PURE__ */ jsxRuntime.jsx(
-                Tab.HvCanvasTab,
+                PanelTab.HvCanvasPanelTab,
                 {
                   ref: index === 0 ? tabRef : void 0,
                   id: `${id}-${tab.id}`,

package/dist/cjs/Canvas/PanelTab/PanelTab.cjs

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const Tab = require("@mui/base/Tab");
+const uikitReactCore = require("@hitachivantara/uikit-react-core");
+const PanelTab_styles = require("./PanelTab.styles.cjs");
+const HvCanvasPanelTab = react.forwardRef((props, ref) => {
+  const {
+    classes: classesProp,
+    className,
+    ...others
+  } = uikitReactCore.useDefaultProps("HvCanvasPanelTab", props);
+  const { classes, cx } = PanelTab_styles.useClasses(classesProp);
+  return /* @__PURE__ */ jsxRuntime.jsx(Tab.Tab, { ref, className: cx(classes.root, className), ...others });
+});
+exports.canvasPanelTabClasses = PanelTab_styles.staticClasses;
+exports.HvCanvasPanelTab = HvCanvasPanelTab;

package/dist/cjs/Canvas/{Tab/Tab.styles.cjs → PanelTab/PanelTab.styles.cjs}

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const Tab = require("@mui/base/Tab");
 const uikitReactCore = require("@hitachivantara/uikit-react-core");
-const { staticClasses, useClasses } = uikitReactCore.createClasses("HvCanvasTab", {
+const { staticClasses, useClasses } = uikitReactCore.createClasses("HvCanvasPanelTab", {
   root: {
     height: "100%",
     display: "flex",

package/dist/cjs/Canvas/PanelTabs/PanelTabs.cjs

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const Tabs = require("@mui/base/Tabs");
+const TabsList = require("@mui/base/TabsList");
+const uikitReactCore = require("@hitachivantara/uikit-react-core");
+const PanelTabs_styles = require("./PanelTabs.styles.cjs");
+const HvCanvasPanelTabs = react.forwardRef((props, ref) => {
+  const {
+    selectionFollowsFocus = true,
+    children,
+    className,
+    classes: classesProp,
+    ...others
+  } = uikitReactCore.useDefaultProps("HvCanvasPanelTabs", props);
+  const { classes, cx } = PanelTabs_styles.useClasses(classesProp);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Tabs.Tabs,
+    {
+      ref,
+      className: cx(classes.root, className),
+      selectionFollowsFocus,
+      ...others,
+      children: /* @__PURE__ */ jsxRuntime.jsx(TabsList.TabsList, { className: classes.list, children })
+    }
+  );
+});
+exports.canvasPanelTabsClasses = PanelTabs_styles.staticClasses;
+exports.HvCanvasPanelTabs = HvCanvasPanelTabs;

package/dist/cjs/Canvas/{Tabs/Tabs.styles.cjs → PanelTabs/PanelTabs.styles.cjs}

@@ -1,13 +1,16 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitReactCore = require("@hitachivantara/uikit-react-core");
-const { staticClasses, useClasses } = uikitReactCore.createClasses("HvCanvasTabs", {
-  root: {},
-  list: {
-    display: "flex",
-    width: "100%",
-    height: 48
+const { staticClasses, useClasses } = uikitReactCore.createClasses(
+  "HvCanvasPanelTabs",
+  {
+    root: {},
+    list: {
+      display: "flex",
+      width: "100%",
+      height: 48
+    }
   }
-});
+);
 exports.staticClasses = staticClasses;
 exports.useClasses = useClasses;

package/dist/cjs/Canvas/SidePanel/SidePanel.cjs

@@ -5,8 +5,8 @@ const react = require("react");
 const uikitReactCore = require("@hitachivantara/uikit-react-core");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const SidePanel_styles = require("./SidePanel.styles.cjs");
-const Tabs = require("../Tabs/Tabs.cjs");
-const Tab = require("../Tab/Tab.cjs");
+const PanelTabs = require("../PanelTabs/PanelTabs.cjs");
+const PanelTab = require("../PanelTab/PanelTab.cjs");
 const DEFAULT_LABELS = {
   open: "Open",
   close: "Close"
@@ -55,13 +55,13 @@ const HvCanvasSidePanel = react.forwardRef((props, ref) => {
         ...others,
         children: [
           tabs && /* @__PURE__ */ jsxRuntime.jsx(
-            Tabs.HvCanvasTabs,
+            PanelTabs.HvCanvasPanelTabs,
             {
               className: classes.tabs,
               value: selectedTab,
               onChange: handleTabChange,
               children: tabs.map((tab) => /* @__PURE__ */ jsxRuntime.jsx(
-                Tab.HvCanvasTab,
+                PanelTab.HvCanvasPanelTab,
                 {
                   id: `${id}-${tab.id}`,
                   value: tab.id,

package/dist/cjs/index.cjs

@@ -1,22 +1,22 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const Toolbar_styles = require("./Canvas/Toolbar/Toolbar.styles.cjs");
-const Toolbar = require("./Canvas/Toolbar/Toolbar.cjs");
-const SidePanel_styles = require("./Canvas/SidePanel/SidePanel.styles.cjs");
-const SidePanel = require("./Canvas/SidePanel/SidePanel.cjs");
-const Tabs_styles = require("./Canvas/Tabs/Tabs.styles.cjs");
-const Tabs = require("./Canvas/Tabs/Tabs.cjs");
 const BottomPanel_styles = require("./Canvas/BottomPanel/BottomPanel.styles.cjs");
 const BottomPanel = require("./Canvas/BottomPanel/BottomPanel.cjs");
-const Tab_styles = require("./Canvas/Tab/Tab.styles.cjs");
-const Tab = require("./Canvas/Tab/Tab.cjs");
-exports.canvasToolbarClasses = Toolbar_styles.staticClasses;
-exports.HvCanvasToolbar = Toolbar.HvCanvasToolbar;
-exports.canvasSidePanelClasses = SidePanel_styles.staticClasses;
-exports.HvCanvasSidePanel = SidePanel.HvCanvasSidePanel;
-exports.canvasTabsClasses = Tabs_styles.staticClasses;
-exports.HvCanvasTabs = Tabs.HvCanvasTabs;
+const PanelTab_styles = require("./Canvas/PanelTab/PanelTab.styles.cjs");
+const PanelTab = require("./Canvas/PanelTab/PanelTab.cjs");
+const PanelTabs_styles = require("./Canvas/PanelTabs/PanelTabs.styles.cjs");
+const PanelTabs = require("./Canvas/PanelTabs/PanelTabs.cjs");
+const SidePanel_styles = require("./Canvas/SidePanel/SidePanel.styles.cjs");
+const SidePanel = require("./Canvas/SidePanel/SidePanel.cjs");
+const Toolbar_styles = require("./Canvas/Toolbar/Toolbar.styles.cjs");
+const Toolbar = require("./Canvas/Toolbar/Toolbar.cjs");
 exports.canvasBottomPanelClasses = BottomPanel_styles.staticClasses;
 exports.HvCanvasBottomPanel = BottomPanel.HvCanvasBottomPanel;
-exports.canvasTabClasses = Tab_styles.staticClasses;
-exports.HvCanvasTab = Tab.HvCanvasTab;
+exports.canvasPanelTabClasses = PanelTab_styles.staticClasses;
+exports.HvCanvasPanelTab = PanelTab.HvCanvasPanelTab;
+exports.canvasPanelTabsClasses = PanelTabs_styles.staticClasses;
+exports.HvCanvasPanelTabs = PanelTabs.HvCanvasPanelTabs;
+exports.canvasSidePanelClasses = SidePanel_styles.staticClasses;
+exports.HvCanvasSidePanel = SidePanel.HvCanvasSidePanel;
+exports.canvasToolbarClasses = Toolbar_styles.staticClasses;
+exports.HvCanvasToolbar = Toolbar.HvCanvasToolbar;

package/dist/esm/Canvas/BottomPanel/BottomPanel.js

@@ -4,8 +4,8 @@ import { useResizeDetector } from "react-resize-detector";
 import { useDefaultProps, useUniqueId, useControlled, HvActionsGeneric, HvPanel } from "@hitachivantara/uikit-react-core";
 import { useClasses } from "./BottomPanel.styles.js";
 import { staticClasses } from "./BottomPanel.styles.js";
-import { HvCanvasTabs } from "../Tabs/Tabs.js";
-import { HvCanvasTab } from "../Tab/Tab.js";
+import { HvCanvasPanelTabs } from "../PanelTabs/PanelTabs.js";
+import { HvCanvasPanelTab } from "../PanelTab/PanelTab.js";
 const HvCanvasBottomPanel = forwardRef((props, ref) => {
   const {
     id: idProp,
@@ -77,7 +77,7 @@ const HvCanvasBottomPanel = forwardRef((props, ref) => {
       children: [
         /* @__PURE__ */ jsxs("div", { className: classes.tabsRoot, children: [
           /* @__PURE__ */ jsx(
-            HvCanvasTabs,
+            HvCanvasPanelTabs,
             {
               style: {
                 // @ts-ignore
@@ -87,7 +87,7 @@ const HvCanvasBottomPanel = forwardRef((props, ref) => {
               onChange: handleTabChange,
               value: selectedTab,
               children: tabs.map((tab, index) => /* @__PURE__ */ jsx(
-                HvCanvasTab,
+                HvCanvasPanelTab,
                 {
                   ref: index === 0 ? tabRef : void 0,
                   id: `${id}-${tab.id}`,

package/dist/esm/Canvas/BottomPanel/BottomPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"BottomPanel.js","sources":["../../../../src/Canvas/BottomPanel/BottomPanel.tsx"],"sourcesContent":["import { forwardRef, useMemo } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\nimport {\n  ExtractNames,\n  HvActionGeneric,\n  HvActionsGeneric,\n  HvActionsGenericProps,\n  HvBaseProps,\n  HvPanel,\n  useControlled,\n  useDefaultProps,\n  useUniqueId,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { HvCanvasTab } from \"../Tab\";\nimport { HvCanvasTabs, HvCanvasTabsProps } from \"../Tabs\";\nimport { staticClasses, useClasses } from \"./BottomPanel.styles\";\n\nexport { staticClasses as canvasBottomPanelClasses };\n\nexport type HvCanvasBottomPanelClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCanvasBottomPanelProps extends HvBaseProps {\n  /** Open state of the bottom panel. */\n  open?: boolean;\n  /** Minimize state of the bottom panel tabs'. */\n  minimize?: boolean;\n  /** List of tabs visible on the panel. */\n  tabs: {\n    id: string | number;\n    title: React.ReactNode;\n  }[];\n  /** Id of the selected tab if it needs to be controlled. */\n  tab?: string | number;\n  /** Callback triggered when a tab changes/is clicked. */\n  onTabChange?: (\n    event: React.SyntheticEvent | null,\n    tabId: string | number | null,\n  ) => void;\n  /** Actions to be rendered in the left side of a tab. If more than one action is provided, a dropdown menu will be used. */\n  leftActions?: HvActionsGenericProps[\"actions\"];\n  /** Actions to be rendered in the right side of a tab.If more than two actions are provided, a dropdown menu will be used to add the remaining actions. */\n  rightActions?: HvActionsGenericProps[\"actions\"];\n  /** Callback triggered when a right or left action is clicked. */\n  onAction?: (\n    event: React.SyntheticEvent,\n    action: HvActionGeneric,\n    tabId: string | number,\n  ) => void;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvCanvasBottomPanelClasses;\n}\n\n/**\n * A bottom panel component to use in a canvas context.\n */\nexport const HvCanvasBottomPanel = forwardRef<\n  HTMLDivElement,\n  HvCanvasBottomPanelProps\n>((props, ref) => {\n  const {\n    id: idProp,\n    className,\n    children,\n    open,\n    tabs,\n    minimize,\n    leftActions,\n    rightActions,\n    tab: tabProp,\n    classes: classesProp,\n    onTabChange,\n    onAction,\n    ...others\n  } = useDefaultProps(\"HvCanvasBottomPanel\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const id = useUniqueId(idProp);\n\n  // Tab resize detector: to position tab actions and set the panel top right border radius\n  const { width: tabWidth = 0, ref: tabRef } = useResizeDetector({\n    handleHeight: false,\n  });\n  // Tab panel resize detector: to set the panel top right border radius\n  const { width: panelWidth = 0, ref: panelRef } = useResizeDetector({\n    handleHeight: false,\n  });\n\n  // Left actions resize detector: to position tab title according with actions\n  const { width: leftActionWidth = 32, ref: leftActionRef } = useResizeDetector(\n    {\n      handleHeight: false,\n      refreshMode: \"debounce\",\n      refreshOptions: {\n        trailing: true,\n      },\n    },\n  );\n  // Right actions resize detector: to position tab title according with actions\n  const { width: rightActionWidth = 32, ref: rightActionRef } =\n    useResizeDetector({\n      handleHeight: false,\n      refreshMode: \"debounce\",\n      refreshOptions: {\n        trailing: true,\n      },\n    });\n\n  const overflowing = useMemo(() => {\n    const scrollWidth = tabRef.current?.scrollWidth ?? 0;\n    return scrollWidth - tabWidth >= 1;\n  }, [tabRef, tabWidth]);\n\n  const [selectedTab, setSelectedTab] = useControlled<string | number | null>(\n    tabProp,\n    tabs[0].id,\n  );\n\n  const handleTabChange: HvCanvasTabsProps[\"onChange\"] = (event, tabId) => {\n    setSelectedTab(tabId);\n    onTabChange?.(event, tabId);\n  };\n\n  return (\n    <div\n      id={id}\n      ref={ref}\n      className={cx(\n        classes.root,\n        {\n          [classes.closed]: !open,\n          [classes.minimized]: minimize,\n          [classes.multipleTabs]: tabs.length > 1,\n          [classes.overflowing]: overflowing,\n        },\n        className,\n      )}\n      {...others}\n    >\n      <div className={classes.tabsRoot}>\n        <HvCanvasTabs\n          style={{\n            // @ts-ignore\n            \"--left-actions-width\": `${leftActionWidth}px`,\n            \"--right-actions-width\": `${rightActionWidth}px`,\n          }}\n          onChange={handleTabChange}\n          value={selectedTab}\n        >\n          {tabs.map((tab, index) => (\n            <HvCanvasTab\n              ref={index === 0 ? tabRef : undefined}\n              key={tab.id}\n              id={`${id}-${tab.id}`}\n              value={tab.id}\n              className={classes.tab}\n            >\n              <div className={classes.tabTitle}>{tab.title}</div>\n            </HvCanvasTab>\n          ))}\n        </HvCanvasTabs>\n        {/* For accessibility purposes, these buttons cannot be children of a tablist so they are rendered as HvCanvasTabs sibling. */}\n        {(leftActions || rightActions) && !overflowing\n          ? tabs.map((tab, index) => {\n              const btnsDisabled = selectedTab !== tab.id && !minimize;\n              return (\n                <div\n                  key={tab.id}\n                  style={{\n                    // @ts-ignore\n                    \"--tab-width\": `${tabWidth}px`,\n                    \"--right\": `calc((${index} + 1) * var(--tab-width))`,\n                    \"--left\": `calc(${index} * var(--tab-width))`,\n                  }}\n                >\n                  {leftActions && (\n                    <div ref={leftActionRef} className={classes.leftActions}>\n                      <HvActionsGeneric\n                        maxVisibleActions={1}\n                        actions={leftActions}\n                        disabled={btnsDisabled}\n                        onAction={(event, action) =>\n                          onAction?.(event, action, tab.id)\n                        }\n                        variant=\"secondaryGhost\"\n                        iconOnly\n                      />\n                    </div>\n                  )}\n                  {rightActions && (\n                    <div ref={rightActionRef} className={classes.rightActions}>\n                      <HvActionsGeneric\n                        maxVisibleActions={2}\n                        actions={rightActions}\n                        disabled={btnsDisabled}\n                        onAction={(event, action) =>\n                          onAction?.(event, action, tab.id)\n                        }\n                        variant=\"secondaryGhost\"\n                        iconOnly\n                      />\n                    </div>\n                  )}\n                </div>\n              );\n            })\n          : null}\n      </div>\n      <HvPanel\n        ref={panelRef}\n        role=\"tabpanel\"\n        aria-labelledby={`${id}-${selectedTab}`}\n        className={classes.content}\n        style={{\n          // @ts-ignore\n          \"--right-border-radius\":\n            tabWidth * tabs.length >= panelWidth ? \"0px\" : \"16px\",\n        }}\n      >\n        {children}\n      </HvPanel>\n    </div>\n  );\n});\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"BottomPanel.js","sources":["../../../../src/Canvas/BottomPanel/BottomPanel.tsx"],"sourcesContent":["import { forwardRef, useMemo } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\nimport {\n  ExtractNames,\n  HvActionGeneric,\n  HvActionsGeneric,\n  HvActionsGenericProps,\n  HvBaseProps,\n  HvPanel,\n  useControlled,\n  useDefaultProps,\n  useUniqueId,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { HvCanvasPanelTab } from \"../PanelTab\";\nimport { HvCanvasPanelTabs, HvCanvasPanelTabsProps } from \"../PanelTabs\";\nimport { staticClasses, useClasses } from \"./BottomPanel.styles\";\n\nexport { staticClasses as canvasBottomPanelClasses };\n\nexport type HvCanvasBottomPanelClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCanvasBottomPanelProps extends HvBaseProps {\n  /** Open state of the bottom panel. */\n  open?: boolean;\n  /** Minimize state of the bottom panel tabs'. */\n  minimize?: boolean;\n  /** List of tabs visible on the panel. */\n  tabs: {\n    id: string | number;\n    title: React.ReactNode;\n  }[];\n  /** Id of the selected tab if it needs to be controlled. */\n  tab?: string | number;\n  /** Callback triggered when a tab changes/is clicked. */\n  onTabChange?: (\n    event: React.SyntheticEvent | null,\n    tabId: string | number | null,\n  ) => void;\n  /** Actions to be rendered in the left side of a tab. If more than one action is provided, a dropdown menu will be used. */\n  leftActions?: HvActionsGenericProps[\"actions\"];\n  /** Actions to be rendered in the right side of a tab.If more than two actions are provided, a dropdown menu will be used to add the remaining actions. */\n  rightActions?: HvActionsGenericProps[\"actions\"];\n  /** Callback triggered when a right or left action is clicked. */\n  onAction?: (\n    event: React.SyntheticEvent,\n    action: HvActionGeneric,\n    tabId: string | number,\n  ) => void;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvCanvasBottomPanelClasses;\n}\n\n/**\n * A bottom panel component to use in a canvas context.\n */\nexport const HvCanvasBottomPanel = forwardRef<\n  HTMLDivElement,\n  HvCanvasBottomPanelProps\n>((props, ref) => {\n  const {\n    id: idProp,\n    className,\n    children,\n    open,\n    tabs,\n    minimize,\n    leftActions,\n    rightActions,\n    tab: tabProp,\n    classes: classesProp,\n    onTabChange,\n    onAction,\n    ...others\n  } = useDefaultProps(\"HvCanvasBottomPanel\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const id = useUniqueId(idProp);\n\n  // Tab resize detector: to position tab actions and set the panel top right border radius\n  const { width: tabWidth = 0, ref: tabRef } = useResizeDetector({\n    handleHeight: false,\n  });\n  // Tab panel resize detector: to set the panel top right border radius\n  const { width: panelWidth = 0, ref: panelRef } = useResizeDetector({\n    handleHeight: false,\n  });\n\n  // Left actions resize detector: to position tab title according with actions\n  const { width: leftActionWidth = 32, ref: leftActionRef } = useResizeDetector(\n    {\n      handleHeight: false,\n      refreshMode: \"debounce\",\n      refreshOptions: {\n        trailing: true,\n      },\n    },\n  );\n  // Right actions resize detector: to position tab title according with actions\n  const { width: rightActionWidth = 32, ref: rightActionRef } =\n    useResizeDetector({\n      handleHeight: false,\n      refreshMode: \"debounce\",\n      refreshOptions: {\n        trailing: true,\n      },\n    });\n\n  const overflowing = useMemo(() => {\n    const scrollWidth = tabRef.current?.scrollWidth ?? 0;\n    return scrollWidth - tabWidth >= 1;\n  }, [tabRef, tabWidth]);\n\n  const [selectedTab, setSelectedTab] = useControlled<string | number | null>(\n    tabProp,\n    tabs[0].id,\n  );\n\n  const handleTabChange: HvCanvasPanelTabsProps[\"onChange\"] = (\n    event,\n    tabId,\n  ) => {\n    setSelectedTab(tabId);\n    onTabChange?.(event, tabId);\n  };\n\n  return (\n    <div\n      id={id}\n      ref={ref}\n      className={cx(\n        classes.root,\n        {\n          [classes.closed]: !open,\n          [classes.minimized]: minimize,\n          [classes.multipleTabs]: tabs.length > 1,\n          [classes.overflowing]: overflowing,\n        },\n        className,\n      )}\n      {...others}\n    >\n      <div className={classes.tabsRoot}>\n        <HvCanvasPanelTabs\n          style={{\n            // @ts-ignore\n            \"--left-actions-width\": `${leftActionWidth}px`,\n            \"--right-actions-width\": `${rightActionWidth}px`,\n          }}\n          onChange={handleTabChange}\n          value={selectedTab}\n        >\n          {tabs.map((tab, index) => (\n            <HvCanvasPanelTab\n              ref={index === 0 ? tabRef : undefined}\n              key={tab.id}\n              id={`${id}-${tab.id}`}\n              value={tab.id}\n              className={classes.tab}\n            >\n              <div className={classes.tabTitle}>{tab.title}</div>\n            </HvCanvasPanelTab>\n          ))}\n        </HvCanvasPanelTabs>\n        {/* For accessibility purposes, these buttons cannot be children of a tablist so they are rendered as HvCanvasPanelTabs sibling. */}\n        {(leftActions || rightActions) && !overflowing\n          ? tabs.map((tab, index) => {\n              const btnsDisabled = selectedTab !== tab.id && !minimize;\n              return (\n                <div\n                  key={tab.id}\n                  style={{\n                    // @ts-ignore\n                    \"--tab-width\": `${tabWidth}px`,\n                    \"--right\": `calc((${index} + 1) * var(--tab-width))`,\n                    \"--left\": `calc(${index} * var(--tab-width))`,\n                  }}\n                >\n                  {leftActions && (\n                    <div ref={leftActionRef} className={classes.leftActions}>\n                      <HvActionsGeneric\n                        maxVisibleActions={1}\n                        actions={leftActions}\n                        disabled={btnsDisabled}\n                        onAction={(event, action) =>\n                          onAction?.(event, action, tab.id)\n                        }\n                        variant=\"secondaryGhost\"\n                        iconOnly\n                      />\n                    </div>\n                  )}\n                  {rightActions && (\n                    <div ref={rightActionRef} className={classes.rightActions}>\n                      <HvActionsGeneric\n                        maxVisibleActions={2}\n                        actions={rightActions}\n                        disabled={btnsDisabled}\n                        onAction={(event, action) =>\n                          onAction?.(event, action, tab.id)\n                        }\n                        variant=\"secondaryGhost\"\n                        iconOnly\n                      />\n                    </div>\n                  )}\n                </div>\n              );\n            })\n          : null}\n      </div>\n      <HvPanel\n        ref={panelRef}\n        role=\"tabpanel\"\n        aria-labelledby={`${id}-${selectedTab}`}\n        className={classes.content}\n        style={{\n          // @ts-ignore\n          \"--right-border-radius\":\n            tabWidth * tabs.length >= panelWidth ? \"0px\" : \"16px\",\n        }}\n      >\n        {children}\n      </HvPanel>\n    </div>\n  );\n});\n"],"names":[],"mappings":"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"}

package/dist/esm/Canvas/PanelTab/PanelTab.js

@@ -0,0 +1,19 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { Tab } from "@mui/base/Tab";
+import { useDefaultProps } from "@hitachivantara/uikit-react-core";
+import { useClasses } from "./PanelTab.styles.js";
+import { staticClasses } from "./PanelTab.styles.js";
+const HvCanvasPanelTab = forwardRef((props, ref) => {
+  const {
+    classes: classesProp,
+    className,
+    ...others
+  } = useDefaultProps("HvCanvasPanelTab", props);
+  const { classes, cx } = useClasses(classesProp);
+  return /* @__PURE__ */ jsx(Tab, { ref, className: cx(classes.root, className), ...others });
+});
+export {
+  HvCanvasPanelTab,
+  staticClasses as canvasPanelTabClasses
+};

package/dist/esm/Canvas/PanelTab/PanelTab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PanelTab.js","sources":["../../../../src/Canvas/PanelTab/PanelTab.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Tab, TabProps } from \"@mui/base/Tab\";\nimport {\n  ExtractNames,\n  useDefaultProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { staticClasses, useClasses } from \"./PanelTab.styles\";\n\nexport { staticClasses as canvasPanelTabClasses };\n\nexport type HvCanvasPanelTabClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCanvasPanelTabProps extends TabProps {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvCanvasPanelTabClasses;\n}\n\n/**\n * The tab component to use inside `HvCanvasPanelTabs`.\n */\nexport const HvCanvasPanelTab = forwardRef<\n  HTMLButtonElement,\n  HvCanvasPanelTabProps\n>((props, ref) => {\n  const {\n    classes: classesProp,\n    className,\n    ...others\n  } = useDefaultProps(\"HvCanvasPanelTab\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  return <Tab ref={ref} className={cx(classes.root, className)} {...others} />;\n});\n"],"names":[],"mappings":";;;;;;AAqBO,MAAM,mBAAmB,WAG9B,CAAC,OAAO,QAAQ;AACV,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,oBAAoB,KAAK;AAE7C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAEvC,SAAA,oBAAC,KAAI,EAAA,KAAU,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,OAAQ,CAAA;AAC5E,CAAC;"}

package/dist/esm/Canvas/{Tab/Tab.styles.js → PanelTab/PanelTab.styles.js}

@@ -1,6 +1,6 @@
 import { tabClasses } from "@mui/base/Tab";
 import { createClasses, theme, outlineStyles } from "@hitachivantara/uikit-react-core";
-const { staticClasses, useClasses } = createClasses("HvCanvasTab", {
+const { staticClasses, useClasses } = createClasses("HvCanvasPanelTab", {
   root: {
     height: "100%",
     display: "flex",

package/dist/esm/Canvas/PanelTab/PanelTab.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PanelTab.styles.js","sources":["../../../../src/Canvas/PanelTab/PanelTab.styles.tsx"],"sourcesContent":["import { tabClasses } from \"@mui/base/Tab\";\nimport {\n  createClasses,\n  outlineStyles,\n  theme,\n} from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvCanvasPanelTab\", {\n  root: {\n    height: \"100%\",\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    flex: 1,\n    borderRadius: \"16px 16px 0 0\",\n    backgroundColor: theme.colors.atmo2,\n    color: theme.colors.secondary_60,\n    overflow: \"hidden\",\n    width: \"100%\",\n    boxShadow: \"0px -2px 8px 0px #4141410F\",\n    paddingInlineEnd: 0,\n    paddingInlineStart: 0,\n    \"& svg .color0\": {\n      fill: \"currentcolor\",\n    },\n    \"&:hover\": {\n      cursor: \"pointer\",\n    },\n    \"&:focus\": {\n      backgroundColor: theme.colors.atmo1,\n    },\n    [`&.${tabClasses.selected}`]: {\n      backgroundColor: theme.colors.atmo1,\n      ...theme.typography.label,\n    },\n    \"&:focus-visible\": {\n      ...outlineStyles,\n    },\n  },\n});\n"],"names":[],"mappings":";;AAOO,MAAM,EAAE,eAAe,eAAe,cAAc,oBAAoB;AAAA,EAC7E,MAAM;AAAA,IACJ,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,MAAM;AAAA,IACN,cAAc;AAAA,IACd,iBAAiB,MAAM,OAAO;AAAA,IAC9B,OAAO,MAAM,OAAO;AAAA,IACpB,UAAU;AAAA,IACV,OAAO;AAAA,IACP,WAAW;AAAA,IACX,kBAAkB;AAAA,IAClB,oBAAoB;AAAA,IACpB,iBAAiB;AAAA,MACf,MAAM;AAAA,IACR;AAAA,IACA,WAAW;AAAA,MACT,QAAQ;AAAA,IACV;AAAA,IACA,WAAW;AAAA,MACT,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,IACA,CAAC,KAAK,WAAW,QAAQ,EAAE,GAAG;AAAA,MAC5B,iBAAiB,MAAM,OAAO;AAAA,MAC9B,GAAG,MAAM,WAAW;AAAA,IACtB;AAAA,IACA,mBAAmB;AAAA,MACjB,GAAG;AAAA,IACL;AAAA,EACF;AACF,CAAC;"}

package/dist/esm/Canvas/PanelTabs/PanelTabs.js

@@ -0,0 +1,31 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { Tabs } from "@mui/base/Tabs";
+import { TabsList } from "@mui/base/TabsList";
+import { useDefaultProps } from "@hitachivantara/uikit-react-core";
+import { useClasses } from "./PanelTabs.styles.js";
+import { staticClasses } from "./PanelTabs.styles.js";
+const HvCanvasPanelTabs = forwardRef((props, ref) => {
+  const {
+    selectionFollowsFocus = true,
+    children,
+    className,
+    classes: classesProp,
+    ...others
+  } = useDefaultProps("HvCanvasPanelTabs", props);
+  const { classes, cx } = useClasses(classesProp);
+  return /* @__PURE__ */ jsx(
+    Tabs,
+    {
+      ref,
+      className: cx(classes.root, className),
+      selectionFollowsFocus,
+      ...others,
+      children: /* @__PURE__ */ jsx(TabsList, { className: classes.list, children })
+    }
+  );
+});
+export {
+  HvCanvasPanelTabs,
+  staticClasses as canvasPanelTabsClasses
+};

package/dist/esm/Canvas/PanelTabs/PanelTabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PanelTabs.js","sources":["../../../../src/Canvas/PanelTabs/PanelTabs.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Tabs, TabsProps } from \"@mui/base/Tabs\";\nimport { TabsList } from \"@mui/base/TabsList\";\nimport {\n  ExtractNames,\n  useDefaultProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { staticClasses, useClasses } from \"./PanelTabs.styles\";\n\nexport { staticClasses as canvasPanelTabsClasses };\n\nexport type HvCanvasPanelTabsClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCanvasPanelTabsProps extends TabsProps {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvCanvasPanelTabsClasses;\n}\n\n/**\n * A tabs component to use in a canvas context.\n */\nexport const HvCanvasPanelTabs = forwardRef<\n  HTMLDivElement,\n  HvCanvasPanelTabsProps\n>((props, ref) => {\n  const {\n    selectionFollowsFocus = true,\n    children,\n    className,\n    classes: classesProp,\n    ...others\n  } = useDefaultProps(\"HvCanvasPanelTabs\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <Tabs\n      ref={ref}\n      className={cx(classes.root, className)}\n      selectionFollowsFocus={selectionFollowsFocus}\n      {...others}\n    >\n      <TabsList className={classes.list}>{children}</TabsList>\n    </Tabs>\n  );\n});\n"],"names":[],"mappings":";;;;;;;AAsBO,MAAM,oBAAoB,WAG/B,CAAC,OAAO,QAAQ;AACV,QAAA;AAAA,IACJ,wBAAwB;AAAA,IACxB;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,GAAG;AAAA,EAAA,IACD,gBAAgB,qBAAqB,KAAK;AAE9C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,MACrC;AAAA,MACC,GAAG;AAAA,MAEJ,UAAC,oBAAA,UAAA,EAAS,WAAW,QAAQ,MAAO,UAAS;AAAA,IAAA;AAAA,EAAA;AAGnD,CAAC;"}

package/dist/esm/Canvas/PanelTabs/PanelTabs.styles.js

@@ -0,0 +1,16 @@
+import { createClasses } from "@hitachivantara/uikit-react-core";
+const { staticClasses, useClasses } = createClasses(
+  "HvCanvasPanelTabs",
+  {
+    root: {},
+    list: {
+      display: "flex",
+      width: "100%",
+      height: 48
+    }
+  }
+);
+export {
+  staticClasses,
+  useClasses
+};

package/dist/esm/Canvas/PanelTabs/PanelTabs.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PanelTabs.styles.js","sources":["../../../../src/Canvas/PanelTabs/PanelTabs.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvCanvasPanelTabs\",\n  {\n    root: {},\n    list: {\n      display: \"flex\",\n      width: \"100%\",\n      height: 48,\n    },\n  },\n);\n"],"names":[],"mappings":";AAEa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM,CAAC;AAAA,IACP,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,OAAO;AAAA,MACP,QAAQ;AAAA,IACV;AAAA,EACF;AACF;"}

package/dist/esm/Canvas/SidePanel/SidePanel.js

@@ -4,8 +4,8 @@ import { useDefaultProps, useUniqueId, useLabels, useControlled, HvPanel } from
 import { Start, End } from "@hitachivantara/uikit-react-icons";
 import { useClasses } from "./SidePanel.styles.js";
 import { staticClasses } from "./SidePanel.styles.js";
-import { HvCanvasTabs } from "../Tabs/Tabs.js";
-import { HvCanvasTab } from "../Tab/Tab.js";
+import { HvCanvasPanelTabs } from "../PanelTabs/PanelTabs.js";
+import { HvCanvasPanelTab } from "../PanelTab/PanelTab.js";
 const DEFAULT_LABELS = {
   open: "Open",
   close: "Close"
@@ -54,13 +54,13 @@ const HvCanvasSidePanel = forwardRef((props, ref) => {
         ...others,
         children: [
           tabs && /* @__PURE__ */ jsx(
-            HvCanvasTabs,
+            HvCanvasPanelTabs,
             {
               className: classes.tabs,
               value: selectedTab,
               onChange: handleTabChange,
               children: tabs.map((tab) => /* @__PURE__ */ jsx(
-                HvCanvasTab,
+                HvCanvasPanelTab,
                 {
                   id: `${id}-${tab.id}`,
                   value: tab.id,

package/dist/esm/Canvas/SidePanel/SidePanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidePanel.js","sources":["../../../../src/Canvas/SidePanel/SidePanel.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport {\n  ExtractNames,\n  HvBaseProps,\n  HvPanel,\n  useControlled,\n  useDefaultProps,\n  useLabels,\n  useUniqueId,\n} from \"@hitachivantara/uikit-react-core\";\nimport { End, Start } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvCanvasTab } from \"../Tab\";\nimport { HvCanvasTabs, HvCanvasTabsProps } from \"../Tabs\";\nimport { staticClasses, useClasses } from \"./SidePanel.styles\";\n\nexport { staticClasses as canvasSidePanelClasses };\n\nexport type HvCanvasSidePanelClasses = ExtractNames<typeof useClasses>;\n\nconst DEFAULT_LABELS = {\n  open: \"Open\",\n  close: \"Close\",\n};\n\nexport interface HvCanvasSidePanelProps extends HvBaseProps<HTMLDivElement> {\n  /** When controlled, defines id the panel is open or not. */\n  open?: boolean;\n  /** When uncontrolled, defines the initial state of the panel. */\n  defaultOpen?: boolean;\n  /** List of tabs visible on the panel. */\n  tabs?: {\n    id: string | number;\n    content: React.ReactNode;\n  }[];\n  /** Id of the selected tab if it needs to be controlled. */\n  tab?: string | number;\n  /** Callback triggered whenever the panel toggles. */\n  onToggle?: (\n    event: React.MouseEvent | React.KeyboardEvent,\n    open: boolean,\n  ) => void;\n  /** Callback triggered when a tab changes/is clicked. */\n  onTabChange?: (\n    event: React.SyntheticEvent | null,\n    tabId: string | number | null,\n  ) => void;\n  /** An object containing all the labels. */\n  labels?: Partial<typeof DEFAULT_LABELS>;\n  /** The content that will be rendered within the canvas panel. */\n  children?: React.ReactNode;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvCanvasSidePanelClasses;\n}\n\n/**\n * A side panel component to use in a canvas context.\n */\nexport const HvCanvasSidePanel = forwardRef<\n  HTMLDivElement,\n  HvCanvasSidePanelProps\n>((props, ref) => {\n  const {\n    id: idProp,\n    tab: tabProp,\n    open: openProp,\n    defaultOpen = false,\n    tabs,\n    onToggle,\n    onTabChange,\n    labels: labelsProp,\n    className,\n    children,\n    classes: classesProp,\n    ...others\n  } = useDefaultProps(\"HvCanvasSidePanel\", props);\n\n  const id = useUniqueId(idProp);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n  const [open, setOpen] = useControlled(openProp, Boolean(defaultOpen));\n  const [selectedTab, setSelectedTab] = useControlled<string | number | null>(\n    tabProp,\n    tabs?.[0]?.id ?? \"none\",\n  );\n\n  const handleTogglePanel = (event: React.MouseEvent | React.KeyboardEvent) => {\n    setOpen((prev) => !prev);\n    onToggle?.(event, !open);\n  };\n\n  const handleTabChange: HvCanvasTabsProps[\"onChange\"] = (event, tabId) => {\n    setSelectedTab(tabId);\n    onTabChange?.(event, tabId);\n  };\n\n  return (\n    <>\n      <div\n        ref={ref}\n        id={id}\n        className={cx(classes.root, className, {\n          [classes.open]: open,\n          [classes.close]: !open,\n        })}\n        {...others}\n      >\n        {tabs && (\n          <HvCanvasTabs\n            className={classes.tabs}\n            value={selectedTab}\n            onChange={handleTabChange}\n          >\n            {tabs.map((tab) => (\n              <HvCanvasTab\n                key={tab.id}\n                id={`${id}-${tab.id}`}\n                value={tab.id}\n                tabIndex={0}\n              >\n                {tab.content}\n              </HvCanvasTab>\n            ))}\n          </HvCanvasTabs>\n        )}\n        <HvPanel\n          role={tabs ? \"tabpanel\" : undefined}\n          aria-labelledby={tabs ? `${id}-${selectedTab}` : undefined}\n          className={classes.content}\n        >\n          {children}\n        </HvPanel>\n      </div>\n      <div\n        className={cx(classes.handle, {\n          [classes.handleOpen]: open,\n          [classes.handleClose]: !open,\n        })}\n        onClick={handleTogglePanel}\n        role=\"button\"\n        tabIndex={0}\n        onKeyDown={(e) => {\n          if (e.key === \"Enter\" || e.key === \" \") {\n            handleTogglePanel(e);\n          }\n        }}\n        aria-label={open ? labels.close : labels.open}\n      >\n        <div className={classes.handleButton}>\n          {open ? <Start color={[\"primary\"]} /> : <End color={[\"primary\"]} />}\n        </div>\n      </div>\n    </>\n  );\n});\n"],"names":[],"mappings":";;;;;;;;AAoBA,MAAM,iBAAiB;AAAA,EACrB,MAAM;AAAA,EACN,OAAO;AACT;AAmCO,MAAM,oBAAoB,WAG/B,CAAC,OAAO,QAAQ;AACV,QAAA;AAAA,IACJ,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,MAAM;AAAA,IACN,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,GAAG;AAAA,EAAA,IACD,gBAAgB,qBAAqB,KAAK;AAExC,QAAA,KAAK,YAAY,MAAM;AAE7B,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,SAAS,UAAU,gBAAgB,UAAU;AAE7C,QAAA,CAAC,MAAM,OAAO,IAAI,cAAc,UAAU,QAAQ,WAAW,CAAC;AAC9D,QAAA,CAAC,aAAa,cAAc,IAAI;AAAA,IACpC;AAAA,IACA,OAAO,CAAC,GAAG,MAAM;AAAA,EAAA;AAGb,QAAA,oBAAoB,CAAC,UAAkD;AACnE,YAAA,CAAC,SAAS,CAAC,IAAI;AACZ,eAAA,OAAO,CAAC,IAAI;AAAA,EAAA;AAGnB,QAAA,kBAAiD,CAAC,OAAO,UAAU;AACvE,mBAAe,KAAK;AACpB,kBAAc,OAAO,KAAK;AAAA,EAAA;AAG5B,SAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAW,GAAG,QAAQ,MAAM,WAAW;AAAA,UACrC,CAAC,QAAQ,IAAI,GAAG;AAAA,UAChB,CAAC,QAAQ,KAAK,GAAG,CAAC;AAAA,QAAA,CACnB;AAAA,QACA,GAAG;AAAA,QAEH,UAAA;AAAA,UACC,QAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,QAAQ;AAAA,cACnB,OAAO;AAAA,cACP,UAAU;AAAA,cAET,UAAA,KAAK,IAAI,CAAC,QACT;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBAEC,IAAI,GAAG,EAAE,IAAI,IAAI,EAAE;AAAA,kBACnB,OAAO,IAAI;AAAA,kBACX,UAAU;AAAA,kBAET,UAAI,IAAA;AAAA,gBAAA;AAAA,gBALA,IAAI;AAAA,cAAA,CAOZ;AAAA,YAAA;AAAA,UACH;AAAA,UAEF;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAM,OAAO,aAAa;AAAA,cAC1B,mBAAiB,OAAO,GAAG,EAAE,IAAI,WAAW,KAAK;AAAA,cACjD,WAAW,QAAQ;AAAA,cAElB;AAAA,YAAA;AAAA,UACH;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,IACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,GAAG,QAAQ,QAAQ;AAAA,UAC5B,CAAC,QAAQ,UAAU,GAAG;AAAA,UACtB,CAAC,QAAQ,WAAW,GAAG,CAAC;AAAA,QAAA,CACzB;AAAA,QACD,SAAS;AAAA,QACT,MAAK;AAAA,QACL,UAAU;AAAA,QACV,WAAW,CAAC,MAAM;AAChB,cAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,8BAAkB,CAAC;AAAA,UACrB;AAAA,QACF;AAAA,QACA,cAAY,OAAO,OAAO,QAAQ,OAAO;AAAA,QAEzC,8BAAC,OAAI,EAAA,WAAW,QAAQ,cACrB,UAAA,2BAAQ,OAAM,EAAA,OAAO,CAAC,SAAS,GAAG,IAAM,oBAAA,KAAA,EAAI,OAAO,CAAC,SAAS,EAAG,CAAA,GACnE;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ,CAAC;"}
+{"version":3,"file":"SidePanel.js","sources":["../../../../src/Canvas/SidePanel/SidePanel.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport {\n  ExtractNames,\n  HvBaseProps,\n  HvPanel,\n  useControlled,\n  useDefaultProps,\n  useLabels,\n  useUniqueId,\n} from \"@hitachivantara/uikit-react-core\";\nimport { End, Start } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvCanvasPanelTab } from \"../PanelTab\";\nimport { HvCanvasPanelTabs, HvCanvasPanelTabsProps } from \"../PanelTabs\";\nimport { staticClasses, useClasses } from \"./SidePanel.styles\";\n\nexport { staticClasses as canvasSidePanelClasses };\n\nexport type HvCanvasSidePanelClasses = ExtractNames<typeof useClasses>;\n\nconst DEFAULT_LABELS = {\n  open: \"Open\",\n  close: \"Close\",\n};\n\nexport interface HvCanvasSidePanelProps\n  extends HvBaseProps<HTMLDivElement, \"onToggle\"> {\n  /** When controlled, defines id the panel is open or not. */\n  open?: boolean;\n  /** When uncontrolled, defines the initial state of the panel. */\n  defaultOpen?: boolean;\n  /** List of tabs visible on the panel. */\n  tabs?: {\n    id: string | number;\n    content: React.ReactNode;\n  }[];\n  /** Id of the selected tab if it needs to be controlled. */\n  tab?: string | number;\n  /** Callback triggered whenever the panel toggles. */\n  onToggle?: (\n    event: React.MouseEvent | React.KeyboardEvent,\n    open: boolean,\n  ) => void;\n  /** Callback triggered when a tab changes/is clicked. */\n  onTabChange?: (\n    event: React.SyntheticEvent | null,\n    tabId: string | number | null,\n  ) => void;\n  /** An object containing all the labels. */\n  labels?: Partial<typeof DEFAULT_LABELS>;\n  /** The content that will be rendered within the canvas panel. */\n  children?: React.ReactNode;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvCanvasSidePanelClasses;\n}\n\n/**\n * A side panel component to use in a canvas context.\n */\nexport const HvCanvasSidePanel = forwardRef<\n  HTMLDivElement,\n  HvCanvasSidePanelProps\n>((props, ref) => {\n  const {\n    id: idProp,\n    tab: tabProp,\n    open: openProp,\n    defaultOpen = false,\n    tabs,\n    onToggle,\n    onTabChange,\n    labels: labelsProp,\n    className,\n    children,\n    classes: classesProp,\n    ...others\n  } = useDefaultProps(\"HvCanvasSidePanel\", props);\n\n  const id = useUniqueId(idProp);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n  const [open, setOpen] = useControlled(openProp, Boolean(defaultOpen));\n  const [selectedTab, setSelectedTab] = useControlled<string | number | null>(\n    tabProp,\n    tabs?.[0]?.id ?? \"none\",\n  );\n\n  const handleTogglePanel = (event: React.MouseEvent | React.KeyboardEvent) => {\n    setOpen((prev) => !prev);\n    onToggle?.(event, !open);\n  };\n\n  const handleTabChange: HvCanvasPanelTabsProps[\"onChange\"] = (\n    event,\n    tabId,\n  ) => {\n    setSelectedTab(tabId);\n    onTabChange?.(event, tabId);\n  };\n\n  return (\n    <>\n      <div\n        ref={ref}\n        id={id}\n        className={cx(classes.root, className, {\n          [classes.open]: open,\n          [classes.close]: !open,\n        })}\n        {...others}\n      >\n        {tabs && (\n          <HvCanvasPanelTabs\n            className={classes.tabs}\n            value={selectedTab}\n            onChange={handleTabChange}\n          >\n            {tabs.map((tab) => (\n              <HvCanvasPanelTab\n                key={tab.id}\n                id={`${id}-${tab.id}`}\n                value={tab.id}\n                tabIndex={0}\n              >\n                {tab.content}\n              </HvCanvasPanelTab>\n            ))}\n          </HvCanvasPanelTabs>\n        )}\n        <HvPanel\n          role={tabs ? \"tabpanel\" : undefined}\n          aria-labelledby={tabs ? `${id}-${selectedTab}` : undefined}\n          className={classes.content}\n        >\n          {children}\n        </HvPanel>\n      </div>\n      <div\n        className={cx(classes.handle, {\n          [classes.handleOpen]: open,\n          [classes.handleClose]: !open,\n        })}\n        onClick={handleTogglePanel}\n        role=\"button\"\n        tabIndex={0}\n        onKeyDown={(e) => {\n          if (e.key === \"Enter\" || e.key === \" \") {\n            handleTogglePanel(e);\n          }\n        }}\n        aria-label={open ? labels.close : labels.open}\n      >\n        <div className={classes.handleButton}>\n          {open ? <Start color={[\"primary\"]} /> : <End color={[\"primary\"]} />}\n        </div>\n      </div>\n    </>\n  );\n});\n"],"names":[],"mappings":";;;;;;;;AAoBA,MAAM,iBAAiB;AAAA,EACrB,MAAM;AAAA,EACN,OAAO;AACT;AAoCO,MAAM,oBAAoB,WAG/B,CAAC,OAAO,QAAQ;AACV,QAAA;AAAA,IACJ,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,MAAM;AAAA,IACN,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,GAAG;AAAA,EAAA,IACD,gBAAgB,qBAAqB,KAAK;AAExC,QAAA,KAAK,YAAY,MAAM;AAE7B,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,SAAS,UAAU,gBAAgB,UAAU;AAE7C,QAAA,CAAC,MAAM,OAAO,IAAI,cAAc,UAAU,QAAQ,WAAW,CAAC;AAC9D,QAAA,CAAC,aAAa,cAAc,IAAI;AAAA,IACpC;AAAA,IACA,OAAO,CAAC,GAAG,MAAM;AAAA,EAAA;AAGb,QAAA,oBAAoB,CAAC,UAAkD;AACnE,YAAA,CAAC,SAAS,CAAC,IAAI;AACZ,eAAA,OAAO,CAAC,IAAI;AAAA,EAAA;AAGnB,QAAA,kBAAsD,CAC1D,OACA,UACG;AACH,mBAAe,KAAK;AACpB,kBAAc,OAAO,KAAK;AAAA,EAAA;AAG5B,SAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAW,GAAG,QAAQ,MAAM,WAAW;AAAA,UACrC,CAAC,QAAQ,IAAI,GAAG;AAAA,UAChB,CAAC,QAAQ,KAAK,GAAG,CAAC;AAAA,QAAA,CACnB;AAAA,QACA,GAAG;AAAA,QAEH,UAAA;AAAA,UACC,QAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,QAAQ;AAAA,cACnB,OAAO;AAAA,cACP,UAAU;AAAA,cAET,UAAA,KAAK,IAAI,CAAC,QACT;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBAEC,IAAI,GAAG,EAAE,IAAI,IAAI,EAAE;AAAA,kBACnB,OAAO,IAAI;AAAA,kBACX,UAAU;AAAA,kBAET,UAAI,IAAA;AAAA,gBAAA;AAAA,gBALA,IAAI;AAAA,cAAA,CAOZ;AAAA,YAAA;AAAA,UACH;AAAA,UAEF;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAM,OAAO,aAAa;AAAA,cAC1B,mBAAiB,OAAO,GAAG,EAAE,IAAI,WAAW,KAAK;AAAA,cACjD,WAAW,QAAQ;AAAA,cAElB;AAAA,YAAA;AAAA,UACH;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,IACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,GAAG,QAAQ,QAAQ;AAAA,UAC5B,CAAC,QAAQ,UAAU,GAAG;AAAA,UACtB,CAAC,QAAQ,WAAW,GAAG,CAAC;AAAA,QAAA,CACzB;AAAA,QACD,SAAS;AAAA,QACT,MAAK;AAAA,QACL,UAAU;AAAA,QACV,WAAW,CAAC,MAAM;AAChB,cAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,8BAAkB,CAAC;AAAA,UACrB;AAAA,QACF;AAAA,QACA,cAAY,OAAO,OAAO,QAAQ,OAAO;AAAA,QAEzC,8BAAC,OAAI,EAAA,WAAW,QAAQ,cACrB,UAAA,2BAAQ,OAAM,EAAA,OAAO,CAAC,SAAS,GAAG,IAAM,oBAAA,KAAA,EAAI,OAAO,CAAC,SAAS,EAAG,CAAA,GACnE;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ,CAAC;"}

package/dist/esm/index.js

@@ -1,22 +1,22 @@
-import { staticClasses } from "./Canvas/Toolbar/Toolbar.styles.js";
-import { HvCanvasToolbar } from "./Canvas/Toolbar/Toolbar.js";
-import { staticClasses as staticClasses2 } from "./Canvas/SidePanel/SidePanel.styles.js";
-import { HvCanvasSidePanel } from "./Canvas/SidePanel/SidePanel.js";
-import { staticClasses as staticClasses3 } from "./Canvas/Tabs/Tabs.styles.js";
-import { HvCanvasTabs } from "./Canvas/Tabs/Tabs.js";
-import { staticClasses as staticClasses4 } from "./Canvas/BottomPanel/BottomPanel.styles.js";
+import { staticClasses } from "./Canvas/BottomPanel/BottomPanel.styles.js";
 import { HvCanvasBottomPanel } from "./Canvas/BottomPanel/BottomPanel.js";
-import { staticClasses as staticClasses5 } from "./Canvas/Tab/Tab.styles.js";
-import { HvCanvasTab } from "./Canvas/Tab/Tab.js";
+import { staticClasses as staticClasses2 } from "./Canvas/PanelTab/PanelTab.styles.js";
+import { HvCanvasPanelTab } from "./Canvas/PanelTab/PanelTab.js";
+import { staticClasses as staticClasses3 } from "./Canvas/PanelTabs/PanelTabs.styles.js";
+import { HvCanvasPanelTabs } from "./Canvas/PanelTabs/PanelTabs.js";
+import { staticClasses as staticClasses4 } from "./Canvas/SidePanel/SidePanel.styles.js";
+import { HvCanvasSidePanel } from "./Canvas/SidePanel/SidePanel.js";
+import { staticClasses as staticClasses5 } from "./Canvas/Toolbar/Toolbar.styles.js";
+import { HvCanvasToolbar } from "./Canvas/Toolbar/Toolbar.js";
 export {
   HvCanvasBottomPanel,
+  HvCanvasPanelTab,
+  HvCanvasPanelTabs,
   HvCanvasSidePanel,
-  HvCanvasTab,
-  HvCanvasTabs,
   HvCanvasToolbar,
-  staticClasses4 as canvasBottomPanelClasses,
-  staticClasses2 as canvasSidePanelClasses,
-  staticClasses5 as canvasTabClasses,
-  staticClasses3 as canvasTabsClasses,
-  staticClasses as canvasToolbarClasses
+  staticClasses as canvasBottomPanelClasses,
+  staticClasses2 as canvasPanelTabClasses,
+  staticClasses3 as canvasPanelTabsClasses,
+  staticClasses4 as canvasSidePanelClasses,
+  staticClasses5 as canvasToolbarClasses
 };

package/dist/types/index.d.ts

@@ -23,6 +23,15 @@ export declare const canvasBottomPanelClasses: {
     rightActions: "HvCanvasBottomPanel-rightActions";
 };
 
+export declare const canvasPanelTabClasses: {
+    root: "HvCanvasPanelTab-root";
+};
+
+export declare const canvasPanelTabsClasses: {
+    root: "HvCanvasPanelTabs-root";
+    list: "HvCanvasPanelTabs-list";
+};
+
 export declare const canvasSidePanelClasses: {
     content: "HvCanvasSidePanel-content";
     root: "HvCanvasSidePanel-root";
@@ -35,15 +44,6 @@ export declare const canvasSidePanelClasses: {
     handleClose: "HvCanvasSidePanel-handleClose";
 };
 
-export declare const canvasTabClasses: {
-    root: "HvCanvasTab-root";
-};
-
-export declare const canvasTabsClasses: {
-    root: "HvCanvasTabs-root";
-    list: "HvCanvasTabs-list";
-};
-
 export declare const canvasToolbarClasses: {
     root: "HvCanvasToolbar-root";
     title: "HvCanvasToolbar-title";
@@ -52,12 +52,12 @@ export declare const canvasToolbarClasses: {
 };
 
 declare const DEFAULT_LABELS: {
-    back: string;
+    open: string;
+    close: string;
 };
 
 declare const DEFAULT_LABELS_2: {
-    open: string;
-    close: string;
+    back: string;
 };
 
 /**
@@ -65,7 +65,7 @@ declare const DEFAULT_LABELS_2: {
  */
 export declare const HvCanvasBottomPanel: ForwardRefExoticComponent<HvCanvasBottomPanelProps & RefAttributes<HTMLDivElement>>;
 
-export declare type HvCanvasBottomPanelClasses = ExtractNames<typeof useClasses_4>;
+export declare type HvCanvasBottomPanelClasses = ExtractNames<typeof useClasses>;
 
 export declare interface HvCanvasBottomPanelProps extends HvBaseProps {
     /** Open state of the bottom panel. */
@@ -91,14 +91,38 @@ export declare interface HvCanvasBottomPanelProps extends HvBaseProps {
     classes?: HvCanvasBottomPanelClasses;
 }
 
+/**
+ * The tab component to use inside `HvCanvasPanelTabs`.
+ */
+export declare const HvCanvasPanelTab: ForwardRefExoticComponent<Omit<HvCanvasPanelTabProps, "ref"> & RefAttributes<HTMLButtonElement>>;
+
+export declare type HvCanvasPanelTabClasses = ExtractNames<typeof useClasses_2>;
+
+export declare interface HvCanvasPanelTabProps extends TabProps {
+    /** A Jss Object used to override or extend the styles applied. */
+    classes?: HvCanvasPanelTabClasses;
+}
+
+/**
+ * A tabs component to use in a canvas context.
+ */
+export declare const HvCanvasPanelTabs: ForwardRefExoticComponent<Omit<HvCanvasPanelTabsProps, "ref"> & RefAttributes<HTMLDivElement>>;
+
+export declare type HvCanvasPanelTabsClasses = ExtractNames<typeof useClasses_3>;
+
+export declare interface HvCanvasPanelTabsProps extends TabsProps {
+    /** A Jss Object used to override or extend the styles applied. */
+    classes?: HvCanvasPanelTabsClasses;
+}
+
 /**
  * A side panel component to use in a canvas context.
  */
 export declare const HvCanvasSidePanel: ForwardRefExoticComponent<HvCanvasSidePanelProps & RefAttributes<HTMLDivElement>>;
 
-export declare type HvCanvasSidePanelClasses = ExtractNames<typeof useClasses_2>;
+export declare type HvCanvasSidePanelClasses = ExtractNames<typeof useClasses_4>;
 
-export declare interface HvCanvasSidePanelProps extends HvBaseProps<HTMLDivElement> {
+export declare interface HvCanvasSidePanelProps extends HvBaseProps<HTMLDivElement, "onToggle"> {
     /** When controlled, defines id the panel is open or not. */
     open?: boolean;
     /** When uncontrolled, defines the initial state of the panel. */
@@ -115,43 +139,19 @@ export declare interface HvCanvasSidePanelProps extends HvBaseProps<HTMLDivEleme
     /** Callback triggered when a tab changes/is clicked. */
     onTabChange?: (event: React.SyntheticEvent | null, tabId: string | number | null) => void;
     /** An object containing all the labels. */
-    labels?: Partial<typeof DEFAULT_LABELS_2>;
+    labels?: Partial<typeof DEFAULT_LABELS>;
     /** The content that will be rendered within the canvas panel. */
     children?: React.ReactNode;
     /** A Jss Object used to override or extend the styles applied. */
     classes?: HvCanvasSidePanelClasses;
 }
 
-/**
- * The tab component to use inside `HvCanvasTabs`.
- */
-export declare const HvCanvasTab: ForwardRefExoticComponent<Omit<HvCanvasTabProps, "ref"> & RefAttributes<HTMLButtonElement>>;
-
-export declare type HvCanvasTabClasses = ExtractNames<typeof useClasses_5>;
-
-export declare interface HvCanvasTabProps extends TabProps {
-    /** A Jss Object used to override or extend the styles applied. */
-    classes?: HvCanvasTabClasses;
-}
-
-/**
- * A tabs component to use in a canvas context.
- */
-export declare const HvCanvasTabs: ForwardRefExoticComponent<Omit<HvCanvasTabsProps, "ref"> & RefAttributes<HTMLDivElement>>;
-
-export declare type HvCanvasTabsClasses = ExtractNames<typeof useClasses_3>;
-
-export declare interface HvCanvasTabsProps extends TabsProps {
-    /** A Jss Object used to override or extend the styles applied. */
-    classes?: HvCanvasTabsClasses;
-}
-
 /**
  * A toolbar component to use in a canvas context.
  */
 export declare const HvCanvasToolbar: ForwardRefExoticComponent<HvCanvasToolbarProps & RefAttributes<HTMLDivElement>>;
 
-export declare type HvCanvasToolbarClasses = ExtractNames<typeof useClasses>;
+export declare type HvCanvasToolbarClasses = ExtractNames<typeof useClasses_5>;
 
 export declare interface HvCanvasToolbarProps extends HvBaseProps<HTMLDivElement, "title"> {
     /** Text to display in the component. */
@@ -159,7 +159,7 @@ export declare interface HvCanvasToolbarProps extends HvBaseProps<HTMLDivElement
     /** Fully customized button or false for when the back button should not be rendered. */
     backButton?: React.ReactNode;
     /** An object containing all the labels. */
-    labels?: Partial<typeof DEFAULT_LABELS>;
+    labels?: Partial<typeof DEFAULT_LABELS_2>;
     children?: React.ReactNode;
     /** Props for the default back button. */
     backButtonProps?: Partial<HvIconButtonProps>;
@@ -167,12 +167,19 @@ export declare interface HvCanvasToolbarProps extends HvBaseProps<HTMLDivElement
     classes?: HvCanvasToolbarClasses;
 }
 
-declare const useClasses: (classesProp?: Partial<Record<"root" | "title" | "actions" | "back", string>>, addStatic?: boolean) => {
+declare const useClasses: (classesProp?: Partial<Record<"content" | "root" | "tab" | "closed" | "minimized" | "multipleTabs" | "overflowing" | "tabTitle" | "tabsRoot" | "leftActions" | "rightActions", string>>, addStatic?: boolean) => {
     classes: {
+        content: string;
         root: string;
-        title: string;
-        actions: string;
-        back: string;
+        tab: string;
+        closed: string;
+        minimized: string;
+        multipleTabs: string;
+        overflowing: string;
+        tabTitle: string;
+        tabsRoot: string;
+        leftActions: string;
+        rightActions: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -181,17 +188,9 @@ declare const useClasses: (classesProp?: Partial<Record<"root" | "title" | "acti
     cx: (...args: any) => string;
 };
 
-declare const useClasses_2: (classesProp?: Partial<Record<"content" | "root" | "open" | "close" | "handle" | "tabs" | "handleButton" | "handleOpen" | "handleClose", string>>, addStatic?: boolean) => {
+declare const useClasses_2: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
     classes: {
-        content: string;
         root: string;
-        open: string;
-        close: string;
-        handle: string;
-        tabs: string;
-        handleButton: string;
-        handleOpen: string;
-        handleClose: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -212,19 +211,17 @@ declare const useClasses_3: (classesProp?: Partial<Record<"root" | "list", strin
     cx: (...args: any) => string;
 };
 
-declare const useClasses_4: (classesProp?: Partial<Record<"content" | "root" | "tab" | "closed" | "minimized" | "multipleTabs" | "overflowing" | "tabTitle" | "tabsRoot" | "leftActions" | "rightActions", string>>, addStatic?: boolean) => {
+declare const useClasses_4: (classesProp?: Partial<Record<"content" | "root" | "open" | "close" | "handle" | "tabs" | "handleButton" | "handleOpen" | "handleClose", string>>, addStatic?: boolean) => {
     classes: {
         content: string;
         root: string;
-        tab: string;
-        closed: string;
-        minimized: string;
-        multipleTabs: string;
-        overflowing: string;
-        tabTitle: string;
-        tabsRoot: string;
-        leftActions: string;
-        rightActions: string;
+        open: string;
+        close: string;
+        handle: string;
+        tabs: string;
+        handleButton: string;
+        handleOpen: string;
+        handleClose: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
@@ -233,9 +230,12 @@ declare const useClasses_4: (classesProp?: Partial<Record<"content" | "root" | "
     cx: (...args: any) => string;
 };
 
-declare const useClasses_5: (classesProp?: Partial<Record<"root", string>>, addStatic?: boolean) => {
+declare const useClasses_5: (classesProp?: Partial<Record<"root" | "title" | "actions" | "back", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
+        title: string;
+        actions: string;
+        back: string;
     };
     css: {
         (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hitachivantara/uikit-react-pentaho",
-  "version": "0.1.3",
+  "version": "0.2.0",
   "private": false,
   "author": "Hitachi Vantara UI Kit Team",
   "description": "UI Kit Pentaho+ React components.",
@@ -30,8 +30,8 @@
   },
   "dependencies": {
     "@emotion/css": "^11.11.0",
-    "@hitachivantara/uikit-react-core": "^5.66.12",
-    "@hitachivantara/uikit-react-icons": "^5.10.3",
+    "@hitachivantara/uikit-react-core": "^5.66.14",
+    "@hitachivantara/uikit-react-icons": "^5.10.5",
     "@mui/base": "^5.0.0-beta.40",
     "react-resize-detector": "^8.1.0"
   },
@@ -42,7 +42,7 @@
     "access": "public",
     "directory": "package"
   },
-  "gitHead": "0e182f8f81ce3e93aa8c822124ec1b8a4624a48f",
+  "gitHead": "143286b6fdeed50a3265683bebb09dba16ab0395",
   "exports": {
     ".": {
       "require": "./dist/cjs/index.cjs",

package/dist/cjs/Canvas/Tab/Tab.cjs

@@ -1,20 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const react = require("react");
-const Tab = require("@mui/base/Tab");
-const uikitReactCore = require("@hitachivantara/uikit-react-core");
-const Tab_styles = require("./Tab.styles.cjs");
-const HvCanvasTab = react.forwardRef(
-  (props, ref) => {
-    const {
-      classes: classesProp,
-      className,
-      ...others
-    } = uikitReactCore.useDefaultProps("HvCanvasTab", props);
-    const { classes, cx } = Tab_styles.useClasses(classesProp);
-    return /* @__PURE__ */ jsxRuntime.jsx(Tab.Tab, { ref, className: cx(classes.root, className), ...others });
-  }
-);
-exports.canvasTabClasses = Tab_styles.staticClasses;
-exports.HvCanvasTab = HvCanvasTab;

package/dist/cjs/Canvas/Tabs/Tabs.cjs

@@ -1,32 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const react = require("react");
-const Tabs = require("@mui/base/Tabs");
-const TabsList = require("@mui/base/TabsList");
-const uikitReactCore = require("@hitachivantara/uikit-react-core");
-const Tabs_styles = require("./Tabs.styles.cjs");
-const HvCanvasTabs = react.forwardRef(
-  (props, ref) => {
-    const {
-      selectionFollowsFocus = true,
-      children,
-      className,
-      classes: classesProp,
-      ...others
-    } = uikitReactCore.useDefaultProps("HvCanvasTabs", props);
-    const { classes, cx } = Tabs_styles.useClasses(classesProp);
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      Tabs.Tabs,
-      {
-        ref,
-        className: cx(classes.root, className),
-        selectionFollowsFocus,
-        ...others,
-        children: /* @__PURE__ */ jsxRuntime.jsx(TabsList.TabsList, { className: classes.list, children })
-      }
-    );
-  }
-);
-exports.canvasTabsClasses = Tabs_styles.staticClasses;
-exports.HvCanvasTabs = HvCanvasTabs;

package/dist/esm/Canvas/Tab/Tab.js

@@ -1,21 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { Tab } from "@mui/base/Tab";
-import { useDefaultProps } from "@hitachivantara/uikit-react-core";
-import { useClasses } from "./Tab.styles.js";
-import { staticClasses } from "./Tab.styles.js";
-const HvCanvasTab = forwardRef(
-  (props, ref) => {
-    const {
-      classes: classesProp,
-      className,
-      ...others
-    } = useDefaultProps("HvCanvasTab", props);
-    const { classes, cx } = useClasses(classesProp);
-    return /* @__PURE__ */ jsx(Tab, { ref, className: cx(classes.root, className), ...others });
-  }
-);
-export {
-  HvCanvasTab,
-  staticClasses as canvasTabClasses
-};

package/dist/esm/Canvas/Tab/Tab.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tab.js","sources":["../../../../src/Canvas/Tab/Tab.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Tab, TabProps } from \"@mui/base/Tab\";\nimport {\n  ExtractNames,\n  useDefaultProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { staticClasses, useClasses } from \"./Tab.styles\";\n\nexport { staticClasses as canvasTabClasses };\n\nexport type HvCanvasTabClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCanvasTabProps extends TabProps {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvCanvasTabClasses;\n}\n\n/**\n * The tab component to use inside `HvCanvasTabs`.\n */\nexport const HvCanvasTab = forwardRef<HTMLButtonElement, HvCanvasTabProps>(\n  (props, ref) => {\n    const {\n      classes: classesProp,\n      className,\n      ...others\n    } = useDefaultProps(\"HvCanvasTab\", props);\n\n    const { classes, cx } = useClasses(classesProp);\n\n    return (\n      <Tab ref={ref} className={cx(classes.root, className)} {...others} />\n    );\n  },\n);\n"],"names":[],"mappings":";;;;;;AAqBO,MAAM,cAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ,SAAS;AAAA,MACT;AAAA,MACA,GAAG;AAAA,IAAA,IACD,gBAAgB,eAAe,KAAK;AAExC,UAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,WAAA,oBAAC,KAAI,EAAA,KAAU,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,OAAQ,CAAA;AAAA,EAEvE;AACF;"}

package/dist/esm/Canvas/Tab/Tab.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tab.styles.js","sources":["../../../../src/Canvas/Tab/Tab.styles.tsx"],"sourcesContent":["import { tabClasses } from \"@mui/base/Tab\";\nimport {\n  createClasses,\n  outlineStyles,\n  theme,\n} from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvCanvasTab\", {\n  root: {\n    height: \"100%\",\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    flex: 1,\n    borderRadius: \"16px 16px 0 0\",\n    backgroundColor: theme.colors.atmo2,\n    color: theme.colors.secondary_60,\n    overflow: \"hidden\",\n    width: \"100%\",\n    boxShadow: \"0px -2px 8px 0px #4141410F\",\n    paddingInlineEnd: 0,\n    paddingInlineStart: 0,\n    \"& svg .color0\": {\n      fill: \"currentcolor\",\n    },\n    \"&:hover\": {\n      cursor: \"pointer\",\n    },\n    \"&:focus\": {\n      backgroundColor: theme.colors.atmo1,\n    },\n    [`&.${tabClasses.selected}`]: {\n      backgroundColor: theme.colors.atmo1,\n      ...theme.typography.label,\n    },\n    \"&:focus-visible\": {\n      ...outlineStyles,\n    },\n  },\n});\n"],"names":[],"mappings":";;AAOO,MAAM,EAAE,eAAe,eAAe,cAAc,eAAe;AAAA,EACxE,MAAM;AAAA,IACJ,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,MAAM;AAAA,IACN,cAAc;AAAA,IACd,iBAAiB,MAAM,OAAO;AAAA,IAC9B,OAAO,MAAM,OAAO;AAAA,IACpB,UAAU;AAAA,IACV,OAAO;AAAA,IACP,WAAW;AAAA,IACX,kBAAkB;AAAA,IAClB,oBAAoB;AAAA,IACpB,iBAAiB;AAAA,MACf,MAAM;AAAA,IACR;AAAA,IACA,WAAW;AAAA,MACT,QAAQ;AAAA,IACV;AAAA,IACA,WAAW;AAAA,MACT,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,IACA,CAAC,KAAK,WAAW,QAAQ,EAAE,GAAG;AAAA,MAC5B,iBAAiB,MAAM,OAAO;AAAA,MAC9B,GAAG,MAAM,WAAW;AAAA,IACtB;AAAA,IACA,mBAAmB;AAAA,MACjB,GAAG;AAAA,IACL;AAAA,EACF;AACF,CAAC;"}

package/dist/esm/Canvas/Tabs/Tabs.js

@@ -1,33 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { Tabs } from "@mui/base/Tabs";
-import { TabsList } from "@mui/base/TabsList";
-import { useDefaultProps } from "@hitachivantara/uikit-react-core";
-import { useClasses } from "./Tabs.styles.js";
-import { staticClasses } from "./Tabs.styles.js";
-const HvCanvasTabs = forwardRef(
-  (props, ref) => {
-    const {
-      selectionFollowsFocus = true,
-      children,
-      className,
-      classes: classesProp,
-      ...others
-    } = useDefaultProps("HvCanvasTabs", props);
-    const { classes, cx } = useClasses(classesProp);
-    return /* @__PURE__ */ jsx(
-      Tabs,
-      {
-        ref,
-        className: cx(classes.root, className),
-        selectionFollowsFocus,
-        ...others,
-        children: /* @__PURE__ */ jsx(TabsList, { className: classes.list, children })
-      }
-    );
-  }
-);
-export {
-  HvCanvasTabs,
-  staticClasses as canvasTabsClasses
-};

package/dist/esm/Canvas/Tabs/Tabs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tabs.js","sources":["../../../../src/Canvas/Tabs/Tabs.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Tabs, TabsProps } from \"@mui/base/Tabs\";\nimport { TabsList } from \"@mui/base/TabsList\";\nimport {\n  ExtractNames,\n  useDefaultProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { staticClasses, useClasses } from \"./Tabs.styles\";\n\nexport { staticClasses as canvasTabsClasses };\n\nexport type HvCanvasTabsClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCanvasTabsProps extends TabsProps {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvCanvasTabsClasses;\n}\n\n/**\n * A tabs component to use in a canvas context.\n */\nexport const HvCanvasTabs = forwardRef<HTMLDivElement, HvCanvasTabsProps>(\n  (props, ref) => {\n    const {\n      selectionFollowsFocus = true,\n      children,\n      className,\n      classes: classesProp,\n      ...others\n    } = useDefaultProps(\"HvCanvasTabs\", props);\n\n    const { classes, cx } = useClasses(classesProp);\n\n    return (\n      <Tabs\n        ref={ref}\n        className={cx(classes.root, className)}\n        selectionFollowsFocus={selectionFollowsFocus}\n        {...others}\n      >\n        <TabsList className={classes.list}>{children}</TabsList>\n      </Tabs>\n    );\n  },\n);\n"],"names":[],"mappings":";;;;;;;AAsBO,MAAM,eAAe;AAAA,EAC1B,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ,wBAAwB;AAAA,MACxB;AAAA,MACA;AAAA,MACA,SAAS;AAAA,MACT,GAAG;AAAA,IAAA,IACD,gBAAgB,gBAAgB,KAAK;AAEzC,UAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,WAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,QACrC;AAAA,QACC,GAAG;AAAA,QAEJ,UAAC,oBAAA,UAAA,EAAS,WAAW,QAAQ,MAAO,UAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAGnD;AACF;"}

package/dist/esm/Canvas/Tabs/Tabs.styles.js

@@ -1,13 +0,0 @@
-import { createClasses } from "@hitachivantara/uikit-react-core";
-const { staticClasses, useClasses } = createClasses("HvCanvasTabs", {
-  root: {},
-  list: {
-    display: "flex",
-    width: "100%",
-    height: 48
-  }
-});
-export {
-  staticClasses,
-  useClasses
-};

package/dist/esm/Canvas/Tabs/Tabs.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tabs.styles.js","sources":["../../../../src/Canvas/Tabs/Tabs.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvCanvasTabs\", {\n  root: {},\n  list: {\n    display: \"flex\",\n    width: \"100%\",\n    height: 48,\n  },\n});\n"],"names":[],"mappings":";AAEO,MAAM,EAAE,eAAe,eAAe,cAAc,gBAAgB;AAAA,EACzE,MAAM,CAAC;AAAA,EACP,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,QAAQ;AAAA,EACV;AACF,CAAC;"}