@chayns-components/core 5.0.0-beta.232 → 5.0.0-beta.236

package/lib/components/date-info/DateInfo.js

@@ -101,7 +101,7 @@ const DateInfo = _ref => {
   (0, _react.useEffect)(() => {
     setFormattedDate(new Date(date));
   }, [date]);
-  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement("div", null, preText.trim(), " ", formattedDateString), [formattedDateString, preText]);
+  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement("span", null, preText.trim(), " ", formattedDateString), [formattedDateString, preText]);
 };
 DateInfo.displayName = 'DateInfo';
 var _default = DateInfo;

package/lib/components/date-info/DateInfo.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateInfo.js","names":["_dateFns","require","_react","_interopRequireWildcard","_format","_language","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","DateInfo","_ref","date","preText","shouldShowThisYear","shouldShowTime","shouldShowRelativeDayOfWeek","shouldUseShortText","shouldShowDayOfWeek","shouldShowDateToNowDifference","formattedDate","setFormattedDate","useState","Date","formattedDateString","setFormattedDateString","language","getLanguage","useEffect","newFormattedDateString","getFormattedDayOfWeek","formatString","getMonthFormat","getYearFormat","format","locale","getFormattedTime","currentDate","setCurrentDate","timeoutTime","getSeconds","timeDiffInMs","getTime","isPast","Math","max","timeout","setTimeout","clearTimeout","getTimeTillNow","useMemo","createElement","trim","displayName","_default","exports"],"sources":["../../../src/components/date-info/DateInfo.tsx"],"sourcesContent":["import { format, isPast } from 'date-fns';\nimport React, { FC, useEffect, useMemo, useState } from 'react';\nimport {\n    getFormattedDayOfWeek,\n    getFormattedTime,\n    getMonthFormat,\n    getTimeTillNow,\n    getYearFormat,\n} from './utils/format';\nimport { getLanguage } from './utils/language';\n\nexport type DateInfoProps = {\n    /**\n     * The date, that should be displayed\n     */\n    date: Date | string;\n    /**\n     * Additional text for \"shouldShowDateToNowDifference\" prop. Writes a text before the calculated time\n     */\n    preText?: string;\n    /**\n     * Adds the current year to the display\n     */\n    shouldShowThisYear?: boolean;\n    /**\n     * Adds the time to the display.\n     * NOTE: The time is display with german text\n     */\n    shouldShowTime?: boolean;\n    /**\n     * Whether the relative day of week to today should be shown (today, yesterday or tomorrow).\n     * NOTE: The text is only available in german\n     */\n    shouldShowRelativeDayOfWeek?: boolean;\n    /**\n     * Shortens the day and month text to maximum three digits\n     */\n    shouldUseShortText?: boolean;\n    /**\n     * Adds the day of week to the display\n     */\n    shouldShowDayOfWeek?: boolean;\n    /**\n     * Shows the difference from the date to now. The component handles updates itself.\n     * NOTE: This option is only available in german\n     */\n    shouldShowDateToNowDifference?: boolean;\n};\n\nconst DateInfo: FC<DateInfoProps> = ({\n    date,\n    preText = '',\n    shouldShowThisYear,\n    shouldShowTime,\n    shouldShowRelativeDayOfWeek,\n    shouldUseShortText,\n    shouldShowDayOfWeek,\n    shouldShowDateToNowDifference,\n}) => {\n    const [formattedDate, setFormattedDate] = useState(new Date(date));\n    const [formattedDateString, setFormattedDateString] = useState<string>('');\n    const [language] = useState(getLanguage());\n\n    useEffect(() => {\n        // This useEffect is used for normal date formation\n        if (shouldShowDateToNowDifference) {\n            return;\n        }\n\n        let newFormattedDateString = getFormattedDayOfWeek({\n            shouldShowDayOfWeek,\n            shouldShowRelativeDayOfWeek,\n            shouldUseShortText,\n            date: formattedDate,\n        });\n\n        let formatString = 'dd. ';\n\n        formatString += `${getMonthFormat({ shouldUseShortText })}`;\n\n        formatString += `${getYearFormat({\n            date: formattedDate,\n            shouldShowThisYear,\n        })}`;\n\n        newFormattedDateString += format(formattedDate, formatString, { locale: language });\n\n        newFormattedDateString += getFormattedTime({ date: formattedDate, shouldShowTime });\n\n        setFormattedDateString(newFormattedDateString);\n    }, [\n        date,\n        formattedDate,\n        language,\n        shouldShowDateToNowDifference,\n        shouldShowDayOfWeek,\n        shouldShowRelativeDayOfWeek,\n        shouldShowThisYear,\n        shouldShowTime,\n        shouldUseShortText,\n    ]);\n\n    // Calculate remaining time till next minute to update time according to time left\n    const [currentDate, setCurrentDate] = useState(new Date());\n\n    useEffect(() => {\n        // This useEffect is for calculating the current date for shouldShowDateToNowDifference option\n        if (!shouldShowDateToNowDifference) {\n            return () => {};\n        }\n\n        let timeoutTime = formattedDate.getSeconds() - new Date().getSeconds();\n\n        // If the seconds of date are after seconds of current time, the timeoutTime has to be calculated differently\n        if (timeoutTime < 0) {\n            timeoutTime = 60 - new Date().getSeconds() + formattedDate.getSeconds();\n        }\n\n        // initialized with remaining time\n        let timeDiffInMs = formattedDate.getTime() - currentDate.getTime();\n\n        // set to elapsed time\n        if (isPast(formattedDate)) {\n            timeDiffInMs = currentDate.getTime() - formattedDate.getTime();\n        }\n\n        // time difference is less than a minute, time should be updated every second\n        if (timeDiffInMs < 60000) {\n            timeoutTime = 1;\n        }\n\n        // Set timeoutTime to at least 1000ms\n        timeoutTime = Math.max(timeoutTime * 1000, 1000);\n\n        const timeout = setTimeout(() => {\n            setCurrentDate(new Date());\n        }, timeoutTime);\n\n        return () => {\n            clearTimeout(timeout);\n        };\n    }, [currentDate, date, formattedDate, shouldShowDateToNowDifference]);\n\n    useEffect(() => {\n        // This useEffect is for showing the difference of the date to now\n        if (shouldShowDateToNowDifference) {\n            setFormattedDateString(getTimeTillNow({ date: formattedDate, currentDate }));\n        }\n    }, [currentDate, date, formattedDate, shouldShowDateToNowDifference]);\n\n    useEffect(() => {\n        setFormattedDate(new Date(date));\n    }, [date]);\n\n    return useMemo(\n        () => (\n            <div>\n                {preText.trim()} {formattedDateString}\n            </div>\n        ),\n        [formattedDateString, preText]\n    );\n};\n\nDateInfo.displayName = 'DateInfo';\n\nexport default DateInfo;\n"],"mappings":"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"}
+{"version":3,"file":"DateInfo.js","names":["_dateFns","require","_react","_interopRequireWildcard","_format","_language","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","DateInfo","_ref","date","preText","shouldShowThisYear","shouldShowTime","shouldShowRelativeDayOfWeek","shouldUseShortText","shouldShowDayOfWeek","shouldShowDateToNowDifference","formattedDate","setFormattedDate","useState","Date","formattedDateString","setFormattedDateString","language","getLanguage","useEffect","newFormattedDateString","getFormattedDayOfWeek","formatString","getMonthFormat","getYearFormat","format","locale","getFormattedTime","currentDate","setCurrentDate","timeoutTime","getSeconds","timeDiffInMs","getTime","isPast","Math","max","timeout","setTimeout","clearTimeout","getTimeTillNow","useMemo","createElement","trim","displayName","_default","exports"],"sources":["../../../src/components/date-info/DateInfo.tsx"],"sourcesContent":["import { format, isPast } from 'date-fns';\nimport React, { FC, useEffect, useMemo, useState } from 'react';\nimport {\n    getFormattedDayOfWeek,\n    getFormattedTime,\n    getMonthFormat,\n    getTimeTillNow,\n    getYearFormat,\n} from './utils/format';\nimport { getLanguage } from './utils/language';\n\nexport type DateInfoProps = {\n    /**\n     * The date, that should be displayed\n     */\n    date: Date | string;\n    /**\n     * Additional text for \"shouldShowDateToNowDifference\" prop. Writes a text before the calculated time\n     */\n    preText?: string;\n    /**\n     * Adds the current year to the display\n     */\n    shouldShowThisYear?: boolean;\n    /**\n     * Adds the time to the display.\n     * NOTE: The time is display with german text\n     */\n    shouldShowTime?: boolean;\n    /**\n     * Whether the relative day of week to today should be shown (today, yesterday or tomorrow).\n     * NOTE: The text is only available in german\n     */\n    shouldShowRelativeDayOfWeek?: boolean;\n    /**\n     * Shortens the day and month text to maximum three digits\n     */\n    shouldUseShortText?: boolean;\n    /**\n     * Adds the day of week to the display\n     */\n    shouldShowDayOfWeek?: boolean;\n    /**\n     * Shows the difference from the date to now. The component handles updates itself.\n     * NOTE: This option is only available in german\n     */\n    shouldShowDateToNowDifference?: boolean;\n};\n\nconst DateInfo: FC<DateInfoProps> = ({\n    date,\n    preText = '',\n    shouldShowThisYear,\n    shouldShowTime,\n    shouldShowRelativeDayOfWeek,\n    shouldUseShortText,\n    shouldShowDayOfWeek,\n    shouldShowDateToNowDifference,\n}) => {\n    const [formattedDate, setFormattedDate] = useState(new Date(date));\n    const [formattedDateString, setFormattedDateString] = useState<string>('');\n    const [language] = useState(getLanguage());\n\n    useEffect(() => {\n        // This useEffect is used for normal date formation\n        if (shouldShowDateToNowDifference) {\n            return;\n        }\n\n        let newFormattedDateString = getFormattedDayOfWeek({\n            shouldShowDayOfWeek,\n            shouldShowRelativeDayOfWeek,\n            shouldUseShortText,\n            date: formattedDate,\n        });\n\n        let formatString = 'dd. ';\n\n        formatString += `${getMonthFormat({ shouldUseShortText })}`;\n\n        formatString += `${getYearFormat({\n            date: formattedDate,\n            shouldShowThisYear,\n        })}`;\n\n        newFormattedDateString += format(formattedDate, formatString, { locale: language });\n\n        newFormattedDateString += getFormattedTime({ date: formattedDate, shouldShowTime });\n\n        setFormattedDateString(newFormattedDateString);\n    }, [\n        date,\n        formattedDate,\n        language,\n        shouldShowDateToNowDifference,\n        shouldShowDayOfWeek,\n        shouldShowRelativeDayOfWeek,\n        shouldShowThisYear,\n        shouldShowTime,\n        shouldUseShortText,\n    ]);\n\n    // Calculate remaining time till next minute to update time according to time left\n    const [currentDate, setCurrentDate] = useState(new Date());\n\n    useEffect(() => {\n        // This useEffect is for calculating the current date for shouldShowDateToNowDifference option\n        if (!shouldShowDateToNowDifference) {\n            return () => {};\n        }\n\n        let timeoutTime = formattedDate.getSeconds() - new Date().getSeconds();\n\n        // If the seconds of date are after seconds of current time, the timeoutTime has to be calculated differently\n        if (timeoutTime < 0) {\n            timeoutTime = 60 - new Date().getSeconds() + formattedDate.getSeconds();\n        }\n\n        // initialized with remaining time\n        let timeDiffInMs = formattedDate.getTime() - currentDate.getTime();\n\n        // set to elapsed time\n        if (isPast(formattedDate)) {\n            timeDiffInMs = currentDate.getTime() - formattedDate.getTime();\n        }\n\n        // time difference is less than a minute, time should be updated every second\n        if (timeDiffInMs < 60000) {\n            timeoutTime = 1;\n        }\n\n        // Set timeoutTime to at least 1000ms\n        timeoutTime = Math.max(timeoutTime * 1000, 1000);\n\n        const timeout = setTimeout(() => {\n            setCurrentDate(new Date());\n        }, timeoutTime);\n\n        return () => {\n            clearTimeout(timeout);\n        };\n    }, [currentDate, date, formattedDate, shouldShowDateToNowDifference]);\n\n    useEffect(() => {\n        // This useEffect is for showing the difference of the date to now\n        if (shouldShowDateToNowDifference) {\n            setFormattedDateString(getTimeTillNow({ date: formattedDate, currentDate }));\n        }\n    }, [currentDate, date, formattedDate, shouldShowDateToNowDifference]);\n\n    useEffect(() => {\n        setFormattedDate(new Date(date));\n    }, [date]);\n\n    return useMemo(\n        () => (\n            <span>\n                {preText.trim()} {formattedDateString}\n            </span>\n        ),\n        [formattedDateString, preText]\n    );\n};\n\nDateInfo.displayName = 'DateInfo';\n\nexport default DateInfo;\n"],"mappings":"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"}

package/lib/components/number-input/NumberInput.d.ts

@@ -25,6 +25,10 @@ export type NumberInputProps = {
      * Callback function that is called when the input gets out of focus
      */
     onNumberChange: (newNumber: number | null) => void;
+    /**
+     * Whether the input is disabled
+     */
+    isDisabled?: boolean;
 };
 declare const NumberInput: FC<NumberInputProps>;
 export default NumberInput;

package/lib/components/number-input/NumberInput.js

@@ -18,7 +18,8 @@ const NumberInput = _ref => {
     maxNumber = Infinity,
     number,
     placeholder,
-    onNumberChange
+    onNumberChange,
+    isDisabled
   } = _ref;
   const [stringValue, setStringValue] = (0, _react.useState)('');
   const handleChange = function () {
@@ -100,7 +101,8 @@ const NumberInput = _ref => {
     value: stringValue,
     placeholder: placeholder,
     onBlur: onBlur,
-    onFocus: onFocus
+    onFocus: onFocus,
+    isDisabled: isDisabled
   });
 };
 NumberInput.displayName = 'NumberInput';

package/lib/components/number-input/NumberInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberInput.js","names":["_react","_interopRequireWildcard","require","_Input","_interopRequireDefault","_number","_number2","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","NumberInput","_ref","isDecimalInput","isMoneyInput","maxNumber","Infinity","number","placeholder","onNumberChange","stringValue","setStringValue","useState","handleChange","newValue","arguments","length","undefined","parsedValue","parseFloatAndRound","toString","formateNumber","onChange","event","target","value","sanitizedValue","replace","NUMBER_CLEAR_REGEX","trim","DECIMAL_TEST","test","parsedNumber","MONEY_TEST","decimals","INTEGER_TEST","Number","onBlur","onFocus","replaceAll","useEffect","createElement","displayName","_default","exports"],"sources":["../../../src/components/number-input/NumberInput.tsx"],"sourcesContent":["import React, { ChangeEvent, FC, useEffect, useState } from 'react';\nimport Input from '../input/Input';\nimport { DECIMAL_TEST, INTEGER_TEST, MONEY_TEST, NUMBER_CLEAR_REGEX } from './constants/number';\nimport { formateNumber, parseFloatAndRound } from './utils/number';\n\nexport type NumberInputProps = {\n    /**\n     * Whether the user can add decimal places. Enables the user to input a zero as first number\n     */\n    isDecimalInput?: boolean;\n    /**\n     * Applies rules for money input.\n     * Rules: only two decimal places, one leading zero\n     */\n    isMoneyInput?: boolean;\n    /**\n     * Limits the number to this value\n     */\n    maxNumber?: number;\n    /**\n     * The number that should be displayed formatted in the input field. NOTE: A zero as number is not allowed\n     */\n    number: number | null;\n    /**\n     * The placeholder that should be in the input\n     */\n    placeholder?: string;\n    /**\n     * Callback function that is called when the input gets out of focus\n     */\n    onNumberChange: (newNumber: number | null) => void;\n};\n\nconst NumberInput: FC<NumberInputProps> = ({\n    isDecimalInput,\n    isMoneyInput,\n    maxNumber = Infinity,\n    number,\n    placeholder,\n    onNumberChange,\n}) => {\n    const [stringValue, setStringValue] = useState<string>('');\n\n    const handleChange = (newValue: number | null = null) => {\n        if (typeof newValue !== 'number') {\n            setStringValue('');\n\n            return;\n        }\n\n        const parsedValue = parseFloatAndRound({ stringValue: newValue?.toString() });\n\n        setStringValue(formateNumber({ number: parsedValue }));\n    };\n\n    const onChange = (event: ChangeEvent<HTMLInputElement>) => {\n        const newValue = event.target.value;\n\n        const sanitizedValue = newValue\n            // Removes everything except numbers and commas (decimals should be indicated with a comma)\n            .replace(NUMBER_CLEAR_REGEX, '')\n            // Calculations need points for decimal indication\n            .replace(',', '.');\n\n        if (sanitizedValue.trim().length > 0) {\n            // Allows numbers, a comma and any number of decimal places\n            if (isDecimalInput && DECIMAL_TEST.test(sanitizedValue)) {\n                const parsedNumber = parseFloatAndRound({ stringValue: sanitizedValue });\n\n                if (parsedNumber > maxNumber) {\n                    return;\n                }\n\n                setStringValue(sanitizedValue.replace('.', ','));\n\n                return;\n            }\n\n            // Allows numbers, a comma and 2 numbers of decimal places\n            if (isMoneyInput && MONEY_TEST.test(sanitizedValue)) {\n                const parsedNumber = parseFloatAndRound({\n                    stringValue: sanitizedValue,\n                    decimals: 2,\n                });\n\n                if (parsedNumber > maxNumber) {\n                    return;\n                }\n\n                setStringValue(sanitizedValue.replace('.', ','));\n\n                return;\n            }\n\n            // Allows numbers but excludes numbers with leading 0\n            if (INTEGER_TEST.test(sanitizedValue)) {\n                const parsedNumber = Number(sanitizedValue);\n\n                if (parsedNumber > maxNumber) {\n                    return;\n                }\n\n                setStringValue(sanitizedValue);\n            }\n        } else {\n            setStringValue('');\n        }\n    };\n\n    const onBlur = () => {\n        const sanitizedValue = stringValue.length === 0 ? '0' : stringValue;\n        const parsedValue = parseFloatAndRound({ stringValue: sanitizedValue });\n\n        setStringValue(\n            stringValue.length === 0\n                ? ''\n                : formateNumber({\n                      number: parsedValue,\n                  })\n        );\n\n        onNumberChange(parsedValue === 0 ? null : parsedValue);\n    };\n\n    const onFocus = () => {\n        setStringValue(stringValue.replaceAll('.', ''));\n    };\n\n    useEffect(() => {\n        handleChange(number);\n    }, [number]);\n\n    return (\n        <Input\n            onChange={onChange}\n            value={stringValue}\n            placeholder={placeholder}\n            onBlur={onBlur}\n            onFocus={onFocus}\n        />\n    );\n};\n\nNumberInput.displayName = 'NumberInput';\n\nexport default NumberInput;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AAAmE,SAAAE,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAV,wBAAAM,GAAA,EAAAI,WAAA,SAAAA,WAAA,IAAAJ,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAQ,KAAA,GAAAL,wBAAA,CAAAC,WAAA,OAAAI,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAT,GAAA,YAAAQ,KAAA,CAAAE,GAAA,CAAAV,GAAA,SAAAW,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAhB,GAAA,QAAAgB,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAnB,GAAA,EAAAgB,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAf,GAAA,EAAAgB,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAhB,GAAA,CAAAgB,GAAA,SAAAL,MAAA,CAAAT,OAAA,GAAAF,GAAA,MAAAQ,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAArB,GAAA,EAAAW,MAAA,YAAAA,MAAA;AA8BnE,MAAMW,WAAiC,GAAGC,IAAA,IAOpC;EAAA,IAPqC;IACvCC,cAAc;IACdC,YAAY;IACZC,SAAS,GAAGC,QAAQ;IACpBC,MAAM;IACNC,WAAW;IACXC;EACJ,CAAC,GAAAP,IAAA;EACG,MAAM,CAACQ,WAAW,EAAEC,cAAc,CAAC,GAAG,IAAAC,eAAQ,EAAS,EAAE,CAAC;EAE1D,MAAMC,YAAY,GAAG,SAAAA,CAAA,EAAoC;IAAA,IAAnCC,QAAuB,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,IAAI;IAChD,IAAI,OAAOD,QAAQ,KAAK,QAAQ,EAAE;MAC9BH,cAAc,CAAC,EAAE,CAAC;MAElB;IACJ;IAEA,MAAMO,WAAW,GAAG,IAAAC,2BAAkB,EAAC;MAAET,WAAW,EAAEI,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAEM,QAAQ,CAAC;IAAE,CAAC,CAAC;IAE7ET,cAAc,CAAC,IAAAU,sBAAa,EAAC;MAAEd,MAAM,EAAEW;IAAY,CAAC,CAAC,CAAC;EAC1D,CAAC;EAED,MAAMI,QAAQ,GAAIC,KAAoC,IAAK;IACvD,MAAMT,QAAQ,GAAGS,KAAK,CAACC,MAAM,CAACC,KAAK;IAEnC,MAAMC,cAAc,GAAGZ;IACnB;IAAA,CACCa,OAAO,CAACC,0BAAkB,EAAE,EAAE;IAC/B;IAAA,CACCD,OAAO,CAAC,GAAG,EAAE,GAAG,CAAC;IAEtB,IAAID,cAAc,CAACG,IAAI,CAAC,CAAC,CAACb,MAAM,GAAG,CAAC,EAAE;MAClC;MACA,IAAIb,cAAc,IAAI2B,oBAAY,CAACC,IAAI,CAACL,cAAc,CAAC,EAAE;QACrD,MAAMM,YAAY,GAAG,IAAAb,2BAAkB,EAAC;UAAET,WAAW,EAAEgB;QAAe,CAAC,CAAC;QAExE,IAAIM,YAAY,GAAG3B,SAAS,EAAE;UAC1B;QACJ;QAEAM,cAAc,CAACe,cAAc,CAACC,OAAO,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;QAEhD;MACJ;;MAEA;MACA,IAAIvB,YAAY,IAAI6B,kBAAU,CAACF,IAAI,CAACL,cAAc,CAAC,EAAE;QACjD,MAAMM,YAAY,GAAG,IAAAb,2BAAkB,EAAC;UACpCT,WAAW,EAAEgB,cAAc;UAC3BQ,QAAQ,EAAE;QACd,CAAC,CAAC;QAEF,IAAIF,YAAY,GAAG3B,SAAS,EAAE;UAC1B;QACJ;QAEAM,cAAc,CAACe,cAAc,CAACC,OAAO,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;QAEhD;MACJ;;MAEA;MACA,IAAIQ,oBAAY,CAACJ,IAAI,CAACL,cAAc,CAAC,EAAE;QACnC,MAAMM,YAAY,GAAGI,MAAM,CAACV,cAAc,CAAC;QAE3C,IAAIM,YAAY,GAAG3B,SAAS,EAAE;UAC1B;QACJ;QAEAM,cAAc,CAACe,cAAc,CAAC;MAClC;IACJ,CAAC,MAAM;MACHf,cAAc,CAAC,EAAE,CAAC;IACtB;EACJ,CAAC;EAED,MAAM0B,MAAM,GAAGA,CAAA,KAAM;IACjB,MAAMX,cAAc,GAAGhB,WAAW,CAACM,MAAM,KAAK,CAAC,GAAG,GAAG,GAAGN,WAAW;IACnE,MAAMQ,WAAW,GAAG,IAAAC,2BAAkB,EAAC;MAAET,WAAW,EAAEgB;IAAe,CAAC,CAAC;IAEvEf,cAAc,CACVD,WAAW,CAACM,MAAM,KAAK,CAAC,GAClB,EAAE,GACF,IAAAK,sBAAa,EAAC;MACVd,MAAM,EAAEW;IACZ,CAAC,CACX,CAAC;IAEDT,cAAc,CAACS,WAAW,KAAK,CAAC,GAAG,IAAI,GAAGA,WAAW,CAAC;EAC1D,CAAC;EAED,MAAMoB,OAAO,GAAGA,CAAA,KAAM;IAClB3B,cAAc,CAACD,WAAW,CAAC6B,UAAU,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;EACnD,CAAC;EAED,IAAAC,gBAAS,EAAC,MAAM;IACZ3B,YAAY,CAACN,MAAM,CAAC;EACxB,CAAC,EAAE,CAACA,MAAM,CAAC,CAAC;EAEZ,oBACInC,MAAA,CAAAS,OAAA,CAAA4D,aAAA,CAAClE,MAAA,CAAAM,OAAK;IACFyC,QAAQ,EAAEA,QAAS;IACnBG,KAAK,EAAEf,WAAY;IACnBF,WAAW,EAAEA,WAAY;IACzB6B,MAAM,EAAEA,MAAO;IACfC,OAAO,EAAEA;EAAQ,CACpB,CAAC;AAEV,CAAC;AAEDrC,WAAW,CAACyC,WAAW,GAAG,aAAa;AAAC,IAAAC,QAAA,GAEzB1C,WAAW;AAAA2C,OAAA,CAAA/D,OAAA,GAAA8D,QAAA"}
+{"version":3,"file":"NumberInput.js","names":["_react","_interopRequireWildcard","require","_Input","_interopRequireDefault","_number","_number2","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","NumberInput","_ref","isDecimalInput","isMoneyInput","maxNumber","Infinity","number","placeholder","onNumberChange","isDisabled","stringValue","setStringValue","useState","handleChange","newValue","arguments","length","undefined","parsedValue","parseFloatAndRound","toString","formateNumber","onChange","event","target","value","sanitizedValue","replace","NUMBER_CLEAR_REGEX","trim","DECIMAL_TEST","test","parsedNumber","MONEY_TEST","decimals","INTEGER_TEST","Number","onBlur","onFocus","replaceAll","useEffect","createElement","displayName","_default","exports"],"sources":["../../../src/components/number-input/NumberInput.tsx"],"sourcesContent":["import React, { ChangeEvent, FC, useEffect, useState } from 'react';\nimport Input from '../input/Input';\nimport { DECIMAL_TEST, INTEGER_TEST, MONEY_TEST, NUMBER_CLEAR_REGEX } from './constants/number';\nimport { formateNumber, parseFloatAndRound } from './utils/number';\n\nexport type NumberInputProps = {\n    /**\n     * Whether the user can add decimal places. Enables the user to input a zero as first number\n     */\n    isDecimalInput?: boolean;\n    /**\n     * Applies rules for money input.\n     * Rules: only two decimal places, one leading zero\n     */\n    isMoneyInput?: boolean;\n    /**\n     * Limits the number to this value\n     */\n    maxNumber?: number;\n    /**\n     * The number that should be displayed formatted in the input field. NOTE: A zero as number is not allowed\n     */\n    number: number | null;\n    /**\n     * The placeholder that should be in the input\n     */\n    placeholder?: string;\n    /**\n     * Callback function that is called when the input gets out of focus\n     */\n    onNumberChange: (newNumber: number | null) => void;\n    /**\n     * Whether the input is disabled\n     */\n    isDisabled?: boolean;\n};\n\nconst NumberInput: FC<NumberInputProps> = ({\n    isDecimalInput,\n    isMoneyInput,\n    maxNumber = Infinity,\n    number,\n    placeholder,\n    onNumberChange,\n    isDisabled\n}) => {\n    const [stringValue, setStringValue] = useState<string>('');\n\n    const handleChange = (newValue: number | null = null) => {\n        if (typeof newValue !== 'number') {\n            setStringValue('');\n\n            return;\n        }\n\n        const parsedValue = parseFloatAndRound({ stringValue: newValue?.toString() });\n\n        setStringValue(formateNumber({ number: parsedValue }));\n    };\n\n    const onChange = (event: ChangeEvent<HTMLInputElement>) => {\n        const newValue = event.target.value;\n\n        const sanitizedValue = newValue\n            // Removes everything except numbers and commas (decimals should be indicated with a comma)\n            .replace(NUMBER_CLEAR_REGEX, '')\n            // Calculations need points for decimal indication\n            .replace(',', '.');\n\n        if (sanitizedValue.trim().length > 0) {\n            // Allows numbers, a comma and any number of decimal places\n            if (isDecimalInput && DECIMAL_TEST.test(sanitizedValue)) {\n                const parsedNumber = parseFloatAndRound({ stringValue: sanitizedValue });\n\n                if (parsedNumber > maxNumber) {\n                    return;\n                }\n\n                setStringValue(sanitizedValue.replace('.', ','));\n\n                return;\n            }\n\n            // Allows numbers, a comma and 2 numbers of decimal places\n            if (isMoneyInput && MONEY_TEST.test(sanitizedValue)) {\n                const parsedNumber = parseFloatAndRound({\n                    stringValue: sanitizedValue,\n                    decimals: 2,\n                });\n\n                if (parsedNumber > maxNumber) {\n                    return;\n                }\n\n                setStringValue(sanitizedValue.replace('.', ','));\n\n                return;\n            }\n\n            // Allows numbers but excludes numbers with leading 0\n            if (INTEGER_TEST.test(sanitizedValue)) {\n                const parsedNumber = Number(sanitizedValue);\n\n                if (parsedNumber > maxNumber) {\n                    return;\n                }\n\n                setStringValue(sanitizedValue);\n            }\n        } else {\n            setStringValue('');\n        }\n    };\n\n    const onBlur = () => {\n        const sanitizedValue = stringValue.length === 0 ? '0' : stringValue;\n        const parsedValue = parseFloatAndRound({ stringValue: sanitizedValue });\n\n        setStringValue(\n            stringValue.length === 0\n                ? ''\n                : formateNumber({\n                      number: parsedValue,\n                  })\n        );\n\n        onNumberChange(parsedValue === 0 ? null : parsedValue);\n    };\n\n    const onFocus = () => {\n        setStringValue(stringValue.replaceAll('.', ''));\n    };\n\n    useEffect(() => {\n        handleChange(number);\n    }, [number]);\n\n    return (\n        <Input\n            onChange={onChange}\n            value={stringValue}\n            placeholder={placeholder}\n            onBlur={onBlur}\n            onFocus={onFocus}\n            isDisabled={isDisabled}\n        />\n    );\n};\n\nNumberInput.displayName = 'NumberInput';\n\nexport default NumberInput;\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@chayns-components/core",
-    "version": "5.0.0-beta.232",
+    "version": "5.0.0-beta.236",
     "description": "A set of beautiful React components for developing your own applications with chayns.",
     "keywords": [
         "chayns",
@@ -65,5 +65,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "c0512a6aa56c6112e8f5eb2b208bd80fbe55c2ff"
+    "gitHead": "d7c9521fac0d5210613415cf1eeb819fc5b57b64"
 }