@ceed/ads 0.0.91 → 0.0.93
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/CurrencyInput/CurrencyInput.d.ts +17 -2
- package/dist/index.js +101 -103
- package/framer/index.js +105 -108
- package/package.json +1 -1
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
import { MotionProps } from "framer-motion";
|
|
2
3
|
interface CurrencyInputProps {
|
|
3
4
|
currency?: "usd" | "krw";
|
|
4
|
-
max?: number;
|
|
5
|
+
max?: number | string;
|
|
5
6
|
value?: number;
|
|
6
7
|
onChange?: (event: {
|
|
7
8
|
target: {
|
|
@@ -16,5 +17,19 @@ interface CurrencyInputProps {
|
|
|
16
17
|
error?: boolean;
|
|
17
18
|
helperText?: React.ReactNode;
|
|
18
19
|
}
|
|
19
|
-
declare const CurrencyInput: React.ForwardRefExoticComponent<CurrencyInputProps &
|
|
20
|
+
declare const CurrencyInput: React.ForwardRefExoticComponent<Omit<CurrencyInputProps & {
|
|
21
|
+
component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
|
|
22
|
+
} & Pick<React.InputHTMLAttributes<HTMLInputElement>, "defaultValue" | "autoFocus" | "id" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "onKeyUp" | "onClick" | "disabled" | "type" | "required" | "autoComplete" | "readOnly" | "value" | "name" | "placeholder"> & {
|
|
23
|
+
className?: string | undefined;
|
|
24
|
+
color?: import("@mui/types").OverridableStringUnion<import("@mui/joy").ColorPaletteProp, import("@mui/joy").InputPropsColorOverrides> | undefined;
|
|
25
|
+
endDecorator?: React.ReactNode;
|
|
26
|
+
error?: boolean | undefined;
|
|
27
|
+
fullWidth?: boolean | undefined;
|
|
28
|
+
startDecorator?: React.ReactNode;
|
|
29
|
+
size?: import("@mui/types").OverridableStringUnion<"sm" | "md" | "lg", import("@mui/joy").InputPropsSizeOverrides> | undefined;
|
|
30
|
+
sx?: import("@mui/joy/styles/types").SxProps | undefined;
|
|
31
|
+
variant?: import("@mui/types").OverridableStringUnion<import("@mui/joy").VariantProp, import("@mui/joy").InputPropsVariantOverrides> | undefined;
|
|
32
|
+
} & import("@mui/joy").InputSlotsAndSlotProps & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
33
|
+
ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
|
|
34
|
+
}, "color" | "defaultValue" | "autoFocus" | "className" | "id" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "onKeyUp" | "onClick" | "variant" | "sx" | "disabled" | "size" | "endDecorator" | "startDecorator" | "component" | "type" | "error" | "required" | "autoComplete" | "readOnly" | "value" | "name" | "placeholder" | "fullWidth" | keyof import("@mui/joy").InputSlotsAndSlotProps> & MotionProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
20
35
|
export { CurrencyInput };
|
package/dist/index.js
CHANGED
|
@@ -1182,7 +1182,7 @@ Container.displayName = "Container";
|
|
|
1182
1182
|
// src/components/CurrencyInput/CurrencyInput.tsx
|
|
1183
1183
|
import React14, { useCallback as useCallback3, useState as useState3 } from "react";
|
|
1184
1184
|
import { IntlMessageFormat } from "intl-messageformat";
|
|
1185
|
-
import { IMaskInput } from "react-imask";
|
|
1185
|
+
import { IMask, IMaskInput } from "react-imask";
|
|
1186
1186
|
import InfoOutlined from "@mui/icons-material/esm/InfoOutlined.js";
|
|
1187
1187
|
|
|
1188
1188
|
// src/components/Input/Input.tsx
|
|
@@ -1234,121 +1234,119 @@ Input.displayName = "Input";
|
|
|
1234
1234
|
var Input_default = Input;
|
|
1235
1235
|
|
|
1236
1236
|
// src/components/CurrencyInput/CurrencyInput.tsx
|
|
1237
|
-
function
|
|
1238
|
-
const formatted = new Intl.NumberFormat("en-us", {
|
|
1239
|
-
style: "currency",
|
|
1240
|
-
currency: currencyCode
|
|
1241
|
-
}).format(0);
|
|
1242
|
-
return formatted.replace(/[\d\s.,]/g, "");
|
|
1243
|
-
}
|
|
1244
|
-
function formatValueString(amount, currency = "usd") {
|
|
1237
|
+
function formatCurrency(value, currencyCode = "usd") {
|
|
1245
1238
|
const formatter = new IntlMessageFormat(
|
|
1246
|
-
`{amount, number, ::currency/${
|
|
1239
|
+
`{amount, number, ::currency/${currencyCode} unit-width-narrow}`
|
|
1247
1240
|
);
|
|
1248
|
-
|
|
1241
|
+
const amount = value || 0;
|
|
1242
|
+
const formatted = formatter.format({ amount }).toString();
|
|
1243
|
+
const symbol = formatted.replace(/[0-9.,]/g, "").trim();
|
|
1244
|
+
const formattedAmount = formatted.replace(symbol, "").trim();
|
|
1245
|
+
return {
|
|
1246
|
+
symbol,
|
|
1247
|
+
amount,
|
|
1248
|
+
formattedAmount
|
|
1249
|
+
};
|
|
1249
1250
|
}
|
|
1250
1251
|
var TextMaskAdapter = React14.forwardRef(
|
|
1251
1252
|
function TextMaskAdapter2(props, ref) {
|
|
1252
1253
|
const { onChange, currency, ...innerProps } = props;
|
|
1253
|
-
const [
|
|
1254
|
-
const currencySymbol = getCurrencySymbol(currency);
|
|
1254
|
+
const [formatted, setFormatted] = useState3(formatCurrency(props.value, currency));
|
|
1255
1255
|
return /* @__PURE__ */ React14.createElement(
|
|
1256
1256
|
IMaskInput,
|
|
1257
1257
|
{
|
|
1258
1258
|
...innerProps,
|
|
1259
1259
|
inputRef: ref,
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
onAccept: (value2) => {
|
|
1264
|
-
setValue(Number(value2));
|
|
1260
|
+
onAccept: (value) => {
|
|
1261
|
+
const unmaskedValue = value.replace(/[^\d\.]/g, "");
|
|
1262
|
+
setFormatted(formatCurrency(Number(unmaskedValue), currency));
|
|
1265
1263
|
onChange({
|
|
1266
1264
|
target: {
|
|
1267
1265
|
name: props.name,
|
|
1268
|
-
value:
|
|
1266
|
+
value: unmaskedValue
|
|
1269
1267
|
}
|
|
1270
1268
|
});
|
|
1271
1269
|
},
|
|
1272
|
-
|
|
1273
|
-
unmask: true,
|
|
1270
|
+
mask: `${formatted.symbol} integer\`.float`,
|
|
1274
1271
|
blocks: {
|
|
1275
|
-
|
|
1272
|
+
integer: {
|
|
1276
1273
|
mask: Number,
|
|
1277
|
-
thousandsSeparator: ","
|
|
1278
|
-
|
|
1279
|
-
|
|
1280
|
-
|
|
1281
|
-
|
|
1274
|
+
thousandsSeparator: ","
|
|
1275
|
+
},
|
|
1276
|
+
float: {
|
|
1277
|
+
mask: IMask.MaskedRange,
|
|
1278
|
+
from: 0,
|
|
1279
|
+
to: 99,
|
|
1280
|
+
maxLength: 2
|
|
1282
1281
|
}
|
|
1283
1282
|
},
|
|
1284
|
-
|
|
1283
|
+
value: formatted.formattedAmount,
|
|
1284
|
+
overwrite: "shift"
|
|
1285
1285
|
}
|
|
1286
1286
|
);
|
|
1287
1287
|
}
|
|
1288
1288
|
);
|
|
1289
|
-
var CurrencyInput = React14.forwardRef(
|
|
1290
|
-
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1289
|
+
var CurrencyInput = React14.forwardRef(function CurrencyInput2(props, ref) {
|
|
1290
|
+
const {
|
|
1291
|
+
currency = "usd",
|
|
1292
|
+
max = 1e5,
|
|
1293
|
+
name,
|
|
1294
|
+
onChange,
|
|
1295
|
+
label,
|
|
1296
|
+
error,
|
|
1297
|
+
helperText,
|
|
1298
|
+
required,
|
|
1299
|
+
disabled,
|
|
1300
|
+
...innerProps
|
|
1301
|
+
} = props;
|
|
1302
|
+
const [isOverLimit, setIsOverLimit] = useState3(
|
|
1303
|
+
!!props.value && props.value > Number(max)
|
|
1304
|
+
);
|
|
1305
|
+
const handleChange = useCallback3(
|
|
1306
|
+
(event) => {
|
|
1307
|
+
const amount = Number(event.target.value);
|
|
1308
|
+
onChange?.({ ...event, target: { name, value: amount } });
|
|
1309
|
+
if (amount > Number(max)) {
|
|
1310
|
+
setIsOverLimit(true);
|
|
1311
|
+
} else {
|
|
1312
|
+
setIsOverLimit(false);
|
|
1313
|
+
}
|
|
1314
|
+
},
|
|
1315
|
+
[]
|
|
1316
|
+
);
|
|
1317
|
+
const currencyFormatter = /* @__PURE__ */ React14.createElement(
|
|
1318
|
+
Input_default,
|
|
1319
|
+
{
|
|
1320
|
+
size: "sm",
|
|
1321
|
+
ref,
|
|
1322
|
+
onChange: handleChange,
|
|
1300
1323
|
disabled,
|
|
1301
|
-
|
|
1302
|
-
|
|
1303
|
-
|
|
1304
|
-
|
|
1305
|
-
);
|
|
1306
|
-
const handleChange = useCallback3(
|
|
1307
|
-
(event) => {
|
|
1308
|
-
const amount = Number(event.target.value);
|
|
1309
|
-
onChange?.({ ...event, target: { name, value: amount } });
|
|
1310
|
-
if (amount > max) {
|
|
1311
|
-
setIsOverLimit(true);
|
|
1312
|
-
} else {
|
|
1313
|
-
setIsOverLimit(false);
|
|
1314
|
-
}
|
|
1324
|
+
required,
|
|
1325
|
+
slotProps: { input: { component: TextMaskAdapter, currency } },
|
|
1326
|
+
sx: {
|
|
1327
|
+
fontFamily: "monospace"
|
|
1315
1328
|
},
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
|
|
1319
|
-
|
|
1329
|
+
...innerProps
|
|
1330
|
+
}
|
|
1331
|
+
);
|
|
1332
|
+
if (label) {
|
|
1333
|
+
return /* @__PURE__ */ React14.createElement(
|
|
1334
|
+
FormControl_default,
|
|
1320
1335
|
{
|
|
1321
1336
|
size: "sm",
|
|
1322
|
-
ref,
|
|
1323
|
-
onChange: handleChange,
|
|
1324
1337
|
disabled,
|
|
1325
1338
|
required,
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
|
|
1330
|
-
|
|
1331
|
-
|
|
1339
|
+
error: error || isOverLimit
|
|
1340
|
+
},
|
|
1341
|
+
/* @__PURE__ */ React14.createElement(FormLabel_default, null, label),
|
|
1342
|
+
currencyFormatter,
|
|
1343
|
+
isOverLimit ? /* @__PURE__ */ React14.createElement(FormHelperText_default, null, /* @__PURE__ */ React14.createElement(InfoOutlined, null), new IntlMessageFormat(
|
|
1344
|
+
`limit: {amount, number, ::currency/${currency} unit-width-narrow}`
|
|
1345
|
+
).format({ amount: max })) : helperText && /* @__PURE__ */ React14.createElement(FormHelperText_default, null, helperText)
|
|
1332
1346
|
);
|
|
1333
|
-
if (label) {
|
|
1334
|
-
return /* @__PURE__ */ React14.createElement(
|
|
1335
|
-
FormControl_default,
|
|
1336
|
-
{
|
|
1337
|
-
size: "sm",
|
|
1338
|
-
disabled,
|
|
1339
|
-
required,
|
|
1340
|
-
error: error || isOverLimit
|
|
1341
|
-
},
|
|
1342
|
-
/* @__PURE__ */ React14.createElement(FormLabel_default, null, label),
|
|
1343
|
-
currencyFormatter,
|
|
1344
|
-
isOverLimit ? /* @__PURE__ */ React14.createElement(FormHelperText_default, null, /* @__PURE__ */ React14.createElement(InfoOutlined, null), new IntlMessageFormat(
|
|
1345
|
-
`limit: {amount, number, ::currency/${currency} unit-width-narrow}`
|
|
1346
|
-
).format({ amount: max })) : helperText && /* @__PURE__ */ React14.createElement(FormHelperText_default, null, helperText)
|
|
1347
|
-
);
|
|
1348
|
-
}
|
|
1349
|
-
return currencyFormatter;
|
|
1350
1347
|
}
|
|
1351
|
-
|
|
1348
|
+
return currencyFormatter;
|
|
1349
|
+
});
|
|
1352
1350
|
|
|
1353
1351
|
// src/components/DataTable/DataTable.tsx
|
|
1354
1352
|
import React16, {
|
|
@@ -1882,7 +1880,7 @@ DataTable.displayName = "DataTable";
|
|
|
1882
1880
|
|
|
1883
1881
|
// src/components/DatePicker/DatePicker.tsx
|
|
1884
1882
|
import React17, { forwardRef as forwardRef4, useCallback as useCallback5, useState as useState5 } from "react";
|
|
1885
|
-
import { IMaskInput as IMaskInput2, IMask } from "react-imask";
|
|
1883
|
+
import { IMaskInput as IMaskInput2, IMask as IMask2 } from "react-imask";
|
|
1886
1884
|
import CalendarTodayIcon from "@mui/icons-material/esm/CalendarToday.js";
|
|
1887
1885
|
import { styled as styled6 } from "@mui/joy";
|
|
1888
1886
|
import { FocusTrap, ClickAwayListener, Popper } from "@mui/base";
|
|
@@ -1919,7 +1917,7 @@ var CalendarSheet = styled6(Sheet_default, {
|
|
|
1919
1917
|
boxShadow: theme.shadow.md,
|
|
1920
1918
|
borderRadius: theme.radius.md
|
|
1921
1919
|
}));
|
|
1922
|
-
var
|
|
1920
|
+
var formatValueString = (date) => {
|
|
1923
1921
|
let day = `${date.getDate()}`;
|
|
1924
1922
|
let month = `${date.getMonth() + 1}`;
|
|
1925
1923
|
const year = date.getFullYear();
|
|
@@ -1942,24 +1940,24 @@ var TextMaskAdapter3 = React17.forwardRef(
|
|
|
1942
1940
|
pattern: "Y/`m/`d",
|
|
1943
1941
|
blocks: {
|
|
1944
1942
|
d: {
|
|
1945
|
-
mask:
|
|
1943
|
+
mask: IMask2.MaskedRange,
|
|
1946
1944
|
from: 1,
|
|
1947
1945
|
to: 31,
|
|
1948
1946
|
maxLength: 2
|
|
1949
1947
|
},
|
|
1950
1948
|
m: {
|
|
1951
|
-
mask:
|
|
1949
|
+
mask: IMask2.MaskedRange,
|
|
1952
1950
|
from: 1,
|
|
1953
1951
|
to: 12,
|
|
1954
1952
|
maxLength: 2
|
|
1955
1953
|
},
|
|
1956
1954
|
Y: {
|
|
1957
|
-
mask:
|
|
1955
|
+
mask: IMask2.MaskedRange,
|
|
1958
1956
|
from: 1900,
|
|
1959
1957
|
to: 9999
|
|
1960
1958
|
}
|
|
1961
1959
|
},
|
|
1962
|
-
format:
|
|
1960
|
+
format: formatValueString,
|
|
1963
1961
|
parse: (str) => {
|
|
1964
1962
|
const yearMonthDay = str.split("/");
|
|
1965
1963
|
return new Date(
|
|
@@ -2043,7 +2041,7 @@ var DatePicker = forwardRef4(
|
|
|
2043
2041
|
{
|
|
2044
2042
|
value: !Number.isNaN(new Date(value).getTime()) ? [new Date(value), void 0] : void 0,
|
|
2045
2043
|
onChange: ([date]) => {
|
|
2046
|
-
setValue(
|
|
2044
|
+
setValue(formatValueString(date));
|
|
2047
2045
|
setAnchorEl(null);
|
|
2048
2046
|
},
|
|
2049
2047
|
minDate: minDate ? new Date(minDate) : void 0,
|
|
@@ -2094,7 +2092,7 @@ DatePicker.displayName = "DatePicker";
|
|
|
2094
2092
|
|
|
2095
2093
|
// src/components/DateRangePicker/DateRangePicker.tsx
|
|
2096
2094
|
import React18, { forwardRef as forwardRef5, useCallback as useCallback6, useMemo as useMemo4, useState as useState6 } from "react";
|
|
2097
|
-
import { IMaskInput as IMaskInput3, IMask as
|
|
2095
|
+
import { IMaskInput as IMaskInput3, IMask as IMask3 } from "react-imask";
|
|
2098
2096
|
import CalendarTodayIcon2 from "@mui/icons-material/esm/CalendarToday.js";
|
|
2099
2097
|
import { styled as styled7 } from "@mui/joy";
|
|
2100
2098
|
import { FocusTrap as FocusTrap2, ClickAwayListener as ClickAwayListener2, Popper as Popper2 } from "@mui/base";
|
|
@@ -2114,7 +2112,7 @@ var CalendarSheet2 = styled7(Sheet_default, {
|
|
|
2114
2112
|
boxShadow: theme.shadow.md,
|
|
2115
2113
|
borderRadius: theme.radius.md
|
|
2116
2114
|
}));
|
|
2117
|
-
var
|
|
2115
|
+
var formatValueString2 = ([date1, date2]) => {
|
|
2118
2116
|
const getStr = (date) => {
|
|
2119
2117
|
let day = `${date.getDate()}`;
|
|
2120
2118
|
let month = `${date.getMonth() + 1}`;
|
|
@@ -2158,24 +2156,24 @@ var TextMaskAdapter5 = React18.forwardRef(
|
|
|
2158
2156
|
pattern: "Y/`m/`d - Y/`m/`d",
|
|
2159
2157
|
blocks: {
|
|
2160
2158
|
d: {
|
|
2161
|
-
mask:
|
|
2159
|
+
mask: IMask3.MaskedRange,
|
|
2162
2160
|
from: 1,
|
|
2163
2161
|
to: 31,
|
|
2164
2162
|
maxLength: 2
|
|
2165
2163
|
},
|
|
2166
2164
|
m: {
|
|
2167
|
-
mask:
|
|
2165
|
+
mask: IMask3.MaskedRange,
|
|
2168
2166
|
from: 1,
|
|
2169
2167
|
to: 12,
|
|
2170
2168
|
maxLength: 2
|
|
2171
2169
|
},
|
|
2172
2170
|
Y: {
|
|
2173
|
-
mask:
|
|
2171
|
+
mask: IMask3.MaskedRange,
|
|
2174
2172
|
from: 1900,
|
|
2175
2173
|
to: 9999
|
|
2176
2174
|
}
|
|
2177
2175
|
},
|
|
2178
|
-
format:
|
|
2176
|
+
format: formatValueString2,
|
|
2179
2177
|
parse: parseDate,
|
|
2180
2178
|
autofix: "pad",
|
|
2181
2179
|
overwrite: true,
|
|
@@ -2222,7 +2220,7 @@ var DateRangePicker = forwardRef5(
|
|
|
2222
2220
|
([date1, date2]) => {
|
|
2223
2221
|
if (!date1 || !date2)
|
|
2224
2222
|
return;
|
|
2225
|
-
setValue(
|
|
2223
|
+
setValue(formatValueString2([date1, date2]));
|
|
2226
2224
|
setAnchorEl(null);
|
|
2227
2225
|
},
|
|
2228
2226
|
[setValue, setAnchorEl]
|
|
@@ -2419,7 +2417,7 @@ Grid.displayName = "Grid";
|
|
|
2419
2417
|
|
|
2420
2418
|
// src/components/MonthRangePicker/MonthRangePicker.tsx
|
|
2421
2419
|
import React23, { forwardRef as forwardRef6, useCallback as useCallback7, useMemo as useMemo5, useState as useState7 } from "react";
|
|
2422
|
-
import { IMaskInput as IMaskInput4, IMask as
|
|
2420
|
+
import { IMaskInput as IMaskInput4, IMask as IMask4 } from "react-imask";
|
|
2423
2421
|
import CalendarTodayIcon3 from "@mui/icons-material/esm/CalendarToday.js";
|
|
2424
2422
|
import { styled as styled12 } from "@mui/joy";
|
|
2425
2423
|
import { FocusTrap as FocusTrap3, ClickAwayListener as ClickAwayListener3, Popper as Popper3 } from "@mui/base";
|
|
@@ -2439,7 +2437,7 @@ var CalendarSheet3 = styled12(Sheet_default, {
|
|
|
2439
2437
|
boxShadow: theme.shadow.md,
|
|
2440
2438
|
borderRadius: theme.radius.md
|
|
2441
2439
|
}));
|
|
2442
|
-
var
|
|
2440
|
+
var formatValueString3 = ([date1, date2]) => {
|
|
2443
2441
|
const getStr = (date) => {
|
|
2444
2442
|
let month = `${date.getMonth() + 1}`;
|
|
2445
2443
|
const year = date.getFullYear();
|
|
@@ -2472,18 +2470,18 @@ var TextMaskAdapter7 = React23.forwardRef(
|
|
|
2472
2470
|
pattern: "Y/`m - Y/`m",
|
|
2473
2471
|
blocks: {
|
|
2474
2472
|
m: {
|
|
2475
|
-
mask:
|
|
2473
|
+
mask: IMask4.MaskedRange,
|
|
2476
2474
|
from: 1,
|
|
2477
2475
|
to: 12,
|
|
2478
2476
|
maxLength: 2
|
|
2479
2477
|
},
|
|
2480
2478
|
Y: {
|
|
2481
|
-
mask:
|
|
2479
|
+
mask: IMask4.MaskedRange,
|
|
2482
2480
|
from: 1900,
|
|
2483
2481
|
to: 9999
|
|
2484
2482
|
}
|
|
2485
2483
|
},
|
|
2486
|
-
format:
|
|
2484
|
+
format: formatValueString3,
|
|
2487
2485
|
parse: parseDate2,
|
|
2488
2486
|
autofix: "pad",
|
|
2489
2487
|
overwrite: true,
|
|
@@ -2530,7 +2528,7 @@ var MonthRangePicker = forwardRef6(
|
|
|
2530
2528
|
([date1, date2]) => {
|
|
2531
2529
|
if (!date1 || !date2)
|
|
2532
2530
|
return;
|
|
2533
|
-
setValue(
|
|
2531
|
+
setValue(formatValueString3([date1, date2]));
|
|
2534
2532
|
setAnchorEl(null);
|
|
2535
2533
|
},
|
|
2536
2534
|
[setValue, setAnchorEl]
|
package/framer/index.js
CHANGED
|
@@ -43871,133 +43871,131 @@ Input3.displayName = "Input";
|
|
|
43871
43871
|
var Input_default2 = Input3;
|
|
43872
43872
|
|
|
43873
43873
|
// src/components/CurrencyInput/CurrencyInput.tsx
|
|
43874
|
-
function
|
|
43875
|
-
const formatted = new Intl.NumberFormat("en-us", {
|
|
43876
|
-
style: "currency",
|
|
43877
|
-
currency: currencyCode
|
|
43878
|
-
}).format(0);
|
|
43879
|
-
return formatted.replace(/[\d\s.,]/g, "");
|
|
43880
|
-
}
|
|
43881
|
-
function formatValueString(amount, currency = "usd") {
|
|
43874
|
+
function formatCurrency(value, currencyCode = "usd") {
|
|
43882
43875
|
const formatter = new IntlMessageFormat(
|
|
43883
|
-
`{amount, number, ::currency/${
|
|
43876
|
+
`{amount, number, ::currency/${currencyCode} unit-width-narrow}`
|
|
43884
43877
|
);
|
|
43885
|
-
|
|
43878
|
+
const amount = value || 0;
|
|
43879
|
+
const formatted = formatter.format({ amount }).toString();
|
|
43880
|
+
const symbol = formatted.replace(/[0-9.,]/g, "").trim();
|
|
43881
|
+
const formattedAmount = formatted.replace(symbol, "").trim();
|
|
43882
|
+
return {
|
|
43883
|
+
symbol,
|
|
43884
|
+
amount,
|
|
43885
|
+
formattedAmount
|
|
43886
|
+
};
|
|
43886
43887
|
}
|
|
43887
43888
|
var TextMaskAdapter = React179.forwardRef(
|
|
43888
43889
|
function TextMaskAdapter2(props, ref) {
|
|
43889
43890
|
const _a2 = props, { onChange, currency } = _a2, innerProps = __objRest(_a2, ["onChange", "currency"]);
|
|
43890
|
-
const [
|
|
43891
|
-
const currencySymbol = getCurrencySymbol(currency);
|
|
43891
|
+
const [formatted, setFormatted] = useState26(formatCurrency(props.value, currency));
|
|
43892
43892
|
return /* @__PURE__ */ jsx2(
|
|
43893
43893
|
IMaskInput,
|
|
43894
43894
|
__spreadProps(__spreadValues({}, innerProps), {
|
|
43895
43895
|
inputRef: ref,
|
|
43896
|
-
|
|
43897
|
-
|
|
43898
|
-
|
|
43899
|
-
onAccept: (value2) => {
|
|
43900
|
-
setValue(Number(value2));
|
|
43896
|
+
onAccept: (value) => {
|
|
43897
|
+
const unmaskedValue = value.replace(/[^\d\.]/g, "");
|
|
43898
|
+
setFormatted(formatCurrency(Number(unmaskedValue), currency));
|
|
43901
43899
|
onChange({
|
|
43902
43900
|
target: {
|
|
43903
43901
|
name: props.name,
|
|
43904
|
-
value:
|
|
43902
|
+
value: unmaskedValue
|
|
43905
43903
|
}
|
|
43906
43904
|
});
|
|
43907
43905
|
},
|
|
43908
|
-
|
|
43909
|
-
unmask: true,
|
|
43906
|
+
mask: `${formatted.symbol} integer\`.float`,
|
|
43910
43907
|
blocks: {
|
|
43911
|
-
|
|
43908
|
+
integer: {
|
|
43912
43909
|
mask: Number,
|
|
43913
|
-
thousandsSeparator: ","
|
|
43914
|
-
|
|
43915
|
-
|
|
43916
|
-
|
|
43917
|
-
|
|
43910
|
+
thousandsSeparator: ","
|
|
43911
|
+
},
|
|
43912
|
+
float: {
|
|
43913
|
+
mask: IMask.MaskedRange,
|
|
43914
|
+
from: 0,
|
|
43915
|
+
to: 99,
|
|
43916
|
+
maxLength: 2
|
|
43918
43917
|
}
|
|
43919
43918
|
},
|
|
43920
|
-
|
|
43919
|
+
value: formatted.formattedAmount,
|
|
43920
|
+
overwrite: "shift"
|
|
43921
43921
|
})
|
|
43922
43922
|
);
|
|
43923
43923
|
}
|
|
43924
43924
|
);
|
|
43925
|
-
var CurrencyInput = React179.forwardRef(
|
|
43926
|
-
|
|
43927
|
-
|
|
43928
|
-
|
|
43929
|
-
|
|
43930
|
-
|
|
43931
|
-
|
|
43932
|
-
|
|
43933
|
-
|
|
43934
|
-
|
|
43925
|
+
var CurrencyInput = React179.forwardRef(function CurrencyInput2(props, ref) {
|
|
43926
|
+
const _a2 = props, {
|
|
43927
|
+
currency = "usd",
|
|
43928
|
+
max: max2 = 1e5,
|
|
43929
|
+
name,
|
|
43930
|
+
onChange,
|
|
43931
|
+
label,
|
|
43932
|
+
error,
|
|
43933
|
+
helperText,
|
|
43934
|
+
required,
|
|
43935
|
+
disabled
|
|
43936
|
+
} = _a2, innerProps = __objRest(_a2, [
|
|
43937
|
+
"currency",
|
|
43938
|
+
"max",
|
|
43939
|
+
"name",
|
|
43940
|
+
"onChange",
|
|
43941
|
+
"label",
|
|
43942
|
+
"error",
|
|
43943
|
+
"helperText",
|
|
43944
|
+
"required",
|
|
43945
|
+
"disabled"
|
|
43946
|
+
]);
|
|
43947
|
+
const [isOverLimit, setIsOverLimit] = useState26(
|
|
43948
|
+
!!props.value && props.value > Number(max2)
|
|
43949
|
+
);
|
|
43950
|
+
const handleChange = useCallback27(
|
|
43951
|
+
(event) => {
|
|
43952
|
+
const amount = Number(event.target.value);
|
|
43953
|
+
onChange == null ? void 0 : onChange(__spreadProps(__spreadValues({}, event), { target: { name, value: amount } }));
|
|
43954
|
+
if (amount > Number(max2)) {
|
|
43955
|
+
setIsOverLimit(true);
|
|
43956
|
+
} else {
|
|
43957
|
+
setIsOverLimit(false);
|
|
43958
|
+
}
|
|
43959
|
+
},
|
|
43960
|
+
[]
|
|
43961
|
+
);
|
|
43962
|
+
const currencyFormatter = /* @__PURE__ */ jsx2(
|
|
43963
|
+
Input_default2,
|
|
43964
|
+
__spreadValues({
|
|
43965
|
+
size: "sm",
|
|
43966
|
+
ref,
|
|
43967
|
+
onChange: handleChange,
|
|
43968
|
+
disabled,
|
|
43935
43969
|
required,
|
|
43936
|
-
|
|
43937
|
-
|
|
43938
|
-
|
|
43939
|
-
|
|
43940
|
-
|
|
43941
|
-
|
|
43942
|
-
|
|
43943
|
-
|
|
43944
|
-
|
|
43945
|
-
|
|
43946
|
-
"disabled"
|
|
43947
|
-
]);
|
|
43948
|
-
const [isOverLimit, setIsOverLimit] = useState26(
|
|
43949
|
-
!!props.value && props.value > max2
|
|
43950
|
-
);
|
|
43951
|
-
const handleChange = useCallback27(
|
|
43952
|
-
(event) => {
|
|
43953
|
-
const amount = Number(event.target.value);
|
|
43954
|
-
onChange == null ? void 0 : onChange(__spreadProps(__spreadValues({}, event), { target: { name, value: amount } }));
|
|
43955
|
-
if (amount > max2) {
|
|
43956
|
-
setIsOverLimit(true);
|
|
43957
|
-
} else {
|
|
43958
|
-
setIsOverLimit(false);
|
|
43959
|
-
}
|
|
43960
|
-
},
|
|
43961
|
-
[]
|
|
43962
|
-
);
|
|
43963
|
-
const currencyFormatter = /* @__PURE__ */ jsx2(
|
|
43964
|
-
Input_default2,
|
|
43965
|
-
__spreadValues({
|
|
43970
|
+
slotProps: { input: { component: TextMaskAdapter, currency } },
|
|
43971
|
+
sx: {
|
|
43972
|
+
fontFamily: "monospace"
|
|
43973
|
+
}
|
|
43974
|
+
}, innerProps)
|
|
43975
|
+
);
|
|
43976
|
+
if (label) {
|
|
43977
|
+
return /* @__PURE__ */ jsxs2(
|
|
43978
|
+
FormControl_default2,
|
|
43979
|
+
{
|
|
43966
43980
|
size: "sm",
|
|
43967
|
-
ref,
|
|
43968
|
-
onChange: handleChange,
|
|
43969
43981
|
disabled,
|
|
43970
43982
|
required,
|
|
43971
|
-
|
|
43972
|
-
|
|
43973
|
-
|
|
43974
|
-
|
|
43975
|
-
|
|
43983
|
+
error: error || isOverLimit,
|
|
43984
|
+
children: [
|
|
43985
|
+
/* @__PURE__ */ jsx2(FormLabel_default2, { children: label }),
|
|
43986
|
+
currencyFormatter,
|
|
43987
|
+
isOverLimit ? /* @__PURE__ */ jsxs2(FormHelperText_default2, { children: [
|
|
43988
|
+
/* @__PURE__ */ jsx2(InfoOutlined_default, {}),
|
|
43989
|
+
new IntlMessageFormat(
|
|
43990
|
+
`limit: {amount, number, ::currency/${currency} unit-width-narrow}`
|
|
43991
|
+
).format({ amount: max2 })
|
|
43992
|
+
] }) : helperText && /* @__PURE__ */ jsx2(FormHelperText_default2, { children: helperText })
|
|
43993
|
+
]
|
|
43994
|
+
}
|
|
43976
43995
|
);
|
|
43977
|
-
if (label) {
|
|
43978
|
-
return /* @__PURE__ */ jsxs2(
|
|
43979
|
-
FormControl_default2,
|
|
43980
|
-
{
|
|
43981
|
-
size: "sm",
|
|
43982
|
-
disabled,
|
|
43983
|
-
required,
|
|
43984
|
-
error: error || isOverLimit,
|
|
43985
|
-
children: [
|
|
43986
|
-
/* @__PURE__ */ jsx2(FormLabel_default2, { children: label }),
|
|
43987
|
-
currencyFormatter,
|
|
43988
|
-
isOverLimit ? /* @__PURE__ */ jsxs2(FormHelperText_default2, { children: [
|
|
43989
|
-
/* @__PURE__ */ jsx2(InfoOutlined_default, {}),
|
|
43990
|
-
new IntlMessageFormat(
|
|
43991
|
-
`limit: {amount, number, ::currency/${currency} unit-width-narrow}`
|
|
43992
|
-
).format({ amount: max2 })
|
|
43993
|
-
] }) : helperText && /* @__PURE__ */ jsx2(FormHelperText_default2, { children: helperText })
|
|
43994
|
-
]
|
|
43995
|
-
}
|
|
43996
|
-
);
|
|
43997
|
-
}
|
|
43998
|
-
return currencyFormatter;
|
|
43999
43996
|
}
|
|
44000
|
-
|
|
43997
|
+
return currencyFormatter;
|
|
43998
|
+
});
|
|
44001
43999
|
|
|
44002
44000
|
// src/components/DataTable/DataTable.tsx
|
|
44003
44001
|
import {
|
|
@@ -44645,7 +44643,7 @@ var CalendarSheet = styled_default2(Sheet_default2, {
|
|
|
44645
44643
|
boxShadow: theme.shadow.md,
|
|
44646
44644
|
borderRadius: theme.radius.md
|
|
44647
44645
|
}));
|
|
44648
|
-
var
|
|
44646
|
+
var formatValueString = (date) => {
|
|
44649
44647
|
let day = `${date.getDate()}`;
|
|
44650
44648
|
let month = `${date.getMonth() + 1}`;
|
|
44651
44649
|
const year = date.getFullYear();
|
|
@@ -44684,7 +44682,7 @@ var TextMaskAdapter3 = React181.forwardRef(
|
|
|
44684
44682
|
to: 9999
|
|
44685
44683
|
}
|
|
44686
44684
|
},
|
|
44687
|
-
format:
|
|
44685
|
+
format: formatValueString,
|
|
44688
44686
|
parse: (str) => {
|
|
44689
44687
|
const yearMonthDay = str.split("/");
|
|
44690
44688
|
return new Date(
|
|
@@ -44770,7 +44768,7 @@ var DatePicker = forwardRef85(
|
|
|
44770
44768
|
{
|
|
44771
44769
|
value: !Number.isNaN(new Date(value).getTime()) ? [new Date(value), void 0] : void 0,
|
|
44772
44770
|
onChange: ([date]) => {
|
|
44773
|
-
setValue(
|
|
44771
|
+
setValue(formatValueString(date));
|
|
44774
44772
|
setAnchorEl(null);
|
|
44775
44773
|
},
|
|
44776
44774
|
minDate: minDate ? new Date(minDate) : void 0,
|
|
@@ -44843,7 +44841,7 @@ var CalendarSheet2 = styled_default2(Sheet_default2, {
|
|
|
44843
44841
|
boxShadow: theme.shadow.md,
|
|
44844
44842
|
borderRadius: theme.radius.md
|
|
44845
44843
|
}));
|
|
44846
|
-
var
|
|
44844
|
+
var formatValueString2 = ([date1, date2]) => {
|
|
44847
44845
|
const getStr = (date) => {
|
|
44848
44846
|
let day = `${date.getDate()}`;
|
|
44849
44847
|
let month = `${date.getMonth() + 1}`;
|
|
@@ -44903,7 +44901,7 @@ var TextMaskAdapter5 = React182.forwardRef(
|
|
|
44903
44901
|
to: 9999
|
|
44904
44902
|
}
|
|
44905
44903
|
},
|
|
44906
|
-
format:
|
|
44904
|
+
format: formatValueString2,
|
|
44907
44905
|
parse: parseDate,
|
|
44908
44906
|
autofix: "pad",
|
|
44909
44907
|
overwrite: true,
|
|
@@ -44950,7 +44948,7 @@ var DateRangePicker = forwardRef86(
|
|
|
44950
44948
|
([date1, date2]) => {
|
|
44951
44949
|
if (!date1 || !date2)
|
|
44952
44950
|
return;
|
|
44953
|
-
setValue(
|
|
44951
|
+
setValue(formatValueString2([date1, date2]));
|
|
44954
44952
|
setAnchorEl(null);
|
|
44955
44953
|
},
|
|
44956
44954
|
[setValue, setAnchorEl]
|
|
@@ -45160,7 +45158,7 @@ var CalendarSheet3 = styled_default2(Sheet_default2, {
|
|
|
45160
45158
|
boxShadow: theme.shadow.md,
|
|
45161
45159
|
borderRadius: theme.radius.md
|
|
45162
45160
|
}));
|
|
45163
|
-
var
|
|
45161
|
+
var formatValueString3 = ([date1, date2]) => {
|
|
45164
45162
|
const getStr = (date) => {
|
|
45165
45163
|
let month = `${date.getMonth() + 1}`;
|
|
45166
45164
|
const year = date.getFullYear();
|
|
@@ -45203,7 +45201,7 @@ var TextMaskAdapter7 = React183.forwardRef(
|
|
|
45203
45201
|
to: 9999
|
|
45204
45202
|
}
|
|
45205
45203
|
},
|
|
45206
|
-
format:
|
|
45204
|
+
format: formatValueString3,
|
|
45207
45205
|
parse: parseDate2,
|
|
45208
45206
|
autofix: "pad",
|
|
45209
45207
|
overwrite: true,
|
|
@@ -45250,7 +45248,7 @@ var MonthRangePicker = forwardRef87(
|
|
|
45250
45248
|
([date1, date2]) => {
|
|
45251
45249
|
if (!date1 || !date2)
|
|
45252
45250
|
return;
|
|
45253
|
-
setValue(
|
|
45251
|
+
setValue(formatValueString3([date1, date2]));
|
|
45254
45252
|
setAnchorEl(null);
|
|
45255
45253
|
},
|
|
45256
45254
|
[setValue, setAnchorEl]
|
|
@@ -46026,8 +46024,7 @@ var currencyInputPropertyControls = {
|
|
|
46026
46024
|
},
|
|
46027
46025
|
max: {
|
|
46028
46026
|
title: "Max",
|
|
46029
|
-
type: ControlType11.
|
|
46030
|
-
defaultValue: void 0
|
|
46027
|
+
type: ControlType11.String
|
|
46031
46028
|
}
|
|
46032
46029
|
};
|
|
46033
46030
|
|