uangcermat-web-toolkit-v2 0.1.39 → 0.1.40
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/build/src/components/DatePicker/BaseDatePicker.d.ts +1 -1
- package/build/src/components/DatePicker/BaseDatePicker.js +1 -1
- package/build/src/components/DatePicker/BaseDatePicker.js.map +1 -1
- package/build/src/components/DatePicker/BaseDatePicker.type.d.ts +2 -0
- package/build/src/components/TimePicker/BaseTimePicker.d.ts +1 -1
- package/build/src/components/TimePicker/BaseTimePicker.js +1 -1
- package/build/src/components/TimePicker/BaseTimePicker.js.map +1 -1
- package/build/src/components/TimePicker/BaseTimePicker.type.d.ts +3 -0
- package/build/src/utils/dateFormatter.d.ts +1 -1
- package/build/src/utils/dateFormatter.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { BaseDatePickerInterface } from './BaseDatePicker.type';
|
|
2
|
-
declare const BaseDatePicker: ({ value, format, position, onChange, onSelect, isError, errorMessage, errorMessageStyles, helperMessage, helperMessageStyles, isDisabled, containerStyles, activeContainerStyles, placeholder, placeholderStyles, valueStyles, isCleanable, onClean, onOpen, icon, iconStyles, hideHours, hideMinutes, hideSeconds, language, label, labelStyles, variant, isHideRangesOption, customRangesOption, isRequired, labelRequired, labelRequiredStyles, containerRequiredStyles, ...props }: BaseDatePickerInterface) => import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
declare const BaseDatePicker: ({ value, format, position, onChange, onSelect, isError, errorMessage, errorMessageStyles, helperMessage, helperMessageStyles, isDisabled, containerStyles, activeContainerStyles, placeholder, placeholderStyles, valueStyles, isCleanable, onClean, onOpen, icon, iconStyles, hideHours, hideMinutes, hideSeconds, language, label, labelStyles, variant, isHideRangesOption, customRangesOption, isRequired, labelRequired, labelRequiredStyles, containerRequiredStyles, isShowButtonToday, isShowButtonYesterday, ...props }: BaseDatePickerInterface) => import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
export default BaseDatePicker;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("../../../_virtual/_tslib.js"),
|
|
1
|
+
"use strict";var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),a=require("../../../node_modules/classnames/index.js"),l=require("react"),s=require("../../constants/dateLocale.js"),r=require("../../utils/dateFormatter.js");require("../Badge/Badge.js");var i=require("../Text/BaseText.js");require("../Text/Text.js");var n=require("../Badge/BaseBadgeRequired.js"),o=require("../Icon/Icon.js"),d=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),u=require("../../../node_modules/rsuite/esm/DatePicker/DatePicker.js"),c=require("../../../node_modules/date-fns/esm/isBefore/index.js"),m=require("../../../node_modules/date-fns/esm/isAfter/index.js"),b=require("../../../node_modules/date-fns/esm/addDays/index.js");module.exports=g=>{var{value:x,format:f,position:h,onChange:p,onSelect:j,isError:S,errorMessage:y,errorMessageStyles:v,helperMessage:q,helperMessageStyles:w,isDisabled:D,containerStyles:M,activeContainerStyles:k,placeholder:R,placeholderStyles:O,valueStyles:N,isCleanable:B,onClean:C,onOpen:_,icon:E,iconStyles:T,hideHours:G,hideMinutes:H,hideSeconds:P,language:Y="english",label:A,labelStyles:F,variant:I="box",isHideRangesOption:L,customRangesOption:z,isRequired:K,labelRequired:$,labelRequiredStyles:J,containerRequiredStyles:Q,isShowButtonToday:U=!0,isShowButtonYesterday:V=!0}=g,W=e.__rest(g,["value","format","position","onChange","onSelect","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isDisabled","containerStyles","activeContainerStyles","placeholder","placeholderStyles","valueStyles","isCleanable","onClean","onOpen","icon","iconStyles","hideHours","hideMinutes","hideSeconds","language","label","labelStyles","variant","isHideRangesOption","customRangesOption","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","isShowButtonToday","isShowButtonYesterday"]);const[X,Z]=l.useState(!1),ee={english:"en",bahasa:"id"};return l.useEffect((()=>{x||Z(!1)}),[x]),t.jsxs("div",Object.assign({className:"relative flex flex-col gap-y-1"},{children:[(X||D)&&t.jsx("div",{className:"absolute top-0 left-0 w-full h-full gap-y-1 z-20 cursor-pointer"}),t.jsxs("div",Object.assign({className:"flex flex-row items-end gap-x-1"},{children:[!!A&&t.jsx(i.default,{label:A,className:d.twMerge("font-normal text-dark-gumbo text-[10px]",F)}),K&&t.jsx(n,{labelRequired:$,labelRequiredStyles:J,containerRequiredStyles:Q})]})),t.jsx(u,{value:x,locale:s.dateLocale[Y],oneTap:W.isOneTap,onChange:e=>{Z(!1),p(e)},onSelect:j,onClose:()=>Z(!1),onOk:()=>Z(!1),onBlur:()=>{null==C||C(void 0),Z(!1)},onOpen:_,placement:{"top-start":"topStart","top-center":"top","top-end":"topEnd","right-start":"rightStart","right-center":"right","right-end":"rightEnd","bottom-start":"bottomStart","bottom-center":"bottom","bottom-end":"bottomEnd","left-start":"leftStart","left-center":"left","left-end":"leftEnd"}[h],shouldDisableDate:e=>W.isDisableBefore?c(e,new Date):W.minDate||W.maxDate?c(e,W.minDate?new Date(W.minDate):void 0)||m(e,W.maxDate?new Date(W.maxDate):void 0):void 0,editable:!1,cleanable:B,ranges:L?[]:null!=z?z:[U&&{label:"english"===Y?"Today":"Hari ini",value:new Date,placement:"bottom"},V&&{label:"english"===Y?"Yesterday":"Kemarin",value:b(new Date,-1),placement:"bottom"}],hideHours:G,hideMinutes:H,hideSeconds:P,toggleAs:()=>t.jsxs("div",Object.assign({className:d.twMerge(a.default(d.twMerge("flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid w-full cursor-pointer",M),"line"===I&&"border-b border-t-0 border-x-0 rounded-none",X&&k?k:X?"border-blue-buttonBlue":void 0,D&&"border-dark-bermudaGray bg-light-whiteSmoke",S&&"border-red-fireEngineRed")),onClick:()=>{D||Z(!X)}},{children:[t.jsxs("div",Object.assign({className:"flex flex-1"},{children:[!!R&&!x&&t.jsx("div",Object.assign({className:"flex flex-1"},{children:t.jsx(i.default,{label:R,variant:"small",className:d.twMerge(a.default("font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]"),O)})})),!!x&&t.jsx("div",Object.assign({className:"flex flex-1"},{children:t.jsx(i.default,{label:r.dateFormatter(x,f,{locale:ee[Y]}),variant:"small",className:d.twMerge(a.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 leading-[14px]"),N)})}))]})),B&&!!x&&t.jsx("div",Object.assign({className:"cursor-pointer h-3 w-3 flex items-center justify-center -mr-",onClick:e=>{e.stopPropagation(),Z(!1),null==C||C(void 0)}},{children:t.jsx(o,{name:"close",className:"fill-dark-bermudaGray w-3 h-3"})})),t.jsx(o,{name:E||"caretDate",className:d.twMerge(a.default("fill-dark-bermudaGray w-3 h-3",`${D&&"fill-dark-bermudaGray"}`),T)})]}))}),q&&!S&&t.jsx(i.default,{label:q,className:d.twMerge("font-normal text-dark-bermudaGray text-[10px] inline-block",w)}),S&&!!y&&t.jsx(i.default,{label:y,className:d.twMerge("font-normal text-red-fireEngineRed text-[10px] inline-block",v)})]}))};
|
|
2
2
|
//# sourceMappingURL=BaseDatePicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseDatePicker.js","sources":["../../../../src/components/DatePicker/BaseDatePicker.tsx"],"sourcesContent":["/* eslint-disable sonarjs/no-duplicate-string */\nimport classNames from 'classnames';\nimport * as dateFns from 'date-fns';\nimport { useEffect, useState } from 'react';\nimport { DatePicker as DatePickerRsuite } from 'rsuite';\nimport { TypeAttributes } from 'rsuite/esm/@types/common';\nimport { twMerge } from 'tailwind-merge';\n\nimport { dateLocale } from '../../constants/dateLocale';\nimport { dateFormatter } from '../../utils/dateFormatter';\nimport { BaseBadgeRequired } from '../Badge';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport {\n BaseDatePickerInterface,\n DatePickerLocalType,\n PickerPosition\n} from './BaseDatePicker.type';\n\nconst BaseDatePicker = ({\n value,\n format,\n position,\n onChange,\n onSelect,\n isError,\n errorMessage,\n errorMessageStyles,\n helperMessage,\n helperMessageStyles,\n isDisabled,\n containerStyles,\n activeContainerStyles,\n placeholder,\n placeholderStyles,\n valueStyles,\n isCleanable,\n onClean,\n onOpen,\n icon,\n iconStyles,\n hideHours,\n hideMinutes,\n hideSeconds,\n language = 'english',\n label,\n labelStyles,\n variant = 'box',\n isHideRangesOption,\n customRangesOption,\n isRequired,\n labelRequired,\n labelRequiredStyles,\n containerRequiredStyles,\n ...props\n}: // eslint-disable-next-line sonarjs/cognitive-complexity\nBaseDatePickerInterface) => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const PlacementMapper: Record<PickerPosition, TypeAttributes.Placement> = {\n 'top-start': 'topStart',\n 'top-center': 'top',\n 'top-end': 'topEnd',\n 'right-start': 'rightStart',\n 'right-center': 'right',\n 'right-end': 'rightEnd',\n 'bottom-start': 'bottomStart',\n 'bottom-center': 'bottom',\n 'bottom-end': 'bottomEnd',\n 'left-start': 'leftStart',\n 'left-center': 'left',\n 'left-end': 'leftEnd'\n };\n\n const LanguageMapper: Record<DatePickerLocalType, 'en' | 'id'> = {\n english: 'en',\n bahasa: 'id'\n };\n\n useEffect(() => {\n if (!value) {\n setIsOpen(false);\n }\n }, [value]);\n\n return (\n <div className='relative flex flex-col gap-y-1'>\n {(isOpen || isDisabled) && (\n <div className='absolute top-0 left-0 w-full h-full gap-y-1 z-20 cursor-pointer'></div>\n )}\n <div className='flex flex-row items-end gap-x-1'>\n {!!label && (\n <BaseText\n label={label}\n className={twMerge('font-normal text-dark-gumbo text-[10px]', labelStyles)}\n />\n )}\n {isRequired && (\n <BaseBadgeRequired\n labelRequired={labelRequired}\n labelRequiredStyles={labelRequiredStyles}\n containerRequiredStyles={containerRequiredStyles}\n />\n )}\n </div>\n <DatePickerRsuite\n value={value}\n locale={dateLocale[language]}\n oneTap={props.isOneTap}\n onChange={(date: Date) => {\n setIsOpen(false);\n onChange(date);\n }}\n onSelect={onSelect}\n onClose={() => setIsOpen(false)}\n onOk={() => setIsOpen(false)}\n onBlur={() => {\n onClean?.(undefined);\n setIsOpen(false);\n }}\n onOpen={onOpen}\n placement={PlacementMapper[position]}\n shouldDisableDate={(date: Date) =>\n props.isDisableBefore\n ? dateFns.isBefore(date, new Date())\n : props.minDate || props.maxDate\n ? dateFns.isBefore(date, props.minDate ? new Date(props.minDate) : undefined) ||\n dateFns.isAfter(date, props.maxDate ? new Date(props.maxDate) : undefined)\n : undefined\n }\n editable={false}\n cleanable={isCleanable}\n ranges={\n isHideRangesOption\n ? []\n : customRangesOption ?? [\n {\n label: language === 'english' ? 'Today' : 'Hari ini',\n value: new Date(),\n placement: 'bottom'\n },\n {\n label: language === 'english' ? 'Yesterday' : 'Kemarin',\n value: dateFns.addDays(new Date(), -1),\n placement: 'bottom'\n }\n ]\n }\n hideHours={hideHours}\n hideMinutes={hideMinutes}\n hideSeconds={hideSeconds}\n toggleAs={() => (\n <div\n className={twMerge(\n classNames(\n twMerge(\n 'flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid w-full cursor-pointer',\n containerStyles\n ),\n variant === 'line' && 'border-b border-t-0 border-x-0 rounded-none',\n isOpen && activeContainerStyles\n ? activeContainerStyles\n : isOpen\n ? 'border-blue-buttonBlue'\n : undefined,\n isDisabled && 'border-dark-bermudaGray bg-light-whiteSmoke',\n isError && 'border-red-fireEngineRed'\n )\n )}\n onClick={() => {\n if (!isDisabled) setIsOpen(!isOpen);\n }}\n >\n <div className='flex flex-1'>\n {!!placeholder && !value && (\n <div className='flex flex-1'>\n <BaseText\n label={placeholder}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]'\n ),\n placeholderStyles\n )}\n />\n </div>\n )}\n\n {!!value && (\n <div className='flex flex-1'>\n <BaseText\n label={dateFormatter(value, format, { locale: LanguageMapper[language] })}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 leading-[14px]'\n ),\n valueStyles\n )}\n />\n </div>\n )}\n </div>\n\n {isCleanable && !!value && (\n <div\n className='cursor-pointer h-3 w-3 flex items-center justify-center -mr-'\n onClick={(e) => {\n e.stopPropagation();\n\n setIsOpen(false);\n onClean?.(undefined);\n }}\n >\n <Icon name='close' className='fill-dark-bermudaGray w-3 h-3' />\n </div>\n )}\n <Icon\n name={icon || 'caretDate'}\n className={twMerge(\n classNames(\n 'fill-dark-bermudaGray w-3 h-3',\n `${isDisabled && 'fill-dark-bermudaGray'}`\n ),\n iconStyles\n )}\n />\n </div>\n )}\n />\n\n {helperMessage && !isError && (\n <BaseText\n label={helperMessage}\n className={twMerge(\n 'font-normal text-dark-bermudaGray text-[10px] inline-block',\n helperMessageStyles\n )}\n />\n )}\n\n {isError && !!errorMessage && (\n <BaseText\n label={errorMessage}\n className={twMerge(\n 'font-normal text-red-fireEngineRed text-[10px] inline-block',\n errorMessageStyles\n )}\n />\n )}\n </div>\n );\n};\n\nexport default BaseDatePicker;\n"],"names":["_a","value","format","position","onChange","onSelect","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isDisabled","containerStyles","activeContainerStyles","placeholder","placeholderStyles","valueStyles","isCleanable","onClean","onOpen","icon","iconStyles","hideHours","hideMinutes","hideSeconds","language","label","labelStyles","variant","isHideRangesOption","customRangesOption","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","props","__rest","isOpen","setIsOpen","useState","LanguageMapper","english","bahasa","useEffect","_jsxs","className","children","_jsx","Object","assign","jsx","BaseText","twMerge","BaseBadgeRequired","DatePickerRsuite","locale","dateLocale","oneTap","isOneTap","date","onClose","onOk","onBlur","undefined","placement","shouldDisableDate","isDisableBefore","dateFns.isBefore","Date","minDate","maxDate","dateFns.isAfter","editable","cleanable","ranges","dateFns.addDays","toggleAs","classNames","onClick","dateFormatter","e","stopPropagation","Icon","name"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseDatePicker.js","sources":["../../../../src/components/DatePicker/BaseDatePicker.tsx"],"sourcesContent":["/* eslint-disable sonarjs/no-duplicate-string */\nimport classNames from 'classnames';\nimport * as dateFns from 'date-fns';\nimport { useEffect, useState } from 'react';\nimport { DatePicker as DatePickerRsuite } from 'rsuite';\nimport { TypeAttributes } from 'rsuite/esm/@types/common';\nimport { twMerge } from 'tailwind-merge';\n\nimport { dateLocale } from '../../constants/dateLocale';\nimport { dateFormatter } from '../../utils/dateFormatter';\nimport { BaseBadgeRequired } from '../Badge';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport {\n BaseDatePickerInterface,\n DatePickerLocalType,\n PickerPosition\n} from './BaseDatePicker.type';\n\nconst BaseDatePicker = ({\n value,\n format,\n position,\n onChange,\n onSelect,\n isError,\n errorMessage,\n errorMessageStyles,\n helperMessage,\n helperMessageStyles,\n isDisabled,\n containerStyles,\n activeContainerStyles,\n placeholder,\n placeholderStyles,\n valueStyles,\n isCleanable,\n onClean,\n onOpen,\n icon,\n iconStyles,\n hideHours,\n hideMinutes,\n hideSeconds,\n language = 'english',\n label,\n labelStyles,\n variant = 'box',\n isHideRangesOption,\n customRangesOption,\n isRequired,\n labelRequired,\n labelRequiredStyles,\n containerRequiredStyles,\n isShowButtonToday = true,\n isShowButtonYesterday = true,\n ...props\n}: // eslint-disable-next-line sonarjs/cognitive-complexity\nBaseDatePickerInterface) => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const PlacementMapper: Record<PickerPosition, TypeAttributes.Placement> = {\n 'top-start': 'topStart',\n 'top-center': 'top',\n 'top-end': 'topEnd',\n 'right-start': 'rightStart',\n 'right-center': 'right',\n 'right-end': 'rightEnd',\n 'bottom-start': 'bottomStart',\n 'bottom-center': 'bottom',\n 'bottom-end': 'bottomEnd',\n 'left-start': 'leftStart',\n 'left-center': 'left',\n 'left-end': 'leftEnd'\n };\n\n const LanguageMapper: Record<DatePickerLocalType, 'en' | 'id'> = {\n english: 'en',\n bahasa: 'id'\n };\n\n useEffect(() => {\n if (!value) {\n setIsOpen(false);\n }\n }, [value]);\n\n return (\n <div className='relative flex flex-col gap-y-1'>\n {(isOpen || isDisabled) && (\n <div className='absolute top-0 left-0 w-full h-full gap-y-1 z-20 cursor-pointer'></div>\n )}\n <div className='flex flex-row items-end gap-x-1'>\n {!!label && (\n <BaseText\n label={label}\n className={twMerge('font-normal text-dark-gumbo text-[10px]', labelStyles)}\n />\n )}\n {isRequired && (\n <BaseBadgeRequired\n labelRequired={labelRequired}\n labelRequiredStyles={labelRequiredStyles}\n containerRequiredStyles={containerRequiredStyles}\n />\n )}\n </div>\n <DatePickerRsuite\n value={value}\n locale={dateLocale[language]}\n oneTap={props.isOneTap}\n onChange={(date: Date) => {\n setIsOpen(false);\n onChange(date);\n }}\n onSelect={onSelect}\n onClose={() => setIsOpen(false)}\n onOk={() => setIsOpen(false)}\n onBlur={() => {\n onClean?.(undefined);\n setIsOpen(false);\n }}\n onOpen={onOpen}\n placement={PlacementMapper[position]}\n shouldDisableDate={(date: Date) =>\n props.isDisableBefore\n ? dateFns.isBefore(date, new Date())\n : props.minDate || props.maxDate\n ? dateFns.isBefore(date, props.minDate ? new Date(props.minDate) : undefined) ||\n dateFns.isAfter(date, props.maxDate ? new Date(props.maxDate) : undefined)\n : undefined\n }\n editable={false}\n cleanable={isCleanable}\n ranges={\n isHideRangesOption\n ? []\n : customRangesOption ?? [\n isShowButtonToday && {\n label: language === 'english' ? 'Today' : 'Hari ini',\n value: new Date(),\n placement: 'bottom'\n },\n isShowButtonYesterday && {\n label: language === 'english' ? 'Yesterday' : 'Kemarin',\n value: dateFns.addDays(new Date(), -1),\n placement: 'bottom'\n }\n ]\n }\n hideHours={hideHours}\n hideMinutes={hideMinutes}\n hideSeconds={hideSeconds}\n toggleAs={() => (\n <div\n className={twMerge(\n classNames(\n twMerge(\n 'flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid w-full cursor-pointer',\n containerStyles\n ),\n variant === 'line' && 'border-b border-t-0 border-x-0 rounded-none',\n isOpen && activeContainerStyles\n ? activeContainerStyles\n : isOpen\n ? 'border-blue-buttonBlue'\n : undefined,\n isDisabled && 'border-dark-bermudaGray bg-light-whiteSmoke',\n isError && 'border-red-fireEngineRed'\n )\n )}\n onClick={() => {\n if (!isDisabled) setIsOpen(!isOpen);\n }}\n >\n <div className='flex flex-1'>\n {!!placeholder && !value && (\n <div className='flex flex-1'>\n <BaseText\n label={placeholder}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]'\n ),\n placeholderStyles\n )}\n />\n </div>\n )}\n\n {!!value && (\n <div className='flex flex-1'>\n <BaseText\n label={dateFormatter(value, format, { locale: LanguageMapper[language] })}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 leading-[14px]'\n ),\n valueStyles\n )}\n />\n </div>\n )}\n </div>\n\n {isCleanable && !!value && (\n <div\n className='cursor-pointer h-3 w-3 flex items-center justify-center -mr-'\n onClick={(e) => {\n e.stopPropagation();\n\n setIsOpen(false);\n onClean?.(undefined);\n }}\n >\n <Icon name='close' className='fill-dark-bermudaGray w-3 h-3' />\n </div>\n )}\n <Icon\n name={icon || 'caretDate'}\n className={twMerge(\n classNames(\n 'fill-dark-bermudaGray w-3 h-3',\n `${isDisabled && 'fill-dark-bermudaGray'}`\n ),\n iconStyles\n )}\n />\n </div>\n )}\n />\n\n {helperMessage && !isError && (\n <BaseText\n label={helperMessage}\n className={twMerge(\n 'font-normal text-dark-bermudaGray text-[10px] inline-block',\n helperMessageStyles\n )}\n />\n )}\n\n {isError && !!errorMessage && (\n <BaseText\n label={errorMessage}\n className={twMerge(\n 'font-normal text-red-fireEngineRed text-[10px] inline-block',\n errorMessageStyles\n )}\n />\n )}\n </div>\n );\n};\n\nexport default BaseDatePicker;\n"],"names":["_a","value","format","position","onChange","onSelect","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isDisabled","containerStyles","activeContainerStyles","placeholder","placeholderStyles","valueStyles","isCleanable","onClean","onOpen","icon","iconStyles","hideHours","hideMinutes","hideSeconds","language","label","labelStyles","variant","isHideRangesOption","customRangesOption","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","isShowButtonToday","isShowButtonYesterday","props","__rest","isOpen","setIsOpen","useState","LanguageMapper","english","bahasa","useEffect","_jsxs","className","children","_jsx","Object","assign","jsx","BaseText","twMerge","BaseBadgeRequired","DatePickerRsuite","locale","dateLocale","oneTap","isOneTap","date","onClose","onOk","onBlur","undefined","placement","shouldDisableDate","isDisableBefore","dateFns.isBefore","Date","minDate","maxDate","dateFns.isAfter","editable","cleanable","ranges","dateFns.addDays","toggleAs","classNames","onClick","dateFormatter","e","stopPropagation","Icon","name"],"mappings":"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"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { BaseTimePickerInterface } from './BaseTimePicker.type';
|
|
2
|
-
declare const BaseTimePicker: ({ id, value, position, isHideRangesOption, onChange, onSelect, isError, errorMessage, errorMessageStyles, helperMessage, helperMessageStyles, isDisabled, containerStyles, activeContainerStyles, placeholder, placeholderStyles, valueStyles, isCleanable, onClean, onOpen, icon, iconStyles, hideHours, hideMinutes, hideSeconds, language, label, labelStyles, variant, isRequired, labelRequired, labelRequiredStyles, containerRequiredStyles, ...props }: BaseTimePickerInterface) => import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
declare const BaseTimePicker: ({ id, value, position, isHideRangesOption, onChange, onSelect, isError, errorMessage, errorMessageStyles, helperMessage, helperMessageStyles, isDisabled, containerStyles, activeContainerStyles, placeholder, placeholderStyles, valueStyles, isCleanable, onClean, onOpen, icon, iconStyles, hideHours, hideMinutes, hideSeconds, language, label, labelStyles, variant, isRequired, labelRequired, labelRequiredStyles, containerRequiredStyles, format, calendarDefaultDate, ...props }: BaseTimePickerInterface) => import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
export default BaseTimePicker;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("../../../_virtual/_tslib.js"),
|
|
1
|
+
"use strict";var e=require("../../../_virtual/_tslib.js"),a=require("react/jsx-runtime"),t=require("../../../node_modules/classnames/index.js"),l=require("react"),r=require("../../constants/dateLocale.js"),s=require("../../utils/dateFormatter.js");require("../Badge/Badge.js");var i=require("../Text/BaseText.js");require("../Text/Text.js");var n=require("../Badge/BaseBadgeRequired.js"),o=require("../Icon/Icon.js"),d=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),u=require("../../../node_modules/rsuite/esm/DatePicker/DatePicker.js"),c=require("../../../node_modules/date-fns/esm/isBefore/index.js"),m=require("../../../node_modules/date-fns/esm/isAfter/index.js");module.exports=b=>{var{id:g,value:x,position:f,isHideRangesOption:h,onChange:p,onSelect:j,isError:S,errorMessage:v,errorMessageStyles:y,helperMessage:q,helperMessageStyles:D,isDisabled:w,containerStyles:M,activeContainerStyles:k,placeholder:R,placeholderStyles:N,valueStyles:O,isCleanable:C,onClean:B,onOpen:E,icon:_,iconStyles:H,hideHours:G,hideMinutes:T,hideSeconds:I,language:P="english",label:A,labelStyles:F,variant:L="box",isRequired:z,labelRequired:$,labelRequiredStyles:J,containerRequiredStyles:K,format:Q="HH:mm",calendarDefaultDate:U}=b,V=e.__rest(b,["id","value","position","isHideRangesOption","onChange","onSelect","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isDisabled","containerStyles","activeContainerStyles","placeholder","placeholderStyles","valueStyles","isCleanable","onClean","onOpen","icon","iconStyles","hideHours","hideMinutes","hideSeconds","language","label","labelStyles","variant","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","format","calendarDefaultDate"]);const W=l.useId(),[X,Y]=l.useState(!1),Z={english:"en",bahasa:"id"};return l.useEffect((()=>{x||Y(!1)}),[x]),a.jsxs("div",Object.assign({className:"relative flex flex-col gap-y-1"},{children:[(X||w)&&a.jsx("div",{className:"absolute top-0 left-0 w-full h-full gap-y-1 z-20 bg-transparent cursor-pointer"}),a.jsxs("div",Object.assign({className:"flex flex-row items-end gap-x-1"},{children:[!!A&&a.jsx(i.default,{label:A,className:d.twMerge("font-normal text-dark-gumbo text-[10px]",F)}),z&&a.jsx(n,{labelRequired:$,labelRequiredStyles:J,containerRequiredStyles:K})]})),a.jsx(u,{calendarDefaultDate:null!=U?U:void 0,format:Q,id:w||!X?void 0:g||W,value:null!=x?x:void 0,locale:r.dateLocale[P],oneTap:V.isOneTap,onChange:e=>{Y(!1),p(e)},onSelect:j,onClose:()=>Y(!1),onOpen:E,onOk:()=>Y(!1),placement:{"top-start":"topStart","top-center":"top","top-end":"topEnd","right-start":"rightStart","right-center":"right","right-end":"rightEnd","bottom-start":"bottomStart","bottom-center":"bottom","bottom-end":"bottomEnd","left-start":"leftStart","left-center":"left","left-end":"leftEnd"}[f],shouldDisableDate:e=>V.isDisableBefore?c(e,new Date):V.minDate||V.maxDate?c(e,V.minDate?new Date(V.minDate):void 0)||m(e,V.maxDate?new Date(V.maxDate):void 0):void 0,editable:!1,ranges:h?[]:void 0,hideHours:G,hideMinutes:T,hideSeconds:I,toggleAs:()=>a.jsxs("div",Object.assign({className:d.twMerge(t.default(d.twMerge("flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid w-full cursor-pointer",M),"line"===L&&"border-b border-t-0 border-x-0 rounded-none",X&&k?k:X?"border-blue-buttonBlue":void 0,w&&"border-dark-bermudaGray bg-light-whiteSmoke",S&&"border-red-fireEngineRed")),onClick:()=>{w||Y(!X)}},{children:[a.jsxs("div",Object.assign({className:"flex flex-1"},{children:[!!R&&!x&&a.jsx("div",Object.assign({className:"flex flex-1"},{children:a.jsx(i.default,{label:R,variant:"small",className:d.twMerge(t.default("font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]"),N)})})),!!x&&a.jsx("div",Object.assign({className:"flex flex-1"},{children:a.jsx(i.default,{label:s.dateFormatter(x,Q,{locale:Z[P]}),variant:"small",className:d.twMerge(t.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 leading-[14px]"),O)})}))]})),C&&!!x&&a.jsx("div",Object.assign({className:"cursor-pointer h-3 w-3 flex items-center justify-center -mr-",onClick:e=>{e.stopPropagation(),Y(!1),null==B||B(void 0)}},{children:a.jsx(o,{name:"close",className:"fill-dark-bermudaGray w-3 h-3"})})),a.jsx(o,{name:_||"caretDate",className:d.twMerge(t.default("fill-dark-bermudaGray w-3 h-3",`${w&&"fill-dark-bermudaGray"}`),H)})]}))}),q&&!S&&a.jsx(i.default,{label:q,className:d.twMerge("font-normal text-dark-bermudaGray text-[10px] inline-block",D)}),S&&!!v&&a.jsx(i.default,{label:v,className:d.twMerge("font-normal text-red-fireEngineRed text-[10px] inline-block",y)})]}))};
|
|
2
2
|
//# sourceMappingURL=BaseTimePicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseTimePicker.js","sources":["../../../../src/components/TimePicker/BaseTimePicker.tsx"],"sourcesContent":["/* eslint-disable sonarjs/no-duplicate-string */\nimport classNames from 'classnames';\nimport * as dateFns from 'date-fns';\nimport { useEffect, useId, useState } from 'react';\nimport { DatePicker as DatePickerRsuite } from 'rsuite';\nimport { TypeAttributes } from 'rsuite/esm/@types/common';\nimport { twMerge } from 'tailwind-merge';\n\nimport { dateLocale } from '../../constants/dateLocale';\nimport { dateFormatter } from '../../utils/dateFormatter';\nimport { BaseBadgeRequired } from '../Badge';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport {\n BaseTimePickerInterface,\n PickerPosition,\n TimePickerLocalType\n} from './BaseTimePicker.type';\n\nconst BaseTimePicker = ({\n id,\n value,\n position,\n isHideRangesOption,\n onChange,\n onSelect,\n isError,\n errorMessage,\n errorMessageStyles,\n helperMessage,\n helperMessageStyles,\n isDisabled,\n containerStyles,\n activeContainerStyles,\n placeholder,\n placeholderStyles,\n valueStyles,\n isCleanable,\n onClean,\n onOpen,\n icon,\n iconStyles,\n hideHours,\n hideMinutes,\n hideSeconds,\n language = 'english',\n label,\n labelStyles,\n variant = 'box',\n isRequired,\n labelRequired,\n labelRequiredStyles,\n containerRequiredStyles,\n ...props\n}: // eslint-disable-next-line sonarjs/cognitive-complexity\nBaseTimePickerInterface) => {\n const defaultId = useId();\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const PlacementMapper: Record<PickerPosition, TypeAttributes.Placement> = {\n 'top-start': 'topStart',\n 'top-center': 'top',\n 'top-end': 'topEnd',\n 'right-start': 'rightStart',\n 'right-center': 'right',\n 'right-end': 'rightEnd',\n 'bottom-start': 'bottomStart',\n 'bottom-center': 'bottom',\n 'bottom-end': 'bottomEnd',\n 'left-start': 'leftStart',\n 'left-center': 'left',\n 'left-end': 'leftEnd'\n };\n\n const LanguageMapper: Record<TimePickerLocalType, 'en' | 'id'> = {\n english: 'en',\n bahasa: 'id'\n };\n\n useEffect(() => {\n if (!value) {\n setIsOpen(false);\n }\n }, [value]);\n\n return (\n <div className='relative flex flex-col gap-y-1'>\n {(isOpen || isDisabled) && (\n <div className='absolute top-0 left-0 w-full h-full gap-y-1 z-20 bg-transparent cursor-pointer'></div>\n )}\n <div className='flex flex-row items-end gap-x-1'>\n {!!label && (\n <BaseText\n label={label}\n className={twMerge('font-normal text-dark-gumbo text-[10px]', labelStyles)}\n />\n )}\n {isRequired && (\n <BaseBadgeRequired\n labelRequired={labelRequired}\n labelRequiredStyles={labelRequiredStyles}\n containerRequiredStyles={containerRequiredStyles}\n />\n )}\n </div>\n <DatePickerRsuite\n format='HH:mm'\n id={isDisabled || !isOpen ? undefined : id || defaultId}\n value={value}\n locale={dateLocale[language]}\n oneTap={props.isOneTap}\n onChange={(date: Date) => {\n setIsOpen(false);\n onChange(date);\n }}\n onSelect={onSelect}\n onClose={() => setIsOpen(false)}\n onOpen={onOpen}\n onOk={() => setIsOpen(false)}\n placement={PlacementMapper[position]}\n shouldDisableDate={(date: Date) =>\n props.isDisableBefore\n ? dateFns.isBefore(date, new Date())\n : props.minDate || props.maxDate\n ? dateFns.isBefore(date, props.minDate ? new Date(props.minDate) : undefined) ||\n dateFns.isAfter(date, props.maxDate ? new Date(props.maxDate) : undefined)\n : undefined\n }\n editable={false}\n ranges={isHideRangesOption ? [] : undefined}\n hideHours={hideHours}\n hideMinutes={hideMinutes}\n hideSeconds={hideSeconds}\n toggleAs={() => (\n <div\n className={twMerge(\n classNames(\n twMerge(\n 'flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid w-full cursor-pointer',\n containerStyles\n ),\n variant === 'line' && 'border-b border-t-0 border-x-0 rounded-none',\n isOpen && activeContainerStyles\n ? activeContainerStyles\n : isOpen\n ? 'border-blue-buttonBlue'\n : undefined,\n isDisabled && 'border-dark-bermudaGray bg-light-whiteSmoke',\n isError && 'border-red-fireEngineRed'\n )\n )}\n onClick={() => {\n if (!isDisabled) setIsOpen(!isOpen);\n }}\n >\n <div className='flex flex-1'>\n {!!placeholder && !value && (\n <div className='flex flex-1'>\n <BaseText\n label={placeholder}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]'\n ),\n placeholderStyles\n )}\n />\n </div>\n )}\n\n {!!value && (\n <div className='flex flex-1'>\n <BaseText\n label={dateFormatter(value, 'HH:mm', {\n locale: LanguageMapper[language]\n })}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 leading-[14px]'\n ),\n valueStyles\n )}\n />\n </div>\n )}\n </div>\n\n {isCleanable && !!value && (\n <div\n className='cursor-pointer h-3 w-3 flex items-center justify-center -mr-'\n onClick={(e) => {\n e.stopPropagation();\n\n setIsOpen(false);\n onClean?.(undefined);\n }}\n >\n <Icon name='close' className='fill-dark-bermudaGray w-3 h-3' />\n </div>\n )}\n <Icon\n name={icon || 'caretDate'}\n className={twMerge(\n classNames(\n 'fill-dark-bermudaGray w-3 h-3',\n `${isDisabled && 'fill-dark-bermudaGray'}`\n ),\n iconStyles\n )}\n />\n </div>\n )}\n />\n\n {helperMessage && !isError && (\n <BaseText\n label={helperMessage}\n className={twMerge(\n 'font-normal text-dark-bermudaGray text-[10px] inline-block',\n helperMessageStyles\n )}\n />\n )}\n\n {isError && !!errorMessage && (\n <BaseText\n label={errorMessage}\n className={twMerge(\n 'font-normal text-red-fireEngineRed text-[10px] inline-block',\n errorMessageStyles\n )}\n />\n )}\n </div>\n );\n};\n\nexport default BaseTimePicker;\n"],"names":["_a","id","value","position","isHideRangesOption","onChange","onSelect","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isDisabled","containerStyles","activeContainerStyles","placeholder","placeholderStyles","valueStyles","isCleanable","onClean","onOpen","icon","iconStyles","hideHours","hideMinutes","hideSeconds","language","label","labelStyles","variant","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","props","__rest","defaultId","useId","isOpen","setIsOpen","useState","LanguageMapper","english","bahasa","useEffect","_jsxs","Object","assign","className","_jsx","jsx","jsxs","children","BaseText","twMerge","BaseBadgeRequired","DatePickerRsuite","format","undefined","locale","dateLocale","oneTap","isOneTap","date","onClose","onOk","placement","shouldDisableDate","isDisableBefore","dateFns.isBefore","Date","minDate","maxDate","dateFns.isAfter","editable","ranges","toggleAs","classNames","onClick","dateFormatter","e","stopPropagation","Icon","name"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseTimePicker.js","sources":["../../../../src/components/TimePicker/BaseTimePicker.tsx"],"sourcesContent":["/* eslint-disable sonarjs/no-duplicate-string */\nimport classNames from 'classnames';\nimport * as dateFns from 'date-fns';\nimport { useEffect, useId, useState } from 'react';\nimport { DatePicker as DatePickerRsuite } from 'rsuite';\nimport { TypeAttributes } from 'rsuite/esm/@types/common';\nimport { twMerge } from 'tailwind-merge';\n\nimport { dateLocale } from '../../constants/dateLocale';\nimport { dateFormatter } from '../../utils/dateFormatter';\nimport { BaseBadgeRequired } from '../Badge';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport {\n BaseTimePickerInterface,\n PickerPosition,\n TimePickerLocalType\n} from './BaseTimePicker.type';\n\nconst BaseTimePicker = ({\n id,\n value,\n position,\n isHideRangesOption,\n onChange,\n onSelect,\n isError,\n errorMessage,\n errorMessageStyles,\n helperMessage,\n helperMessageStyles,\n isDisabled,\n containerStyles,\n activeContainerStyles,\n placeholder,\n placeholderStyles,\n valueStyles,\n isCleanable,\n onClean,\n onOpen,\n icon,\n iconStyles,\n hideHours,\n hideMinutes,\n hideSeconds,\n language = 'english',\n label,\n labelStyles,\n variant = 'box',\n isRequired,\n labelRequired,\n labelRequiredStyles,\n containerRequiredStyles,\n format = 'HH:mm',\n calendarDefaultDate,\n ...props\n}: // eslint-disable-next-line sonarjs/cognitive-complexity\nBaseTimePickerInterface) => {\n const defaultId = useId();\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const PlacementMapper: Record<PickerPosition, TypeAttributes.Placement> = {\n 'top-start': 'topStart',\n 'top-center': 'top',\n 'top-end': 'topEnd',\n 'right-start': 'rightStart',\n 'right-center': 'right',\n 'right-end': 'rightEnd',\n 'bottom-start': 'bottomStart',\n 'bottom-center': 'bottom',\n 'bottom-end': 'bottomEnd',\n 'left-start': 'leftStart',\n 'left-center': 'left',\n 'left-end': 'leftEnd'\n };\n\n const LanguageMapper: Record<TimePickerLocalType, 'en' | 'id'> = {\n english: 'en',\n bahasa: 'id'\n };\n\n useEffect(() => {\n if (!value) {\n setIsOpen(false);\n }\n }, [value]);\n\n return (\n <div className='relative flex flex-col gap-y-1'>\n {(isOpen || isDisabled) && (\n <div className='absolute top-0 left-0 w-full h-full gap-y-1 z-20 bg-transparent cursor-pointer'></div>\n )}\n <div className='flex flex-row items-end gap-x-1'>\n {!!label && (\n <BaseText\n label={label}\n className={twMerge('font-normal text-dark-gumbo text-[10px]', labelStyles)}\n />\n )}\n {isRequired && (\n <BaseBadgeRequired\n labelRequired={labelRequired}\n labelRequiredStyles={labelRequiredStyles}\n containerRequiredStyles={containerRequiredStyles}\n />\n )}\n </div>\n <DatePickerRsuite\n calendarDefaultDate={calendarDefaultDate ?? undefined}\n format={format}\n id={isDisabled || !isOpen ? undefined : id || defaultId}\n value={value ?? undefined}\n locale={dateLocale[language]}\n oneTap={props.isOneTap}\n onChange={(date: Date) => {\n setIsOpen(false);\n onChange(date);\n }}\n onSelect={onSelect}\n onClose={() => setIsOpen(false)}\n onOpen={onOpen}\n onOk={() => setIsOpen(false)}\n placement={PlacementMapper[position]}\n shouldDisableDate={(date: Date) =>\n props.isDisableBefore\n ? dateFns.isBefore(date, new Date())\n : props.minDate || props.maxDate\n ? dateFns.isBefore(date, props.minDate ? new Date(props.minDate) : undefined) ||\n dateFns.isAfter(date, props.maxDate ? new Date(props.maxDate) : undefined)\n : undefined\n }\n editable={false}\n ranges={isHideRangesOption ? [] : undefined}\n hideHours={hideHours}\n hideMinutes={hideMinutes}\n hideSeconds={hideSeconds}\n toggleAs={() => (\n <div\n className={twMerge(\n classNames(\n twMerge(\n 'flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid w-full cursor-pointer',\n containerStyles\n ),\n variant === 'line' && 'border-b border-t-0 border-x-0 rounded-none',\n isOpen && activeContainerStyles\n ? activeContainerStyles\n : isOpen\n ? 'border-blue-buttonBlue'\n : undefined,\n isDisabled && 'border-dark-bermudaGray bg-light-whiteSmoke',\n isError && 'border-red-fireEngineRed'\n )\n )}\n onClick={() => {\n if (!isDisabled) setIsOpen(!isOpen);\n }}\n >\n <div className='flex flex-1'>\n {!!placeholder && !value && (\n <div className='flex flex-1'>\n <BaseText\n label={placeholder}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]'\n ),\n placeholderStyles\n )}\n />\n </div>\n )}\n\n {!!value && (\n <div className='flex flex-1'>\n <BaseText\n label={dateFormatter(value, format, {\n locale: LanguageMapper[language]\n })}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 leading-[14px]'\n ),\n valueStyles\n )}\n />\n </div>\n )}\n </div>\n\n {isCleanable && !!value && (\n <div\n className='cursor-pointer h-3 w-3 flex items-center justify-center -mr-'\n onClick={(e) => {\n e.stopPropagation();\n\n setIsOpen(false);\n onClean?.(undefined);\n }}\n >\n <Icon name='close' className='fill-dark-bermudaGray w-3 h-3' />\n </div>\n )}\n <Icon\n name={icon || 'caretDate'}\n className={twMerge(\n classNames(\n 'fill-dark-bermudaGray w-3 h-3',\n `${isDisabled && 'fill-dark-bermudaGray'}`\n ),\n iconStyles\n )}\n />\n </div>\n )}\n />\n\n {helperMessage && !isError && (\n <BaseText\n label={helperMessage}\n className={twMerge(\n 'font-normal text-dark-bermudaGray text-[10px] inline-block',\n helperMessageStyles\n )}\n />\n )}\n\n {isError && !!errorMessage && (\n <BaseText\n label={errorMessage}\n className={twMerge(\n 'font-normal text-red-fireEngineRed text-[10px] inline-block',\n errorMessageStyles\n )}\n />\n )}\n </div>\n );\n};\n\nexport default BaseTimePicker;\n"],"names":["_a","id","value","position","isHideRangesOption","onChange","onSelect","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isDisabled","containerStyles","activeContainerStyles","placeholder","placeholderStyles","valueStyles","isCleanable","onClean","onOpen","icon","iconStyles","hideHours","hideMinutes","hideSeconds","language","label","labelStyles","variant","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","format","calendarDefaultDate","props","__rest","defaultId","useId","isOpen","setIsOpen","useState","LanguageMapper","english","bahasa","useEffect","_jsxs","jsxs","Object","assign","className","children","_jsx","BaseText","twMerge","BaseBadgeRequired","DatePickerRsuite","undefined","locale","dateLocale","oneTap","isOneTap","date","onClose","onOk","placement","shouldDisableDate","isDisableBefore","dateFns.isBefore","Date","minDate","maxDate","dateFns.isAfter","editable","ranges","toggleAs","classNames","onClick","jsx","dateFormatter","e","stopPropagation","Icon","name"],"mappings":"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"}
|
|
@@ -3,6 +3,7 @@ import { FormVariantType } from '../../blocks';
|
|
|
3
3
|
import { BaseBadgeRequiredInterface } from '../Badge';
|
|
4
4
|
import { IconType } from '../Icon';
|
|
5
5
|
export type TimePickerLocalType = 'english' | 'bahasa';
|
|
6
|
+
export type TimeFormatType = 'HH:mm' | 'HH.mm';
|
|
6
7
|
export type PickerPosition = 'top-start' | 'top-center' | 'top-end' | 'right-start' | 'right-center' | 'right-end' | 'bottom-start' | 'bottom-center' | 'bottom-end' | 'left-center' | 'left-end' | 'left-start';
|
|
7
8
|
export type BaseTimePickerInterface = {
|
|
8
9
|
onBlur?: (e: FocusEvent<any>) => void;
|
|
@@ -42,4 +43,6 @@ export type BaseTimePickerInterface = {
|
|
|
42
43
|
helperMessageStyles?: string;
|
|
43
44
|
variant?: FormVariantType;
|
|
44
45
|
isRequired?: boolean;
|
|
46
|
+
format?: TimeFormatType;
|
|
47
|
+
calendarDefaultDate?: Date;
|
|
45
48
|
} & BaseBadgeRequiredInterface;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as dateFns from 'date-fns';
|
|
2
|
-
export type DateFormatType = 'dd MMM yyyy' | 'dd MMMM yyyy' | 'dd MMM' | 'HH:mm';
|
|
2
|
+
export type DateFormatType = 'dd MMM yyyy' | 'dd MMMM yyyy' | 'dd MMM' | 'HH:mm' | 'HH.mm';
|
|
3
3
|
type DateFormatOption = Omit<Parameters<typeof dateFns.format>[2], 'locale'> & {
|
|
4
4
|
locale?: 'id' | 'en';
|
|
5
5
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dateFormatter.js","sources":["../../../src/utils/dateFormatter.ts"],"sourcesContent":["import * as dateFns from 'date-fns';\nimport en from 'date-fns/locale/en-US/index';\nimport id from 'date-fns/locale/id';\n\nexport type DateFormatType = 'dd MMM yyyy' | 'dd MMMM yyyy' | 'dd MMM' | 'HH:mm';\n\ntype DateFormatOption = Omit<Parameters<typeof dateFns.format>[2], 'locale'> & {\n locale?: 'id' | 'en';\n};\n\nexport const dateFormatter = (\n date: Date,\n dateFormat?: DateFormatType,\n { locale = 'id', ...option }: DateFormatOption = {}\n) => {\n return dateFns.format(date, dateFormat || 'dd MMMM yyyy', {\n locale: locale === 'en' ? en : id,\n ...option\n });\n};\n"],"names":["date","dateFormat","_a","locale","option","__rest","dateFns.format","Object","assign","en","id"],"mappings":"gUAU6B,CAC3BA,EACAC,EACAC,EAAiD,CAAA,SAAjDC,OAAEA,EAAS,MAAID,EAAKE,EAAMC,EAAAA,OAAAH,EAA1B,YAEA,OAAOI,EAAeN,EAAMC,GAAc,eACxCM,OAAAC,OAAA,CAAAL,OAAmB,OAAXA,EAAkBM,EAAKC,GAC5BN,GACH"}
|
|
1
|
+
{"version":3,"file":"dateFormatter.js","sources":["../../../src/utils/dateFormatter.ts"],"sourcesContent":["import * as dateFns from 'date-fns';\nimport en from 'date-fns/locale/en-US/index';\nimport id from 'date-fns/locale/id';\n\nexport type DateFormatType = 'dd MMM yyyy' | 'dd MMMM yyyy' | 'dd MMM' | 'HH:mm' | 'HH.mm';\n\ntype DateFormatOption = Omit<Parameters<typeof dateFns.format>[2], 'locale'> & {\n locale?: 'id' | 'en';\n};\n\nexport const dateFormatter = (\n date: Date,\n dateFormat?: DateFormatType,\n { locale = 'id', ...option }: DateFormatOption = {}\n) => {\n return dateFns.format(date, dateFormat || 'dd MMMM yyyy', {\n locale: locale === 'en' ? en : id,\n ...option\n });\n};\n"],"names":["date","dateFormat","_a","locale","option","__rest","dateFns.format","Object","assign","en","id"],"mappings":"gUAU6B,CAC3BA,EACAC,EACAC,EAAiD,CAAA,SAAjDC,OAAEA,EAAS,MAAID,EAAKE,EAAMC,EAAAA,OAAAH,EAA1B,YAEA,OAAOI,EAAeN,EAAMC,GAAc,eACxCM,OAAAC,OAAA,CAAAL,OAAmB,OAAXA,EAAkBM,EAAKC,GAC5BN,GACH"}
|