@ceed/cds 0.0.185 → 0.0.187-cjs.0

package/dist/components/Calendar/utils/index.js

@@ -0,0 +1,84 @@
+'use strict';
+
+const getCalendarDates = (date) => {
+    const dates = [];
+    const firstDay = new Date(date.getFullYear(), date.getMonth(), 1);
+    const lastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0);
+    const firstWeekInThisMonth = Math.ceil((firstDay.getDay() + 1) / 7);
+    const lastWeekInThisMonth = Math.ceil((lastDay.getDate() + firstDay.getDay()) / 7);
+    let day = 1;
+    for (let i = 1; i <= lastWeekInThisMonth; i++) {
+        const week = [];
+        for (let j = 1; j <= 7; j++) {
+            if (i === firstWeekInThisMonth && j < firstDay.getDay() + 1) {
+                week.push(undefined);
+            }
+            else if (day > lastDay.getDate()) {
+                week.push(undefined);
+            }
+            else {
+                week.push(day);
+                day++;
+            }
+        }
+        dates.push(week);
+    }
+    return dates;
+};
+const getYearName = (date, locale) => {
+    return date.toLocaleString(locale, { year: "numeric" });
+};
+const getMonthName = (date, locale) => {
+    return date.toLocaleString(locale, { year: "numeric", month: "long" });
+};
+const getMonthNameFromIndex = (index, locale) => {
+    return new Date(0, index).toLocaleString(locale, { month: "short" });
+};
+/**
+ * 일~토 / Sun ~ Sat 같은 요일 이름을 가져옵니다.
+ */
+const getWeekdayNames = (locale) => {
+    const currentDay = new Date().getDay();
+    const date = new Date();
+    date.setDate(date.getDate() - currentDay);
+    return Array.from({ length: 7 }).map(() => {
+        const day = date.toLocaleString(locale, { weekday: "short" });
+        date.setDate(date.getDate() + 1);
+        return day;
+    });
+};
+const isToday = (date) => {
+    const today = new Date();
+    const d = new Date(date);
+    d.setHours(0, 0, 0, 0);
+    today.setHours(0, 0, 0, 0);
+    return d.getTime() === today.getTime();
+};
+const isSameDay = (date1, date2) => {
+    const d1 = new Date(date1);
+    const d2 = new Date(date2);
+    d1.setHours(0, 0, 0, 0);
+    d2.setHours(0, 0, 0, 0);
+    return d1.getTime() === d2.getTime();
+};
+const isWithinRange = (d1, d2, date) => {
+    const dateToCheck = new Date(date);
+    dateToCheck.setHours(0, 0, 0, 0);
+    const minDate = new Date(Math.min(d1.getTime(), d2.getTime()));
+    const maxDate = new Date(Math.max(d1.getTime(), d2.getTime()));
+    return dateToCheck >= minDate && dateToCheck <= maxDate;
+};
+const isSameMonth = (date1, date2) => {
+    return (date1.getFullYear() === date2.getFullYear() &&
+        date1.getMonth() === date2.getMonth());
+};
+
+exports.getCalendarDates = getCalendarDates;
+exports.getMonthName = getMonthName;
+exports.getMonthNameFromIndex = getMonthNameFromIndex;
+exports.getWeekdayNames = getWeekdayNames;
+exports.getYearName = getYearName;
+exports.isSameDay = isSameDay;
+exports.isSameMonth = isSameMonth;
+exports.isToday = isToday;
+exports.isWithinRange = isWithinRange;

package/dist/components/Card/Card.js

@@ -0,0 +1,26 @@
+'use strict';
+
+var joy = require('@mui/joy');
+var framerMotion = require('framer-motion');
+
+const MotionCard = framerMotion.motion(joy.Card);
+const Card = MotionCard;
+Card.displayName = "Card";
+const MotionCardContent = framerMotion.motion(joy.CardContent);
+const CardContent = MotionCardContent;
+CardContent.displayName = "CardContent";
+const MotionCardCover = framerMotion.motion(joy.CardCover);
+const CardCover = MotionCardCover;
+CardCover.displayName = "CardCover";
+const MotionCardActions = framerMotion.motion(joy.CardActions);
+const CardActions = MotionCardActions;
+CardActions.displayName = "CardActions";
+const MotionCardOverflow = framerMotion.motion(joy.CardOverflow);
+const CardOverflow = MotionCardOverflow;
+CardOverflow.displayName = "CardOverflow";
+
+exports.Card = Card;
+exports.CardActions = CardActions;
+exports.CardContent = CardContent;
+exports.CardCover = CardCover;
+exports.CardOverflow = CardOverflow;

package/dist/components/Checkbox/Checkbox.js

@@ -0,0 +1,21 @@
+'use strict';
+
+var React = require('react');
+var joy = require('@mui/joy');
+var framerMotion = require('framer-motion');
+
+const MotionCheckbox = framerMotion.motion(joy.Checkbox);
+const Checkbox = (props) => {
+    // prop destruction
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return React.createElement(MotionCheckbox, { ...props });
+};
+Checkbox.displayName = "Checkbox";
+
+exports.Checkbox = Checkbox;

package/dist/components/Checkbox/index.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Checkbox = require('./Checkbox.js');
+
+
+
+exports.Checkbox = Checkbox.Checkbox;
+exports.default = Checkbox.Checkbox;

package/dist/components/Chip/Chip.js

@@ -0,0 +1,10 @@
+'use strict';
+
+var joy = require('@mui/joy');
+var framerMotion = require('framer-motion');
+
+const MotionChip = framerMotion.motion(joy.Chip);
+const Chip = MotionChip;
+Chip.displayName = "Chip";
+
+exports.Chip = Chip;

package/dist/components/Chip/index.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Chip = require('./Chip.js');
+
+
+
+exports.Chip = Chip.Chip;
+exports.default = Chip.Chip;

package/dist/components/Container/Container.js

@@ -0,0 +1,51 @@
+'use strict';
+
+var joy = require('@mui/joy');
+var React = require('react');
+
+const ContainerRoot = joy.styled("div", {
+    name: "Container",
+    slot: "root",
+    shouldForwardProp: (prop) => prop !== "maxWidth" && prop !== "overrideBreakpoint",
+})(({ theme, maxWidth = "lg", overrideBreakpoint }) => [
+    {
+        width: "100%",
+        marginLeft: "auto",
+        boxSizing: "border-box",
+        marginRight: "auto",
+        display: "block", // Fix IE11 layout when used with main.
+        paddingLeft: theme.spacing(4),
+        paddingRight: theme.spacing(4),
+        [theme.breakpoints.up("md")]: {
+            paddingLeft: theme.spacing(8),
+            paddingRight: theme.spacing(8),
+        },
+        maxWidth: theme.breakpoints.values[maxWidth],
+    },
+    overrideBreakpoint
+        ? {
+            paddingLeft: theme.breakpoints.values[overrideBreakpoint] >=
+                theme.breakpoints.values.lg
+                ? theme.spacing(8)
+                : theme.spacing(4),
+            paddingRight: theme.breakpoints.values[overrideBreakpoint] >=
+                theme.breakpoints.values.lg
+                ? theme.spacing(8)
+                : theme.spacing(4),
+        }
+        : null,
+]);
+const Container = React.forwardRef(function Container(props, ref) {
+    // prop destruction
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return React.createElement(ContainerRoot, { ref: ref, ...props });
+});
+Container.displayName = "Container";
+
+exports.Container = Container;

package/dist/components/CurrencyInput/CurrencyInput.js

@@ -0,0 +1,93 @@
+'use strict';
+
+var React = require('react');
+var IntlMessageFormat = require('intl-messageformat');
+var reactNumberFormat = require('react-number-format');
+var Input = require('../Input/Input.js');
+var joy = require('@mui/joy');
+var useCurrencySetting = require('./hooks/use-currency-setting.js');
+var index = require('../../hooks/use-controlled-state/index.js');
+
+const TextMaskAdapter = React.forwardRef(function TextMaskAdapter(props, ref) {
+    // prop destruction
+    const { onChange, ...innerProps } = props;
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return (React.createElement(reactNumberFormat.NumericFormat, { ...innerProps, onValueChange: ({ value }) => {
+            onChange?.({
+                target: { name: props.name, value },
+            });
+        }, valueIsNumericString: true, getInputRef: ref, allowNegative: false }));
+});
+const CurrencyInputRoot = joy.styled(Input.Input, {
+    name: "CurrencyInput",
+    slot: "root",
+    overridesResolver: (props, styles) => styles.root,
+})({});
+const CurrencyInput = React.forwardRef(function CurrencyInput(inProps, ref) {
+    // prop destruction
+    const props = joy.useThemeProps({ props: inProps, name: "CurrencyInput" });
+    const { currency = "USD", name, onChange, label, error, helperText, required, disabled, useMinorUnit, 
+    // NOTE: 스타일 관련된 props는 최상위 엘리먼트에 적용한다.
+    sx, className, ...innerProps } = props;
+    // lib hooks
+    const { symbol, thousandSeparator, decimalSeparator, placeholder, fixedDecimalScale, decimalScale, } = useCurrencySetting.useCurrencySetting(currency);
+    // state, ref, querystring hooks
+    const [_value, setValue] = index.useControlledState(props.value, props.defaultValue, React.useCallback((value) => onChange?.({ target: { name, value } }), [onChange, name]));
+    const value = React.useMemo(() => {
+        if (_value && useMinorUnit) {
+            return _value / Math.pow(10, decimalScale);
+        }
+        return _value;
+    }, [_value, useMinorUnit, decimalScale]);
+    const max = React.useMemo(() => {
+        if (props.max && useMinorUnit) {
+            return props.max / Math.pow(10, decimalScale);
+        }
+        return props.max;
+    }, [props.max, useMinorUnit, decimalScale]);
+    const [isOverLimit, setIsOverLimit] = React.useState(!!max && !!value && value > max);
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    const handleChange = React.useCallback((event) => {
+        if (event.target.value === "") {
+            setValue(undefined);
+            return;
+        }
+        const amount = useMinorUnit
+            ? Number(event.target.value?.replace(decimalSeparator, ""))
+            : Number(event.target.value);
+        if (!!max && Number(event.target.value) > max) {
+            setIsOverLimit(true);
+        }
+        else {
+            setIsOverLimit(false);
+        }
+        setValue(amount);
+    }, [decimalSeparator, max, useMinorUnit, setValue]);
+    return (React.createElement(CurrencyInputRoot, { ...innerProps, ref: ref, value: value, placeholder: placeholder, onChange: handleChange, error: error || isOverLimit, disabled: disabled, required: required, color: error || isOverLimit ? "danger" : props.color, label: label, helperText: isOverLimit
+            ? new IntlMessageFormat.IntlMessageFormat(`limit: {amount, number, ::currency/${currency} unit-width-narrow}`).format({ amount: max })
+            : helperText, slotProps: {
+            input: {
+                component: TextMaskAdapter,
+                decimalSeparator,
+                thousandSeparator,
+                prefix: symbol,
+                fixedDecimalScale,
+                decimalScale,
+                "aria-label": innerProps["aria-label"],
+            },
+        }, sx: {
+            ...sx,
+        }, className: className }));
+});
+
+exports.CurrencyInput = CurrencyInput;

package/dist/components/CurrencyInput/hooks/use-currency-setting.js

@@ -0,0 +1,169 @@
+'use strict';
+
+var IntlMessageFormat = require('intl-messageformat');
+
+/**
+ * @see https://docs.adyen.com/development-resources/currency-codes/
+ */
+const CURRENCY_DECIMAL_MAP = {
+    AED: 2,
+    ALL: 2,
+    AMD: 2,
+    ANG: 2,
+    AOA: 2,
+    ARS: 2,
+    AUD: 2,
+    AWG: 2,
+    AZN: 2,
+    BAM: 2,
+    BBD: 2,
+    BDT: 2,
+    BGN: 2,
+    BHD: 3,
+    BMD: 2,
+    BND: 2,
+    BOB: 2,
+    BRL: 2,
+    BSD: 2,
+    BWP: 2,
+    BYN: 2,
+    BZD: 2,
+    CAD: 2,
+    CHF: 2,
+    CLP: 2,
+    CNH: 2,
+    CNY: 2,
+    COP: 2,
+    CRC: 2,
+    CUP: 2,
+    CVE: 0,
+    CZK: 2,
+    DJF: 0,
+    DKK: 2,
+    DOP: 2,
+    DZD: 2,
+    EGP: 2,
+    ETB: 2,
+    EUR: 2,
+    FJD: 2,
+    FKP: 2,
+    GBP: 2,
+    GEL: 2,
+    GHS: 2,
+    GIP: 2,
+    GMD: 2,
+    GNF: 0,
+    GTQ: 2,
+    GYD: 2,
+    HKD: 2,
+    HNL: 2,
+    HTG: 2,
+    HUF: 2,
+    IDR: 0,
+    ILS: 2,
+    INR: 2,
+    IQD: 3,
+    ISK: 2,
+    JMD: 2,
+    JOD: 3,
+    JPY: 0,
+    KES: 2,
+    KGS: 2,
+    KHR: 2,
+    KMF: 0,
+    KRW: 0,
+    KWD: 3,
+    KYD: 2,
+    KZT: 2,
+    LAK: 2,
+    LBP: 2,
+    LKR: 2,
+    LYD: 3,
+    MAD: 2,
+    MDL: 2,
+    MKD: 2,
+    MMK: 2,
+    MNT: 2,
+    MOP: 2,
+    MRU: 2,
+    MUR: 2,
+    MVR: 2,
+    MWK: 2,
+    MXN: 2,
+    MYR: 2,
+    MZN: 2,
+    NAD: 2,
+    NGN: 2,
+    NIO: 2,
+    NOK: 2,
+    NPR: 2,
+    NZD: 2,
+    OMR: 3,
+    PAB: 2,
+    PEN: 2,
+    PGK: 2,
+    PHP: 2,
+    PKR: 2,
+    PLN: 2,
+    PYG: 0,
+    QAR: 2,
+    RON: 2,
+    RSD: 2,
+    RUB: 2,
+    RWF: 0,
+    SAR: 2,
+    SBD: 2,
+    SCR: 2,
+    SEK: 2,
+    SGD: 2,
+    SHP: 2,
+    SLE: 2,
+    SOS: 2,
+    SRD: 2,
+    STN: 2,
+    SVC: 2,
+    SZL: 2,
+    THB: 2,
+    TND: 3,
+    TOP: 2,
+    TRY: 2,
+    TTD: 2,
+    TWD: 2,
+    TZS: 2,
+    UAH: 2,
+    UGX: 0,
+    USD: 2,
+    UYU: 2,
+    UZS: 2,
+    VEF: 2,
+    VND: 0,
+    VUV: 0,
+    WST: 2,
+    XAF: 0,
+    XCD: 2,
+    XOF: 0,
+    XPF: 0,
+    YER: 2,
+    ZAR: 2,
+    ZMW: 2,
+};
+const useCurrencySetting = (currencyCode = "USD") => {
+    const [symbol, thousandSeparator, decimalSeparator, ...rest] = new IntlMessageFormat(`{amount, number, ::currency/${currencyCode} unit-width-narrow}`)
+        .format({ amount: 1000 })
+        .toString()
+        .replace(/\d/g, "")
+        .split("");
+    const decimalScale = CURRENCY_DECIMAL_MAP[currencyCode];
+    return {
+        symbol: `${symbol} `,
+        thousandSeparator,
+        decimalSeparator,
+        placeholder: decimalSeparator
+            ? `${symbol} 0${decimalSeparator}${Array.from(Array(decimalScale)).map(() => 0).join('')}`
+            : `${symbol} 0`,
+        fixedDecimalScale: !!decimalSeparator,
+        decimalScale,
+    };
+};
+
+exports.useCurrencySetting = useCurrencySetting;

package/dist/components/CurrencyInput/index.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var CurrencyInput = require('./CurrencyInput.js');
+
+
+
+exports.CurrencyInput = CurrencyInput.CurrencyInput;
+exports.default = CurrencyInput.CurrencyInput;