@wordpress/components
Version:
UI components for WordPress.
8 lines (7 loc) • 7.87 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../../../src/date-time/time/time-input/index.tsx"],
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { Fragment } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { TimeWrapper, TimeSeparator, HoursInput, MinutesInput, Fieldset } from '../styles';\nimport { HStack } from '../../../h-stack';\nimport { from12hTo24h, from24hTo12h, buildPadInputStateReducer, validateInputElementTarget } from '../../utils';\nimport { useControlledValue } from '../../../utils';\nimport BaseControl from '../../../base-control';\nimport { ToggleGroupControl, ToggleGroupControlOption } from '../../../toggle-group-control';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nexport function TimeInput({\n value: valueProp,\n defaultValue,\n is12Hour,\n label,\n minutesProps,\n onChange\n}) {\n const [value = {\n hours: new Date().getHours(),\n minutes: new Date().getMinutes()\n }, setValue] = useControlledValue({\n value: valueProp,\n onChange,\n defaultValue\n });\n const dayPeriod = parseDayPeriod(value.hours);\n const hours12Format = from24hTo12h(value.hours);\n const buildNumberControlChangeCallback = method => {\n return (_value, {\n event\n }) => {\n if (!validateInputElementTarget(event)) {\n return;\n }\n\n // We can safely assume value is a number if target is valid.\n const numberValue = Number(_value);\n setValue({\n ...value,\n [method]: method === 'hours' && is12Hour ? from12hTo24h(numberValue, dayPeriod === 'PM') : numberValue\n });\n };\n };\n const buildAmPmChangeCallback = _value => {\n return () => {\n if (dayPeriod === _value) {\n return;\n }\n setValue({\n ...value,\n hours: from12hTo24h(hours12Format, _value === 'PM')\n });\n };\n };\n function parseDayPeriod(_hours) {\n return _hours < 12 ? 'AM' : 'PM';\n }\n const Wrapper = label ? Fieldset : Fragment;\n return /*#__PURE__*/_jsxs(Wrapper, {\n children: [label && /*#__PURE__*/_jsx(BaseControl.VisualLabel, {\n as: \"legend\",\n children: label\n }), /*#__PURE__*/_jsxs(HStack, {\n alignment: \"left\",\n expanded: false,\n children: [/*#__PURE__*/_jsxs(TimeWrapper, {\n className: \"components-datetime__time-field components-datetime__time-field-time\" // Unused, for backwards compatibility.\n ,\n children: [/*#__PURE__*/_jsx(HoursInput, {\n className: \"components-datetime__time-field-hours-input\" // Unused, for backwards compatibility.\n ,\n label: __('Hours'),\n hideLabelFromVision: true,\n __next40pxDefaultSize: true,\n value: String(is12Hour ? hours12Format : value.hours).padStart(2, '0'),\n step: 1,\n min: is12Hour ? 1 : 0,\n max: is12Hour ? 12 : 23,\n required: true,\n spinControls: \"none\",\n isPressEnterToChange: true,\n isDragEnabled: false,\n isShiftStepEnabled: false,\n onChange: buildNumberControlChangeCallback('hours'),\n __unstableStateReducer: buildPadInputStateReducer(2)\n }), /*#__PURE__*/_jsx(TimeSeparator, {\n className: \"components-datetime__time-separator\" // Unused, for backwards compatibility.\n ,\n \"aria-hidden\": \"true\",\n children: \":\"\n }), /*#__PURE__*/_jsx(MinutesInput, {\n className: clsx('components-datetime__time-field-minutes-input',\n // Unused, for backwards compatibility.\n minutesProps?.className),\n label: __('Minutes'),\n hideLabelFromVision: true,\n __next40pxDefaultSize: true,\n value: String(value.minutes).padStart(2, '0'),\n step: 1,\n min: 0,\n max: 59,\n required: true,\n spinControls: \"none\",\n isPressEnterToChange: true,\n isDragEnabled: false,\n isShiftStepEnabled: false,\n onChange: (...args) => {\n buildNumberControlChangeCallback('minutes')(...args);\n minutesProps?.onChange?.(...args);\n },\n __unstableStateReducer: buildPadInputStateReducer(2),\n ...minutesProps\n })]\n }), is12Hour && /*#__PURE__*/_jsxs(ToggleGroupControl, {\n __next40pxDefaultSize: true,\n isBlock: true,\n label: __('Select AM or PM'),\n hideLabelFromVision: true,\n value: dayPeriod,\n onChange: newValue => {\n buildAmPmChangeCallback(newValue)();\n },\n children: [/*#__PURE__*/_jsx(ToggleGroupControlOption, {\n value: \"AM\",\n label: __('AM')\n }), /*#__PURE__*/_jsx(ToggleGroupControlOption, {\n value: \"PM\",\n label: __('PM')\n })]\n })]\n })]\n });\n}\nexport default TimeInput;"],
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,kBAAmB;AACnB,qBAAyB;AAKzB,oBAA+E;AAC/E,qBAAuB;AACvB,mBAAkG;AAClG,IAAAA,gBAAmC;AACnC,0BAAwB;AACxB,kCAA6D;AAC7D,yBAA2C;AACpC,SAAS,UAAU;AAAA,EACxB,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAG;AACD,QAAM,CAAC,QAAQ;AAAA,IACb,QAAO,oBAAI,KAAK,GAAE,SAAS;AAAA,IAC3B,UAAS,oBAAI,KAAK,GAAE,WAAW;AAAA,EACjC,GAAG,QAAQ,QAAI,kCAAmB;AAAA,IAChC,OAAO;AAAA,IACP;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,YAAY,eAAe,MAAM,KAAK;AAC5C,QAAM,oBAAgB,2BAAa,MAAM,KAAK;AAC9C,QAAM,mCAAmC,YAAU;AACjD,WAAO,CAAC,QAAQ;AAAA,MACd;AAAA,IACF,MAAM;AACJ,UAAI,KAAC,yCAA2B,KAAK,GAAG;AACtC;AAAA,MACF;AAGA,YAAM,cAAc,OAAO,MAAM;AACjC,eAAS;AAAA,QACP,GAAG;AAAA,QACH,CAAC,MAAM,GAAG,WAAW,WAAW,eAAW,2BAAa,aAAa,cAAc,IAAI,IAAI;AAAA,MAC7F,CAAC;AAAA,IACH;AAAA,EACF;AACA,QAAM,0BAA0B,YAAU;AACxC,WAAO,MAAM;AACX,UAAI,cAAc,QAAQ;AACxB;AAAA,MACF;AACA,eAAS;AAAA,QACP,GAAG;AAAA,QACH,WAAO,2BAAa,eAAe,WAAW,IAAI;AAAA,MACpD,CAAC;AAAA,IACH;AAAA,EACF;AACA,WAAS,eAAe,QAAQ;AAC9B,WAAO,SAAS,KAAK,OAAO;AAAA,EAC9B;AACA,QAAM,UAAU,QAAQ,yBAAW;AACnC,SAAoB,uCAAAC,MAAM,SAAS;AAAA,IACjC,UAAU,CAAC,SAAsB,uCAAAC,KAAK,oBAAAC,QAAY,aAAa;AAAA,MAC7D,IAAI;AAAA,MACJ,UAAU;AAAA,IACZ,CAAC,GAAgB,uCAAAF,MAAM,uBAAQ;AAAA,MAC7B,WAAW;AAAA,MACX,UAAU;AAAA,MACV,UAAU,CAAc,uCAAAA,MAAM,2BAAa;AAAA,QACzC,WAAW;AAAA,QAEX,UAAU,CAAc,uCAAAC,KAAK,0BAAY;AAAA,UACvC,WAAW;AAAA,UAEX,WAAO,gBAAG,OAAO;AAAA,UACjB,qBAAqB;AAAA,UACrB,uBAAuB;AAAA,UACvB,OAAO,OAAO,WAAW,gBAAgB,MAAM,KAAK,EAAE,SAAS,GAAG,GAAG;AAAA,UACrE,MAAM;AAAA,UACN,KAAK,WAAW,IAAI;AAAA,UACpB,KAAK,WAAW,KAAK;AAAA,UACrB,UAAU;AAAA,UACV,cAAc;AAAA,UACd,sBAAsB;AAAA,UACtB,eAAe;AAAA,UACf,oBAAoB;AAAA,UACpB,UAAU,iCAAiC,OAAO;AAAA,UAClD,4BAAwB,wCAA0B,CAAC;AAAA,QACrD,CAAC,GAAgB,uCAAAA,KAAK,6BAAe;AAAA,UACnC,WAAW;AAAA,UAEX,eAAe;AAAA,UACf,UAAU;AAAA,QACZ,CAAC,GAAgB,uCAAAA,KAAK,4BAAc;AAAA,UAClC,eAAW,YAAAE;AAAA,YAAK;AAAA;AAAA,YAEhB,cAAc;AAAA,UAAS;AAAA,UACvB,WAAO,gBAAG,SAAS;AAAA,UACnB,qBAAqB;AAAA,UACrB,uBAAuB;AAAA,UACvB,OAAO,OAAO,MAAM,OAAO,EAAE,SAAS,GAAG,GAAG;AAAA,UAC5C,MAAM;AAAA,UACN,KAAK;AAAA,UACL,KAAK;AAAA,UACL,UAAU;AAAA,UACV,cAAc;AAAA,UACd,sBAAsB;AAAA,UACtB,eAAe;AAAA,UACf,oBAAoB;AAAA,UACpB,UAAU,IAAI,SAAS;AACrB,6CAAiC,SAAS,EAAE,GAAG,IAAI;AACnD,0BAAc,WAAW,GAAG,IAAI;AAAA,UAClC;AAAA,UACA,4BAAwB,wCAA0B,CAAC;AAAA,UACnD,GAAG;AAAA,QACL,CAAC,CAAC;AAAA,MACJ,CAAC,GAAG,YAAyB,uCAAAH,MAAM,gDAAoB;AAAA,QACrD,uBAAuB;AAAA,QACvB,SAAS;AAAA,QACT,WAAO,gBAAG,iBAAiB;AAAA,QAC3B,qBAAqB;AAAA,QACrB,OAAO;AAAA,QACP,UAAU,cAAY;AACpB,kCAAwB,QAAQ,EAAE;AAAA,QACpC;AAAA,QACA,UAAU,CAAc,uCAAAC,KAAK,sDAA0B;AAAA,UACrD,OAAO;AAAA,UACP,WAAO,gBAAG,IAAI;AAAA,QAChB,CAAC,GAAgB,uCAAAA,KAAK,sDAA0B;AAAA,UAC9C,OAAO;AAAA,UACP,WAAO,gBAAG,IAAI;AAAA,QAChB,CAAC,CAAC;AAAA,MACJ,CAAC,CAAC;AAAA,IACJ,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACA,IAAO,qBAAQ;",
"names": ["import_utils", "_jsxs", "_jsx", "BaseControl", "clsx"]
}