@rolster/react-components 18.21.35 → 18.21.37

package/dist/esm/components/atoms/Amount/Amount.css

@@ -1,12 +1,26 @@
 .rls-amount {
   --pvt-font-size: var(--rlc-amount-font-size, inherit);
-  --rlc-tabulartext-font-size: var(--pvt-font-size);
+  --rlc-tabular-text-font-size: var(--pvt-font-size);
   display: flex;
   width: var(--rlc-amount-width, auto);
-  justify-content: var(--rlc-amount-text-align, start);
+  justify-content: var(--rlc-amount-text-align, flex-start);
   column-gap: var(--rls-sizing-x2);
   font-size: var(--pvt-font-size);
 }
 .rls-amount[rls-theme] {
   color: var(--rls-theme-color-500);
+}
+.rls-amount__symbol {
+  display: block;
+  line-height: calc(var(--pvt-font-size) + 1rem);
+  height: calc(var(--pvt-font-size) + 1rem);
+}
+.rls-amount__content {
+  display: flex;
+  justify-content: var(--rlc-amount-text-align, flex-start);
+}
+.rls-amount__decimal {
+  --rlc-tabular-text-char-width: calc(var(--pvt-font-size) * 0.55);
+  --rlc-tabular-text-font-size: calc(var(--pvt-font-size) * 0.75);
+  align-items: flex-end;
 } /*# sourceMappingURL=Amount.css.map */

package/dist/esm/components/atoms/Amount/Amount.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../../src/components/atoms/Amount/Amount.scss"],"names":[],"mappings":"AAOA,YACE,sDACA,kDAEA,aACA,oCACA,oDACA,gCACA,+BAEA,uBACE","file":"Amount.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../../src/components/atoms/Amount/Amount.scss"],"names":[],"mappings":"AAOA,YACE,sDACA,mDAEA,aACA,oCACA,yDACA,gCACA,+BAEA,uBACE,iCAGF,oBACE,cACA,8CACA,yCAGF,qBACE,aACA,yDAGF,qBACE,iEACA,gEAEA","file":"Amount.css"}

package/dist/esm/components/atoms/Amount/Amount.js

@@ -4,7 +4,17 @@ import { useMemo } from 'react';
 import { RlsTabularText } from '../TabularText/TabularText';
 import './Amount.css';
 export function RlsAmount({ value, decimals, rlsTheme, symbol }) {
-    const amount = useMemo(() => currencyFormat({ value, decimals }), [value, decimals]);
-    return (_jsxs("div", { className: "rls-amount", "rls-theme": rlsTheme, children: [symbol && _jsx("span", { children: symbol }), _jsx(RlsTabularText, { value: amount })] }));
+    const { decimal, integer } = useMemo(() => {
+        const currency = currencyFormat({ value, decimals });
+        if (!currency.includes(',')) {
+            return { integer: currency, decimal: '' };
+        }
+        const currencySplit = currency.split(',');
+        return {
+            integer: currencySplit[0] + (currencySplit[1] ? ',' : ''),
+            decimal: currencySplit[1] || ''
+        };
+    }, [value, decimals]);
+    return (_jsxs("div", { className: "rls-amount", "rls-theme": rlsTheme, children: [symbol && _jsx("span", { className: "rls-amount__symbol", children: symbol }), _jsxs("div", { className: "rls-amount__content", children: [_jsx(RlsTabularText, { className: "rls-amount__integer", value: integer }), decimal && (_jsx(RlsTabularText, { className: "rls-amount__decimal", value: decimal }))] })] }));
 }
 //# sourceMappingURL=Amount.js.map

package/dist/esm/components/atoms/Amount/Amount.js.map

@@ -1 +1 @@
-{"version":3,"file":"Amount.js","sourceRoot":"","sources":["../../../../../src/components/atoms/Amount/Amount.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAC5D,OAAO,cAAc,CAAC;AAStB,MAAM,UAAU,SAAS,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAe;IAC1E,MAAM,MAAM,GAAG,OAAO,CACpB,GAAG,EAAE,CAAC,cAAc,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,EACzC,CAAC,KAAK,EAAE,QAAQ,CAAC,CAClB,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,YAAY,eAAY,QAAQ,aAC5C,MAAM,IAAI,yBAAO,MAAM,GAAQ,EAChC,KAAC,cAAc,IAAC,KAAK,EAAE,MAAM,GAAI,IAC7B,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"Amount.js","sourceRoot":"","sources":["../../../../../src/components/atoms/Amount/Amount.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAC5D,OAAO,cAAc,CAAC;AAStB,MAAM,UAAU,SAAS,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAe;IAC1E,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE;QACxC,MAAM,QAAQ,GAAG,cAAc,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC;QAErD,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YAC5B,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC;QAC5C,CAAC;QAED,MAAM,aAAa,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAE1C,OAAO;YACL,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;YACzD,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC,IAAI,EAAE;SAChC,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEtB,OAAO,CACL,eAAK,SAAS,EAAC,YAAY,eAAY,QAAQ,aAC5C,MAAM,IAAI,eAAM,SAAS,EAAC,oBAAoB,YAAE,MAAM,GAAQ,EAE/D,eAAK,SAAS,EAAC,qBAAqB,aAClC,KAAC,cAAc,IAAC,SAAS,EAAC,qBAAqB,EAAC,KAAK,EAAE,OAAO,GAAI,EAEjE,OAAO,IAAI,CACV,KAAC,cAAc,IAAC,SAAS,EAAC,qBAAqB,EAAC,KAAK,EAAE,OAAO,GAAI,CACnE,IACG,IACF,CACP,CAAC;AACJ,CAAC"}

package/dist/esm/components/atoms/Input/Input.css

@@ -53,11 +53,13 @@
 }
 .rls-input__value {
   position: absolute;
+  display: flex;
   top: 0rem;
   left: 0rem;
   width: 100%;
   height: var(--pvt-height);
   line-height: var(--pvt-height);
+  align-items: center;
   background: rgba(0, 0, 0, 0);
   pointer-events: none;
   overflow: hidden;

package/dist/esm/components/atoms/Input/Input.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../../src/components/atoms/Input/Input.scss"],"names":[],"mappings":"AAOA,WACE,wEACA,wEAEA,yFAKA,6DACA,oDAEA,8CACA,uBACA,wCAEA,kBACA,WAEA,oBACE,kDACA,oCAGF,qBACE,yBAGF,sBACE,kBACA,WACA,yBACA,8BACA,aACA,YACA,YACA,aACA,yBACA,sCACA,0CACA,+BACA,iCACA,yCAEA,kGAEE,YACA,wBAGF,mCACE,+BAGF,iCACE,sCACA,+BAGF,+BACE,WAIJ,kBACE,kBACA,SACA,UACA,WACA,yBACA,8BACA,yBACA,oBACA,gBACA,mBACA,iCACA,kCACA,0CACA,+BACA,iCACA","file":"Input.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../../src/components/atoms/Input/Input.scss"],"names":[],"mappings":"AAOA,WACE,wEACA,wEAEA,yFAKA,6DACA,oDAEA,8CACA,uBACA,wCAEA,kBACA,WAEA,oBACE,kDACA,oCAGF,qBACE,yBAGF,sBACE,kBACA,WACA,yBACA,8BACA,aACA,YACA,YACA,aACA,yBACA,sCACA,0CACA,+BACA,iCACA,yCAEA,kGAEE,YACA,wBAGF,mCACE,+BAGF,iCACE,sCACA,+BAGF,+BACE,WAIJ,kBACE,kBACA,aACA,SACA,UACA,WACA,yBACA,8BACA,mBACA,yBACA,oBACA,gBACA,mBACA,iCACA,kCACA,0CACA,+BACA,iCACA","file":"Input.css"}

package/dist/esm/components/atoms/InputMoney/InputMoney.css

@@ -1,6 +1,6 @@
 .rls-input-money {
-  --rlc-tabulartext-font-size: var(--rls-input-font-size);
-  --rlc-tabulartext-char-width: 5.25rem;
+  --rlc-tabular-text-font-size: var(--rls-input-font-size);
+  --rlc-tabular-text-char-width: 5.25rem;
   position: relative;
   width: 100%;
   box-sizing: border-box;

package/dist/esm/components/atoms/InputMoney/InputMoney.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../../src/components/atoms/InputMoney/InputMoney.scss"],"names":[],"mappings":"AAOA,iBACE,wDACA,sCAEA,kBACA,WACA","file":"InputMoney.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../../src/components/atoms/InputMoney/InputMoney.scss"],"names":[],"mappings":"AAOA,iBACE,yDACA,uCAEA,kBACA,WACA","file":"InputMoney.css"}

package/dist/esm/components/atoms/TabularText/TabularText.css

@@ -1,18 +1,27 @@
 .rls-tabular-text {
+  --pvt-char-font-size: var(
+    --rlc-tabular-text-font-size,
+    var(--rls-body-font-size)
+  );
+  --pvt-char-height: calc(var(--pvt-char-font-size) + 1rem);
+  --pvt-char-width: var(--rlc-tabular-text-char-width, 5.5rem);
+  --pvt-pointer-width: var(--rlc-tabular-text-pointer-width, 2rem);
   display: flex;
   width: auto;
-  justify-content: var(--rlc-tabulartext-text-align, flex-start);
+  justify-content: var(--rlc-tabular-text-align, flex-start);
 }
 .rls-tabular-text span {
-  font-size: var(--rlc-tabulartext-font-size, var(--rls-body-font-size));
+  font-size: var(--pvt-char-font-size);
+  height: var(--pvt-char-height);
+  line-height: var(--pvt-char-height);
 }
 .rls-tabular-text__char {
   display: block;
+  width: var(--pvt-char-width);
   text-align: center;
-  width: var(--rlc-tabulartext-char-width, 5.5rem);
 }
 .rls-tabular-text__pointer {
   display: block;
+  width: var(--pvt-pointer-width);
   text-align: center;
-  width: var(--rlc-tabulartext-pointer-width, 2rem);
 } /*# sourceMappingURL=TabularText.css.map */

package/dist/esm/components/atoms/TabularText/TabularText.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../../src/components/atoms/TabularText/TabularText.scss"],"names":[],"mappings":"AAOA,kBACE,aACA,WACA,8DAEA,uBACE,sEAGF,wBACE,cACA,kBACA,gDAGF,2BACE,cACA,kBACA","file":"TabularText.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../../src/components/atoms/TabularText/TabularText.scss"],"names":[],"mappings":"AAOA,kBACE,qFAKA,0DACA,6DACA,iEAEA,aACA,WACA,0DAEA,uBACE,oCACA,8BACA,mCAGF,wBACE,cACA,4BACA,kBAGF,2BACE,cACA,+BACA","file":"TabularText.css"}

package/dist/esm/components/atoms/TabularText/TabularText.d.ts

@@ -1,6 +1,7 @@
 import './TabularText.css';
 interface TabularTextProps {
+    className?: string;
     value?: string;
 }
-export declare function RlsTabularText({ value }: TabularTextProps): import("react/jsx-runtime").JSX.Element;
+export declare function RlsTabularText({ className, value }: TabularTextProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/esm/components/atoms/TabularText/TabularText.js

@@ -1,5 +1,6 @@
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { renderClassStatus } from '../../../helpers';
 import './TabularText.css';
 const className = 'rls-tabular-text';
 const pointers = ['.', ','];
@@ -8,11 +9,13 @@ function getCharClass(char) {
         ? `${className}__pointer`
         : `${className}__char`;
 }
-export function RlsTabularText({ value }) {
-    const [codes, setCodes] = useState(_jsx(_Fragment, {}));
-    useEffect(() => {
-        setCodes(_jsx(_Fragment, { children: value?.split('').map((char, index) => (_jsx("span", { className: getCharClass(char), children: char }, index))) }));
+export function RlsTabularText({ className, value }) {
+    const codes = useMemo(() => {
+        return (_jsx(_Fragment, { children: value?.split('').map((char, index) => (_jsx("span", { className: getCharClass(char), children: char }, index))) }));
     }, [value]);
-    return _jsx("div", { className: "rls-tabular-text", children: codes });
+    const _className = useMemo(() => {
+        return renderClassStatus('rls-tabular-text', {}, className);
+    }, [className]);
+    return _jsx("div", { className: _className, children: codes });
 }
 //# sourceMappingURL=TabularText.js.map

package/dist/esm/components/atoms/TabularText/TabularText.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabularText.js","sourceRoot":"","sources":["../../../../../src/components/atoms/TabularText/TabularText.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,mBAAmB,CAAC;AAE3B,MAAM,SAAS,GAAG,kBAAkB,CAAC;AACrC,MAAM,QAAQ,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;AAE5B,SAAS,YAAY,CAAC,IAAY;IAChC,OAAO,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC;QAC5B,CAAC,CAAC,GAAG,SAAS,WAAW;QACzB,CAAC,CAAC,GAAG,SAAS,QAAQ,CAAC;AAC3B,CAAC;AAMD,MAAM,UAAU,cAAc,CAAC,EAAE,KAAK,EAAoB;IACxD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,mBAAK,CAAC,CAAC;IAE1C,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,CACN,4BACG,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CACrC,eAAkB,SAAS,EAAE,YAAY,CAAC,IAAI,CAAC,YAC5C,IAAI,IADI,KAAK,CAET,CACR,CAAC,GACD,CACJ,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,OAAO,cAAK,SAAS,EAAC,kBAAkB,YAAE,KAAK,GAAO,CAAC;AACzD,CAAC"}
+{"version":3,"file":"TabularText.js","sourceRoot":"","sources":["../../../../../src/components/atoms/TabularText/TabularText.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AACrD,OAAO,mBAAmB,CAAC;AAE3B,MAAM,SAAS,GAAG,kBAAkB,CAAC;AACrC,MAAM,QAAQ,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;AAE5B,SAAS,YAAY,CAAC,IAAY;IAChC,OAAO,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC;QAC5B,CAAC,CAAC,GAAG,SAAS,WAAW;QACzB,CAAC,CAAC,GAAG,SAAS,QAAQ,CAAC;AAC3B,CAAC;AAOD,MAAM,UAAU,cAAc,CAAC,EAAE,SAAS,EAAE,KAAK,EAAoB;IACnE,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,EAAE;QACzB,OAAO,CACL,4BACG,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CACrC,eAAkB,SAAS,EAAE,YAAY,CAAC,IAAI,CAAC,YAC5C,IAAI,IADI,KAAK,CAET,CACR,CAAC,GACD,CACJ,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,EAAE;QAC9B,OAAO,iBAAiB,CAAC,kBAAkB,EAAE,EAAE,EAAE,SAAS,CAAC,CAAC;IAC9D,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,OAAO,cAAK,SAAS,EAAE,UAAU,YAAG,KAAK,GAAO,CAAC;AACnD,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rolster/react-components",
-  "version": "18.21.35",
+  "version": "18.21.37",
   "type": "module",
   "description": "Package containing UI components for React Project.",
   "module": "dist/esm/index.js",
@@ -49,7 +49,7 @@
     "@rollup/plugin-node-resolve": "^15.2.1",
     "@rollup/plugin-typescript": "^11.1.3",
     "@rolster/rollup": "^1.0.6",
-    "@rolster/styles-foundations": "^2.5.25",
+    "@rolster/styles-foundations": "^2.5.26",
     "@rolster/types": "^1.1.0",
     "@types/node-sass": "^4.11.4",
     "@types/react": "^18.0.28",