@oliasoft-open-source/react-ui-library 4.0.0-beta-13 → 4.0.0-beta-15

package/dist/global.css

@@ -566,7 +566,7 @@ a {
   --zindex-tooltip: 2003;
   --shadow-button: 0 1px 2px rgba(0, 0, 0, 0.1);
   --shadow-layer: 0 1px 2px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.1);
-  --color-text: var(--color-neutral-800);
+  --color-text: var(--color-neutral-900);
   --color-text-muted: var(--color-neutral-550);
   --color-text-faint: var(--color-neutral-300);
   --color-text-error: var(--color-error-650);
@@ -614,7 +614,7 @@ html[data-theme='dark'] {
   --color-text-placeholder: rgba(255, 255, 255, 0.4);
   --color-background: var(--color-neutral-950);
   --color-background-raised: var(--color-neutral-900);
-  --color-background-disabled: rgba(255, 255, 255, 0.1);
+  --color-background-disabled: rgba(255, 255, 255, 0.05);
   --color-background-error: var(--color-error-800);
   --color-background-info: var(--color-info-800);
   --color-background-success: var(--color-success-800);
@@ -623,7 +623,7 @@ html[data-theme='dark'] {
   --color-background-input: var(--color-neutral-850);
   --color-background-listitem-active: var(--color-primary-850);
   --color-background-listitem-hover: var(--color-neutral-850);
-  --color-border: var(--color-neutral-750);
+  --color-border: var(--color-neutral-800);
   --color-border-checkbox: var(--color-neutral-600);
   --color-border-hover: var(--color-neutral-500);
   --color-border-focus: var(--color-primary-500);
@@ -700,6 +700,11 @@ body {
   line-height: 1.4285em;
   font-family: var(--font-family);
   font-size: var(--font-size);
+  font-variant-numeric: tabular-nums;
+}
+
+* {
+  font-variant-numeric: tabular-nums;
 }
 
 .dark {
@@ -8514,121 +8519,121 @@ button:active .remirror-menu-pane-shortcut,
   min-height: 0;
   flex-shrink: 0;
 }
-._inputInTable_1j67l_1 {
+._inputInTable_m7vt5_1 {
   background-color: transparent;
   border-radius: inherit !important;
   height: var(--size);
   min-height: 100%;
 }
-._inputInTable_1j67l_1:not(:hover) {
+._inputInTable_m7vt5_1:not(:hover) {
   border-color: transparent;
 }
-._inputInTable_1j67l_1:not(:focus) {
+._inputInTable_m7vt5_1:not(:focus) {
   box-shadow: none;
 }
-._inputHover_1j67l_13 {
+._inputHover_m7vt5_13 {
   position: relative;
   border-color: var(--color-border-hover);
   z-index: 2;
 }
-._inputFocus_1j67l_18 {
+._inputFocus_m7vt5_18 {
   position: relative;
   outline: none !important;
   border-color: var(--color-border-focus) !important;
   box-shadow: var(--shadow-focus);
   z-index: 3;
 }
-._inputError_1j67l_25,
-._inputWarning_1j67l_26 {
+._inputError_m7vt5_25,
+._inputWarning_m7vt5_26 {
   position: relative;
 }
-._inputError_1j67l_25 {
+._inputError_m7vt5_25 {
   z-index: 2;
   border-color: var(--color-border-error);
   color: var(--color-text-error) !important;
   background-color: var(--color-background-error);
 }
-._inputError_1j67l_25:hover {
+._inputError_m7vt5_25:hover {
   border-color: var(--color-border-error-hover) !important;
 }
-._inputError_1j67l_25:focus {
+._inputError_m7vt5_25:focus {
   position: relative;
   outline: none !important;
   border-color: var(--color-border-focus) !important;
   box-shadow: var(--shadow-focus);
   z-index: 3;
 }
-._inputWarning_1j67l_26 {
+._inputWarning_m7vt5_26 {
   z-index: 1;
   border-color: var(--color-border-warning);
   color: var(--color-text-warning) !important;
   background-color: var(--color-background-warning);
 }
-._inputWarning_1j67l_26:hover {
+._inputWarning_m7vt5_26:hover {
   border-color: var(--color-border-warning-hover) !important;
 }
-._inputWarning_1j67l_26:focus {
+._inputWarning_m7vt5_26:focus {
   position: relative;
   outline: none !important;
   border-color: var(--color-border-focus) !important;
   box-shadow: var(--shadow-focus);
   z-index: 3;
 }
-._inputDisabled_1j67l_61 {
+._inputDisabled_m7vt5_61 {
   pointer-events: none;
   background-color: var(--color-background-disabled);
   color: var(--color-text-muted);
   box-shadow: none;
 }
-._hideScrollbars_1j67l_67 {
+._hideScrollbars_m7vt5_67 {
   /* Firefox */
   scrollbar-width: none;
   /* IE 10+ */
   -ms-overflow-style: none;
   /* Chrome, Safari and Opera */
 }
-._hideScrollbars_1j67l_67::-webkit-scrollbar {
+._hideScrollbars_m7vt5_67::-webkit-scrollbar {
   display: none;
 }
 :root {
-  --color-background-sidebar: var(--color-neutral-950);
+  --color-background-sidebar: var(--color-neutral-1000);
 }
-._sidebar_1j67l_80 {
+._sidebar_m7vt5_80 {
   background-color: var(--color-background-sidebar);
   color: white;
   position: relative;
   padding: var(--padding-y) 0;
 }
 @media print {
-  ._sidebar_1j67l_80 {
+  ._sidebar_m7vt5_80 {
     display: none;
   }
 }
-._inner_1j67l_91 {
+._inner_m7vt5_91 {
   /* Firefox */
   scrollbar-width: none;
   /* IE 10+ */
   -ms-overflow-style: none;
   /* Chrome, Safari and Opera */
 }
-._inner_1j67l_91::-webkit-scrollbar {
+._inner_m7vt5_91::-webkit-scrollbar {
   display: none;
 }
-._title_1j67l_101,
-._subtitle_1j67l_102,
-._label_1j67l_103 {
+._title_m7vt5_101,
+._subtitle_m7vt5_102,
+._label_m7vt5_103 {
   transition: opacity 0.2s, max-height 0.2s, margin 0.2s, color 0.2s;
   max-height: 50px;
 }
-._collapsed_1j67l_107 ._title_1j67l_101,
-._collapsed_1j67l_107 ._subtitle_1j67l_102,
-._collapsed_1j67l_107 ._label_1j67l_103 {
+._collapsed_m7vt5_107 ._title_m7vt5_101,
+._collapsed_m7vt5_107 ._subtitle_m7vt5_102,
+._collapsed_m7vt5_107 ._label_m7vt5_103 {
   opacity: 0;
   max-height: 0;
   margin-bottom: 0;
   margin-top: 0;
 }
-._title_1j67l_101 {
+._title_m7vt5_101 {
   overflow: hidden;
   max-width: 100%;
   text-overflow: ellipsis;
@@ -8637,7 +8642,7 @@ button:active .remirror-menu-pane-shortcut,
   font-size: var(--font-size-lg);
   padding: 0 var(--padding-x);
 }
-._subtitle_1j67l_102 {
+._subtitle_m7vt5_102 {
   margin-bottom: 0.75rem;
   white-space: nowrap;
   font-size: var(--font-size-sm);
@@ -8645,11 +8650,11 @@ button:active .remirror-menu-pane-shortcut,
   opacity: 0.6;
   padding: 0 var(--padding-x);
 }
-._list_1j67l_132 {
+._list_m7vt5_132 {
   margin-bottom: 2rem;
   margin-top: 0;
 }
-._item_1j67l_136 {
+._item_m7vt5_136 {
   min-height: var(--size-lg);
   transition: padding 0.2s;
   font-size: var(--font-size-lg);
@@ -8659,30 +8664,30 @@ button:active .remirror-menu-pane-shortcut,
   padding: 0 var(--padding-x);
   align-items: center;
 }
-._collapsed_1j67l_107 ._item_1j67l_136 {
+._collapsed_m7vt5_107 ._item_m7vt5_136 {
   padding: 0 9px;
 }
-._item_1j67l_136:focus {
+._item_m7vt5_136:focus {
   outline: none;
 }
-._item_1j67l_136::-moz-focus-inner {
+._item_m7vt5_136::-moz-focus-inner {
   border: 0;
 }
-._item_1j67l_136:hover,
-._item_1j67l_136:focus {
+._item_m7vt5_136:hover,
+._item_m7vt5_136:focus {
   color: var(--color-primary-400);
 }
-._item_1j67l_136:active {
+._item_m7vt5_136:active {
   color: var(--color-primary-300);
 }
-._item_1j67l_136._active_1j67l_162 {
+._item_m7vt5_136._active_m7vt5_162 {
   color: white;
   background: black;
 }
-._item_1j67l_136._experimental_1j67l_166 {
+._item_m7vt5_136._experimental_m7vt5_166 {
   background: #40130b;
 }
-._icon_1j67l_169 {
+._icon_m7vt5_169 {
   margin-right: 10px;
   line-height: 0;
   flex-shrink: 0;
@@ -8690,23 +8695,23 @@ button:active .remirror-menu-pane-shortcut,
   opacity: 0.4;
   display: block;
 }
-._item_1j67l_136:hover ._icon_1j67l_169,
-._item_1j67l_136:focus ._icon_1j67l_169 {
+._item_m7vt5_136:hover ._icon_m7vt5_169,
+._item_m7vt5_136:focus ._icon_m7vt5_169 {
   opacity: 0.6;
 }
-._item_1j67l_136:active ._icon_1j67l_169 {
+._item_m7vt5_136:active ._icon_m7vt5_169 {
   opacity: 0.8;
 }
-._item_1j67l_136._active_1j67l_162 ._icon_1j67l_169 {
+._item_m7vt5_136._active_m7vt5_162 ._icon_m7vt5_169 {
   opacity: 1;
 }
-._icon_1j67l_169 > * {
+._icon_m7vt5_169 > * {
   opacity: 1;
 }
-._icon_1j67l_169 > span {
+._icon_m7vt5_169 > span {
   display: block;
 }
-._label_1j67l_103 {
+._label_m7vt5_103 {
   white-space: nowrap;
   overflow: hidden;
 }

package/dist/index.js

@@ -2795,6 +2795,15 @@ function TbItalic(props) {
 function TbKey(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "strokeWidth": "2", "stroke": "currentColor", "fill": "none", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "stroke": "none", "d": "M0 0h24v24H0z", "fill": "none" } }, { "tag": "path", "attr": { "d": "M16.555 3.843l3.602 3.602a2.877 2.877 0 0 1 0 4.069l-2.643 2.643a2.877 2.877 0 0 1 -4.069 0l-.301 -.301l-6.558 6.558a2 2 0 0 1 -1.239 .578l-.175 .008h-1.172a1 1 0 0 1 -.993 -.883l-.007 -.117v-1.172a2 2 0 0 1 .467 -1.284l.119 -.13l.414 -.414h2v-2h2v-2l2.144 -2.144l-.301 -.301a2.877 2.877 0 0 1 0 -4.069l2.643 -2.643a2.877 2.877 0 0 1 4.069 0z" } }, { "tag": "path", "attr": { "d": "M15 9h.01" } }] })(props);
 }
+function TbLayoutColumns(props) {
+  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "strokeWidth": "2", "stroke": "currentColor", "fill": "none", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "stroke": "none", "d": "M0 0h24v24H0z", "fill": "none" } }, { "tag": "path", "attr": { "d": "M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z" } }, { "tag": "path", "attr": { "d": "M12 4l0 16" } }] })(props);
+}
+function TbLayoutGrid(props) {
+  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "strokeWidth": "2", "stroke": "currentColor", "fill": "none", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "stroke": "none", "d": "M0 0h24v24H0z", "fill": "none" } }, { "tag": "path", "attr": { "d": "M4 4m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z" } }, { "tag": "path", "attr": { "d": "M14 4m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z" } }, { "tag": "path", "attr": { "d": "M4 14m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z" } }, { "tag": "path", "attr": { "d": "M14 14m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z" } }] })(props);
+}
+function TbLayoutRows(props) {
+  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "strokeWidth": "2", "stroke": "currentColor", "fill": "none", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "stroke": "none", "d": "M0 0h24v24H0z", "fill": "none" } }, { "tag": "path", "attr": { "d": "M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z" } }, { "tag": "path", "attr": { "d": "M4 12l16 0" } }] })(props);
+}
 function TbLinkOff(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "strokeWidth": "2", "stroke": "currentColor", "fill": "none", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "stroke": "none", "d": "M0 0h24v24H0z", "fill": "none" } }, { "tag": "path", "attr": { "d": "M9 15l3 -3m2 -2l1 -1" } }, { "tag": "path", "attr": { "d": "M11 6l.463 -.536a5 5 0 0 1 7.071 7.072l-.534 .464" } }, { "tag": "path", "attr": { "d": "M3 3l18 18" } }, { "tag": "path", "attr": { "d": "M13 18l-.397 .534a5.068 5.068 0 0 1 -7.127 0a4.972 4.972 0 0 1 0 -7.071l.524 -.463" } }] })(props);
 }
@@ -2900,6 +2909,9 @@ function TbSortAscending(props) {
 function TbSortDescending(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "strokeWidth": "2", "stroke": "currentColor", "fill": "none", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "stroke": "none", "d": "M0 0h24v24H0z", "fill": "none" } }, { "tag": "path", "attr": { "d": "M4 6l9 0" } }, { "tag": "path", "attr": { "d": "M4 12l7 0" } }, { "tag": "path", "attr": { "d": "M4 18l7 0" } }, { "tag": "path", "attr": { "d": "M15 15l3 3l3 -3" } }, { "tag": "path", "attr": { "d": "M18 6l0 12" } }] })(props);
 }
+function TbSquare(props) {
+  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "strokeWidth": "2", "stroke": "currentColor", "fill": "none", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "stroke": "none", "d": "M0 0h24v24H0z", "fill": "none" } }, { "tag": "path", "attr": { "d": "M3 3m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z" } }] })(props);
+}
 function TbStar(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "strokeWidth": "2", "stroke": "currentColor", "fill": "none", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "stroke": "none", "d": "M0 0h24v24H0z", "fill": "none" } }, { "tag": "path", "attr": { "d": "M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z" } }] })(props);
 }
@@ -2927,18 +2939,6 @@ function TbUsers(props) {
 function TbX(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "strokeWidth": "2", "stroke": "currentColor", "fill": "none", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "stroke": "none", "d": "M0 0h24v24H0z", "fill": "none" } }, { "tag": "path", "attr": { "d": "M18 6l-12 12" } }, { "tag": "path", "attr": { "d": "M6 6l12 12" } }] })(props);
 }
-function RiLayoutColumnLine(props) {
-  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M11 5H5V19H11V5ZM13 5V19H19V5H13ZM4 3H20C20.5523 3 21 3.44772 21 4V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3Z" } }] })(props);
-}
-function RiLayoutGridLine(props) {
-  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M21 3C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H21ZM11 13H4V19H11V13ZM20 13H13V19H20V13ZM11 5H4V11H11V5ZM20 5H13V11H20V5Z" } }] })(props);
-}
-function RiLayoutRowLine(props) {
-  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M19 11V5H5V11H19ZM19 13H5V19H19V13ZM4 3H20C20.5523 3 21 3.44772 21 4V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3Z" } }] })(props);
-}
-function RiSquareLine(props) {
-  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M4 3H20C20.5523 3 21 3.44772 21 4V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3ZM5 5V19H19V5H5Z" } }] })(props);
-}
 function AiOutlineMinusSquare(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 1024 1024" }, "child": [{ "tag": "path", "attr": { "d": "M328 544h368c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8z" } }, { "tag": "path", "attr": { "d": "M880 112H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32zm-40 728H184V184h656v656z" } }] })(props);
 }
@@ -3081,16 +3081,16 @@ const NamedIcon = ({ icon: icon2 }) => {
       return /* @__PURE__ */ jsxRuntime.exports.jsx(TbDeviceLaptop, {});
     case "layout columns":
     case "columns":
-      return /* @__PURE__ */ jsxRuntime.exports.jsx(RiLayoutColumnLine, {});
+      return /* @__PURE__ */ jsxRuntime.exports.jsx(TbLayoutColumns, {});
     case "layout grid":
     case "grid":
-      return /* @__PURE__ */ jsxRuntime.exports.jsx(RiLayoutGridLine, {});
+      return /* @__PURE__ */ jsxRuntime.exports.jsx(TbLayoutGrid, {});
     case "layout rows":
     case "rows":
-      return /* @__PURE__ */ jsxRuntime.exports.jsx(RiLayoutRowLine, {});
+      return /* @__PURE__ */ jsxRuntime.exports.jsx(TbLayoutRows, {});
     case "layout single":
     case "square":
-      return /* @__PURE__ */ jsxRuntime.exports.jsx(RiSquareLine, {});
+      return /* @__PURE__ */ jsxRuntime.exports.jsx(TbSquare, {});
     case "link":
       return /* @__PURE__ */ jsxRuntime.exports.jsx(TbLink, {});
     case "list":
@@ -57019,24 +57019,24 @@ var reactFastCompare = function isEqual3(a2, b2) {
     throw error2;
   }
 };
-const inputInTable$3 = "_inputInTable_1j67l_1";
-const inputHover$3 = "_inputHover_1j67l_13";
-const inputFocus$3 = "_inputFocus_1j67l_18";
-const inputError$3 = "_inputError_1j67l_25";
-const inputWarning$3 = "_inputWarning_1j67l_26";
-const inputDisabled$3 = "_inputDisabled_1j67l_61";
-const hideScrollbars$3 = "_hideScrollbars_1j67l_67";
-const sidebar = "_sidebar_1j67l_80";
-const inner = "_inner_1j67l_91";
-const title$2 = "_title_1j67l_101";
-const subtitle = "_subtitle_1j67l_102";
-const label$2 = "_label_1j67l_103";
-const collapsed = "_collapsed_1j67l_107";
-const list = "_list_1j67l_132";
-const item$2 = "_item_1j67l_136";
-const active$2 = "_active_1j67l_162";
-const experimental = "_experimental_1j67l_166";
-const icon$1 = "_icon_1j67l_169";
+const inputInTable$3 = "_inputInTable_m7vt5_1";
+const inputHover$3 = "_inputHover_m7vt5_13";
+const inputFocus$3 = "_inputFocus_m7vt5_18";
+const inputError$3 = "_inputError_m7vt5_25";
+const inputWarning$3 = "_inputWarning_m7vt5_26";
+const inputDisabled$3 = "_inputDisabled_m7vt5_61";
+const hideScrollbars$3 = "_hideScrollbars_m7vt5_67";
+const sidebar = "_sidebar_m7vt5_80";
+const inner = "_inner_m7vt5_91";
+const title$2 = "_title_m7vt5_101";
+const subtitle = "_subtitle_m7vt5_102";
+const label$2 = "_label_m7vt5_103";
+const collapsed = "_collapsed_m7vt5_107";
+const list = "_list_m7vt5_132";
+const item$2 = "_item_m7vt5_136";
+const active$2 = "_active_m7vt5_162";
+const experimental = "_experimental_m7vt5_166";
+const icon$1 = "_icon_m7vt5_169";
 const styles$c = {
   inputInTable: inputInTable$3,
   inputHover: inputHover$3,