@oliasoft-open-source/react-ui-library 4.4.9 → 4.4.10-beta-1

package/dist/assets/{index-neKlYvgy.js → index-j2Tv5Ypq.js}

@@ -18318,8 +18318,10 @@ const Button$1 = ({
   warning: warning2,
   testId,
   tooltip: tooltip2,
-  inverted: inverted2 = false
+  inverted: inverted2 = false,
   // *Deprecated*
+  component: Component2 = "button",
+  url
 }) => {
   const disabledContext = reactExports.useContext(DisabledContext);
   const color2 = (() => {
@@ -18353,7 +18355,7 @@ const Button$1 = ({
     return "";
   })();
   return /* @__PURE__ */ jsxRuntimeExports.jsx(ButtonTooltipWrapper, { tooltip: tooltip2, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    "button",
+    Component2,
     {
       type: type2 === ButtonType.SUBMIT ? ButtonType.SUBMIT : ButtonType.BUTTON,
       className: cx$2(
@@ -18377,6 +18379,7 @@ const Button$1 = ({
       ...title2 ? { title: title2 } : {},
       style: { width: width2 },
       "data-testid": testId,
+      to: url,
       children: [
         icon2 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: buttonStyles.icon, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { icon: icon2 }) }),
         loading && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: buttonStyles.icon, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -18487,7 +18490,8 @@ const Option = ({
   title: title2,
   upload,
   onChange,
-  testId
+  testId,
+  component: Component2 = "a"
 }) => {
   const handleClick2 = (evt) => {
     evt.stopPropagation();
@@ -18503,9 +18507,10 @@ const Option = ({
     onClick == null ? void 0 : onClick(evt);
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    "a",
+    Component2,
     {
       href: url,
+      to: url,
       className: cx$2(
         styles$N.option,
         disabled2 ? styles$N.disabled : "",
@@ -18591,7 +18596,8 @@ const Section = ({
           title: section2.title,
           upload: section2.upload,
           onChange: section2.onChange,
-          testId: section2.testId
+          testId: section2.testId,
+          component: section2.component
         }
       );
     case MenuType.MENU:
@@ -26147,10 +26153,12 @@ reactExports.forwardRef(
   ({ items: items2, expanding, invokeEditOnRowClick, provided, draggable }, listRowRefs) => {
     const disabledContext = reactExports.useContext(DisabledContext);
     const listElement = (index2, provided2, item2, indent, hasOnClick, edit2) => {
+      const Component2 = item2.component || "a";
       return /* @__PURE__ */ reactExports.createElement(
-        "a",
+        Component2,
         {
           href: item2.url,
+          to: item2.url,
           ref: provided2 == null ? void 0 : provided2.innerRef,
           ...provided2.draggableProps,
           style: getItemStyle(provided2.draggableProps, item2),
@@ -56224,10 +56232,12 @@ const Link$1 = ({
 }) => {
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$f.list, children: items2.map((link2, i) => {
     const key2 = `${sectionIndex}_${i}`;
+    const Component2 = link2.component || "a";
     return /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "a",
+      Component2,
       {
         href: link2.value,
+        to: link2.value,
         className: cx$2(
           styles$f.item,
           link2.isActive ? styles$f.active : "",
@@ -56279,7 +56289,6 @@ reactExports.memo(
   }) => {
     const [isOpen2, setIsOpen] = reactExports.useState(startOpen);
     const onClick = (evt, value, label2, clickHandler) => {
-      evt.preventDefault();
       if (typeof clickHandler === "function") {
         evt.currentTarget.value = value;
         evt.currentTarget.label = label2;
@@ -68323,9 +68332,20 @@ const TextLink = ({
   href = void 0,
   target = void 0,
   testId,
-  onClick
+  onClick,
+  component: Component2 = "a"
 }) => {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href, target, onClick, "data-testid": testId, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { link: true, children }) });
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    Component2,
+    {
+      href,
+      to: href,
+      target,
+      onClick,
+      "data-testid": testId,
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { link: true, children })
+    }
+  );
 };
 const inputInTable = "_inputInTable_66zck_1";
 const inputHover = "_inputHover_66zck_13";
@@ -68715,7 +68735,8 @@ const Link = ({
   onClick,
   active: active2,
   disabled: disabled2,
-  testId
+  testId,
+  component: Component2 = "a"
 }) => {
   const disabledContext = reactExports.useContext(DisabledContext);
   const handleClick2 = (event) => {
@@ -68725,10 +68746,11 @@ const Link = ({
     onClick == null ? void 0 : onClick(event);
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    "a",
+    Component2,
     {
       className: cx$2(styles$5.link, active2 ? styles$5.active : ""),
       href: url || "#",
+      to: url,
       onClick: handleClick2,
       "aria-disabled": disabled2 || disabledContext,
       "data-testid": testId,
@@ -68752,7 +68774,8 @@ const Element$1 = ({ element }) => {
           onClick: element.onClick,
           active: element.active,
           disabled: element.disabled,
-          testId: element.testId
+          testId: element.testId,
+          component: element.component
         }
       ) });
     case ElementType.BUTTON:

package/dist/index.d.ts

@@ -41,7 +41,7 @@ export declare enum BreadcrumbLinkType {
     CUSTOM = "custom"
 }
 
-export declare const Button: ({ active, basic, colored, disabled, groupOrder, icon, label, loading, name, pill, round, small, styles, width, title, type, onClick, error, warning, testId, tooltip, inverted, }: IButtonProps) => JSX_2.Element;
+export declare const Button: ({ active, basic, colored, disabled, groupOrder, icon, label, loading, name, pill, round, small, styles, width, title, type, onClick, error, warning, testId, tooltip, inverted, component: Component, url, }: IButtonProps) => JSX_2.Element;
 
 export declare const ButtonGroup: (props: IButtonGroupProps) => JSX_2.Element;
 
@@ -220,6 +220,8 @@ export declare interface IButtonProps {
     testId?: string;
     tooltip?: ReactNode | string;
     inverted?: boolean;
+    component?: React_2.ElementType;
+    url?: string;
 }
 
 export declare interface ICardProps {
@@ -658,6 +660,7 @@ declare interface IListItem {
     id?: TStringOrNumber;
     type?: string;
     metaCount?: number;
+    component?: React.ElementType;
 }
 
 export declare interface IListProps {
@@ -764,6 +767,7 @@ declare interface IMenuSection {
     actions?: any[];
     url?: string;
     upload?: boolean;
+    component?: React.ElementType;
 }
 
 declare interface IMenuShowAllButton {
@@ -925,11 +929,12 @@ declare interface IOptionItem {
     label: ReactNode;
     value: string;
     icon: ReactNode;
-    onClick: (evt: MouseEvent_2<HTMLAnchorElement, globalThis.MouseEvent>) => void;
+    onClick?: (evt: MouseEvent_2<HTMLAnchorElement, globalThis.MouseEvent>) => void;
     isActive?: boolean;
     isExperimental?: boolean;
     invalid?: boolean;
     testId?: string;
+    component?: React_2.ElementType;
 }
 
 declare interface IOptionSection {
@@ -1370,6 +1375,7 @@ export declare interface ITextLinkProps {
     testId?: string;
     onClick?: (e: React_2.MouseEvent<HTMLAnchorElement, MouseEvent>) => void;
     children?: React_2.ReactNode;
+    component?: React_2.ElementType;
 }
 
 export declare interface ITextProps {
@@ -1660,7 +1666,7 @@ export { Text_2 as Text }
 
 export declare const TextArea: ({ name, value, placeholder, cols, rows, disabled, onChange, onKeyPress, onFocus, onBlur, tabIndex, error, warning, tooltip, maxTooltipWidth, resize, monospace, testId, }: ITextAreaProps) => JSX_2.Element;
 
-export declare const TextLink: ({ children, href, target, testId, onClick, }: ITextLinkProps) => JSX_2.Element;
+export declare const TextLink: ({ children, href, target, testId, onClick, component: Component, }: ITextLinkProps) => JSX_2.Element;
 
 declare type TFileReaderMethod = TInputReaderMethods | string;
 
@@ -1686,6 +1692,7 @@ declare type TLinkElement = TBaseElementProps & {
     url?: string;
     active?: boolean;
     disabled?: boolean;
+    component?: React.ElementType;
 };
 
 export declare type TMenuCarat = 'false' | 'right' | 'down';

package/dist/index.html

@@ -1 +1 @@
-<!doctype html><head><title>React UI Library</title><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1" user-scalable="no"><meta name="apple-mobile-web-app-capable" content="yes"><script type="module" crossorigin src="/react-ui-library/assets/index-neKlYvgy.js"></script><link rel="stylesheet" crossorigin href="/react-ui-library/assets/index-AkeNwthw.css"></head><body><div id="content"></div></body>
+<!doctype html><head><title>React UI Library</title><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1" user-scalable="no"><meta name="apple-mobile-web-app-capable" content="yes"><script type="module" crossorigin src="/react-ui-library/assets/index-j2Tv5Ypq.js"></script><link rel="stylesheet" crossorigin href="/react-ui-library/assets/index-AkeNwthw.css"></head><body><div id="content"></div></body>

package/dist/index.js

@@ -4133,8 +4133,10 @@ const Button$1 = ({
   warning: warning2,
   testId,
   tooltip: tooltip2,
-  inverted: inverted2 = false
+  inverted: inverted2 = false,
   // *Deprecated*
+  component: Component2 = "button",
+  url
 }) => {
   const disabledContext = useContext(DisabledContext);
   const color2 = (() => {
@@ -4168,7 +4170,7 @@ const Button$1 = ({
     return "";
   })();
   return /* @__PURE__ */ jsx(ButtonTooltipWrapper, { tooltip: tooltip2, children: /* @__PURE__ */ jsxs(
-    "button",
+    Component2,
     {
       type: type === ButtonType.SUBMIT ? ButtonType.SUBMIT : ButtonType.BUTTON,
       className: cx$2(
@@ -4192,6 +4194,7 @@ const Button$1 = ({
       ...title2 ? { title: title2 } : {},
       style: { width: width2 },
       "data-testid": testId,
+      to: url,
       children: [
         icon2 && /* @__PURE__ */ jsx("span", { className: buttonStyles.icon, children: /* @__PURE__ */ jsx(Icon, { icon: icon2 }) }),
         loading && /* @__PURE__ */ jsx("span", { className: buttonStyles.icon, children: /* @__PURE__ */ jsx(
@@ -4302,7 +4305,8 @@ const Option$2 = ({
   title: title2,
   upload,
   onChange,
-  testId
+  testId,
+  component: Component2 = "a"
 }) => {
   const handleClick2 = (evt) => {
     evt.stopPropagation();
@@ -4318,9 +4322,10 @@ const Option$2 = ({
     onClick == null ? void 0 : onClick(evt);
   };
   return /* @__PURE__ */ jsxs(
-    "a",
+    Component2,
     {
       href: url,
+      to: url,
       className: cx$2(
         styles$L.option,
         disabled2 ? styles$L.disabled : "",
@@ -4406,7 +4411,8 @@ const Section$1 = ({
           title: section2.title,
           upload: section2.upload,
           onChange: section2.onChange,
-          testId: section2.testId
+          testId: section2.testId,
+          component: section2.component
         }
       );
     case MenuType.MENU:
@@ -18990,10 +18996,12 @@ const ListRow = forwardRef(
   ({ items, expanding, invokeEditOnRowClick, provided, draggable: draggable2 }, listRowRefs) => {
     const disabledContext = useContext(DisabledContext);
     const listElement = (index2, provided2, item2, indent, hasOnClick, edit2) => {
+      const Component2 = item2.component || "a";
       return /* @__PURE__ */ createElement(
-        "a",
+        Component2,
         {
           href: item2.url,
+          to: item2.url,
           ref: provided2 == null ? void 0 : provided2.innerRef,
           ...provided2.draggableProps,
           style: getItemStyle(provided2.draggableProps, item2),
@@ -52730,10 +52738,12 @@ const Link$1 = ({
 }) => {
   return /* @__PURE__ */ jsx("div", { className: styles$d.list, children: items.map((link2, i) => {
     const key2 = `${sectionIndex}_${i}`;
+    const Component2 = link2.component || "a";
     return /* @__PURE__ */ jsx(
-      "a",
+      Component2,
       {
         href: link2.value,
+        to: link2.value,
         className: cx$2(
           styles$d.item,
           link2.isActive ? styles$d.active : "",
@@ -52785,7 +52795,6 @@ const SideBar = memo(
   }) => {
     const [isOpen2, setIsOpen] = useState(startOpen);
     const onClick = (evt, value, label2, clickHandler) => {
-      evt.preventDefault();
       if (typeof clickHandler === "function") {
         evt.currentTarget.value = value;
         evt.currentTarget.label = label2;
@@ -56728,9 +56737,20 @@ const TextLink = ({
   href = void 0,
   target = void 0,
   testId,
-  onClick
+  onClick,
+  component: Component2 = "a"
 }) => {
-  return /* @__PURE__ */ jsx("a", { href, target, onClick, "data-testid": testId, children: /* @__PURE__ */ jsx(Text, { link: true, children }) });
+  return /* @__PURE__ */ jsx(
+    Component2,
+    {
+      href,
+      to: href,
+      target,
+      onClick,
+      "data-testid": testId,
+      children: /* @__PURE__ */ jsx(Text, { link: true, children })
+    }
+  );
 };
 const inputInTable = "_inputInTable_66zck_1";
 const inputHover = "_inputHover_66zck_13";
@@ -58069,7 +58089,8 @@ const Link = ({
   onClick,
   active: active2,
   disabled: disabled2,
-  testId
+  testId,
+  component: Component2 = "a"
 }) => {
   const disabledContext = useContext(DisabledContext);
   const handleClick2 = (event) => {
@@ -58079,10 +58100,11 @@ const Link = ({
     onClick == null ? void 0 : onClick(event);
   };
   return /* @__PURE__ */ jsxs(
-    "a",
+    Component2,
     {
       className: cx$2(styles$3.link, active2 ? styles$3.active : ""),
       href: url || "#",
+      to: url,
       onClick: handleClick2,
       "aria-disabled": disabled2 || disabledContext,
       "data-testid": testId,
@@ -58106,7 +58128,8 @@ const Element$1 = ({ element }) => {
           onClick: element.onClick,
           active: element.active,
           disabled: element.disabled,
-          testId: element.testId
+          testId: element.testId,
+          component: element.component
         }
       ) });
     case ElementType.BUTTON: