@transferwise/components 46.110.0 → 46.111.1
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/common/panel/Panel.js +1 -0
- package/build/common/panel/Panel.js.map +1 -1
- package/build/common/panel/Panel.mjs +1 -0
- package/build/common/panel/Panel.mjs.map +1 -1
- package/build/common/responsivePanel/ResponsivePanel.js +6 -1
- package/build/common/responsivePanel/ResponsivePanel.js.map +1 -1
- package/build/common/responsivePanel/ResponsivePanel.mjs +6 -1
- package/build/common/responsivePanel/ResponsivePanel.mjs.map +1 -1
- package/build/dateInput/DateInput.js +46 -24
- package/build/dateInput/DateInput.js.map +1 -1
- package/build/dateInput/DateInput.mjs +48 -26
- package/build/dateInput/DateInput.mjs.map +1 -1
- package/build/dateLookup/DateLookup.js +5 -2
- package/build/dateLookup/DateLookup.js.map +1 -1
- package/build/dateLookup/DateLookup.mjs +5 -2
- package/build/dateLookup/DateLookup.mjs.map +1 -1
- package/build/dateLookup/dateTrigger/DateTrigger.js +2 -0
- package/build/dateLookup/dateTrigger/DateTrigger.js.map +1 -1
- package/build/dateLookup/dateTrigger/DateTrigger.mjs +2 -0
- package/build/dateLookup/dateTrigger/DateTrigger.mjs.map +1 -1
- package/build/field/Field.js +7 -2
- package/build/field/Field.js.map +1 -1
- package/build/field/Field.mjs +13 -8
- package/build/field/Field.mjs.map +1 -1
- package/build/inputs/InputGroup.js +1 -1
- package/build/inputs/InputGroup.js.map +1 -1
- package/build/inputs/InputGroup.mjs +2 -2
- package/build/inputs/InputGroup.mjs.map +1 -1
- package/build/inputs/SelectInput.js +19 -5
- package/build/inputs/SelectInput.js.map +1 -1
- package/build/inputs/SelectInput.mjs +19 -5
- package/build/inputs/SelectInput.mjs.map +1 -1
- package/build/inputs/contexts.js +8 -4
- package/build/inputs/contexts.js.map +1 -1
- package/build/inputs/contexts.mjs +7 -4
- package/build/inputs/contexts.mjs.map +1 -1
- package/build/label/Label.js +14 -8
- package/build/label/Label.js.map +1 -1
- package/build/label/Label.mjs +14 -8
- package/build/label/Label.mjs.map +1 -1
- package/build/listItem/ListItem.js.map +1 -1
- package/build/listItem/ListItem.mjs.map +1 -1
- package/build/listItem/Prompt/ListItemPrompt.js +1 -1
- package/build/listItem/Prompt/ListItemPrompt.js.map +1 -1
- package/build/listItem/Prompt/ListItemPrompt.mjs +1 -1
- package/build/listItem/Prompt/ListItemPrompt.mjs.map +1 -1
- package/build/main.css +163 -153
- package/build/moneyInput/MoneyInput.js +6 -5
- package/build/moneyInput/MoneyInput.js.map +1 -1
- package/build/moneyInput/MoneyInput.mjs +6 -5
- package/build/moneyInput/MoneyInput.mjs.map +1 -1
- package/build/phoneNumberInput/PhoneNumberInput.js +25 -3
- package/build/phoneNumberInput/PhoneNumberInput.js.map +1 -1
- package/build/phoneNumberInput/PhoneNumberInput.mjs +27 -5
- package/build/phoneNumberInput/PhoneNumberInput.mjs.map +1 -1
- package/build/{listItem/Prompt → prompt}/InlinePrompt/InlinePrompt.js +23 -23
- package/build/prompt/InlinePrompt/InlinePrompt.js.map +1 -0
- package/build/{listItem/Prompt → prompt}/InlinePrompt/InlinePrompt.mjs +23 -23
- package/build/prompt/InlinePrompt/InlinePrompt.mjs.map +1 -0
- package/build/styles/inputs/Input.css +5 -0
- package/build/styles/inputs/TextArea.css +5 -0
- package/build/styles/listItem/ListItem.css +5 -153
- package/build/styles/listItem/Prompt/ListItemPrompt.css +0 -153
- package/build/styles/main.css +163 -153
- package/build/types/common/panel/Panel.d.ts +2 -0
- package/build/types/common/panel/Panel.d.ts.map +1 -1
- package/build/types/common/responsivePanel/ResponsivePanel.d.ts +1 -0
- package/build/types/common/responsivePanel/ResponsivePanel.d.ts.map +1 -1
- package/build/types/dateInput/DateInput.d.ts +2 -2
- package/build/types/dateInput/DateInput.d.ts.map +1 -1
- package/build/types/dateLookup/DateLookup.d.ts.map +1 -1
- package/build/types/dateLookup/dateTrigger/DateTrigger.d.ts +1 -0
- package/build/types/dateLookup/dateTrigger/DateTrigger.d.ts.map +1 -1
- package/build/types/field/Field.d.ts.map +1 -1
- package/build/types/inputs/InputGroup.d.ts.map +1 -1
- package/build/types/inputs/SelectInput.d.ts +9 -1
- package/build/types/inputs/SelectInput.d.ts.map +1 -1
- package/build/types/inputs/contexts.d.ts +6 -1
- package/build/types/inputs/contexts.d.ts.map +1 -1
- package/build/types/label/Label.d.ts +5 -15
- package/build/types/label/Label.d.ts.map +1 -1
- package/build/types/listItem/ListItem.d.ts.map +1 -1
- package/build/types/listItem/Prompt/ListItemPrompt.d.ts +1 -1
- package/build/types/listItem/Prompt/ListItemPrompt.d.ts.map +1 -1
- package/build/types/moneyInput/MoneyInput.d.ts.map +1 -1
- package/build/types/phoneNumberInput/PhoneNumberInput.d.ts.map +1 -1
- package/build/types/{listItem/Prompt → prompt}/InlinePrompt/InlinePrompt.d.ts +1 -1
- package/build/types/prompt/InlinePrompt/InlinePrompt.d.ts.map +1 -0
- package/build/types/prompt/InlinePrompt/index.d.ts.map +1 -0
- package/build/types/prompt/index.d.ts +3 -0
- package/build/types/prompt/index.d.ts.map +1 -0
- package/package.json +5 -5
- package/src/DisabledComponents.story.tsx +156 -0
- package/src/common/panel/Panel.tsx +2 -0
- package/src/common/responsivePanel/ResponsivePanel.tsx +7 -1
- package/src/dateInput/DateInput.spec.tsx +45 -7
- package/src/dateInput/DateInput.story.tsx +2 -0
- package/src/dateInput/DateInput.tsx +65 -30
- package/src/dateLookup/DateLookup.spec.tsx +16 -0
- package/src/dateLookup/DateLookup.tsx +6 -3
- package/src/dateLookup/dateTrigger/DateTrigger.tsx +3 -0
- package/src/field/Field.tsx +6 -5
- package/src/inputs/Input.css +5 -0
- package/src/inputs/InputGroup.tsx +3 -4
- package/src/inputs/SelectInput.story.tsx +30 -10
- package/src/inputs/SelectInput.tsx +36 -6
- package/src/inputs/TextArea.css +5 -0
- package/src/inputs/_common.less +5 -0
- package/src/inputs/contexts.tsx +12 -3
- package/src/label/Label.tsx +26 -20
- package/src/listItem/ListItem.css +5 -153
- package/src/listItem/ListItem.less +5 -0
- package/src/listItem/ListItem.tsx +2 -1
- package/src/listItem/Prompt/ListItemPrompt.css +0 -153
- package/src/listItem/Prompt/ListItemPrompt.less +0 -2
- package/src/listItem/Prompt/ListItemPrompt.tsx +1 -1
- package/src/main.css +163 -153
- package/src/main.less +1 -0
- package/src/moneyInput/MoneyInput.spec.tsx +16 -1
- package/src/moneyInput/MoneyInput.tsx +7 -6
- package/src/neptune-css/NeptuneCSS.story.tsx +142 -0
- package/src/phoneNumberInput/PhoneNumberInput.spec.tsx +32 -0
- package/src/phoneNumberInput/PhoneNumberInput.tsx +32 -11
- package/src/{listItem/Prompt → prompt}/InlinePrompt/InlinePrompt.spec.tsx +2 -2
- package/src/{listItem/Prompt → prompt}/InlinePrompt/InlinePrompt.tsx +4 -4
- package/src/prompt/index.ts +6 -0
- package/build/listItem/Prompt/InlinePrompt/InlinePrompt.js.map +0 -1
- package/build/listItem/Prompt/InlinePrompt/InlinePrompt.mjs.map +0 -1
- package/build/types/listItem/Prompt/InlinePrompt/InlinePrompt.d.ts.map +0 -1
- package/build/types/listItem/Prompt/InlinePrompt/index.d.ts.map +0 -1
- /package/build/styles/{listItem/Prompt → prompt}/InlinePrompt/InlinePrompt.css +0 -0
- /package/build/types/{listItem/Prompt → prompt}/InlinePrompt/index.d.ts +0 -0
- /package/src/{listItem/Prompt → prompt}/InlinePrompt/InlinePrompt.css +0 -0
- /package/src/{listItem/Prompt → prompt}/InlinePrompt/InlinePrompt.less +0 -0
- /package/src/{listItem/Prompt → prompt}/InlinePrompt/index.ts +0 -0
|
@@ -51,6 +51,7 @@ const Panel = /*#__PURE__*/React.forwardRef(function Panel({
|
|
|
51
51
|
position: position$1 = position.Position.BOTTOM,
|
|
52
52
|
anchorRef,
|
|
53
53
|
anchorWidth = false,
|
|
54
|
+
considerHeight = false,
|
|
54
55
|
...rest
|
|
55
56
|
}, reference) {
|
|
56
57
|
const [arrowElement, setArrowElement] = React.useState(null);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Panel.js","sources":["../../../src/common/panel/Panel.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport {\n CSSProperties,\n HTMLAttributes,\n MutableRefObject,\n PropsWithChildren,\n SyntheticEvent,\n forwardRef,\n useContext,\n useEffect,\n useState,\n} from 'react';\nimport { usePopper } from 'react-popper';\n\nimport { Position, PositionBottom, PositionLeft, PositionRight, PositionTop } from '..';\nimport Dimmer from '../../dimmer';\nimport { OverlayIdContext } from '../../provider/overlay/OverlayIdProvider';\n\nconst POPOVER_OFFSET = [0, 16];\n\n// By default the flip positioning explores only the opposite alternative. So if left is passed and there's no enough space\n// the right one gets chosen. If there's no space on both sides popover goes back to the initially chosen one left.\n// This mapping forces popover to try the four available positions before going back to the initial chosen one.\nconst fallbackPlacements = {\n [Position.TOP]: [Position.BOTTOM, Position.RIGHT, Position.LEFT],\n [Position.BOTTOM]: [Position.TOP, Position.RIGHT, Position.LEFT],\n [Position.LEFT]: [Position.RIGHT, Position.TOP, Position.BOTTOM],\n [Position.RIGHT]: [Position.LEFT, Position.TOP, Position.BOTTOM],\n};\n\nexport type PanelProps = PropsWithChildren<{\n arrow?: boolean;\n flip?: boolean;\n altAxis?: boolean;\n open?: boolean;\n onClose?: (event: Event | SyntheticEvent) => void;\n position?: PositionBottom | PositionLeft | PositionRight | PositionTop;\n anchorRef: MutableRefObject<Element | null>;\n anchorWidth?: boolean;\n}> &\n HTMLAttributes<HTMLDivElement>;\n\nconst Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(\n {\n arrow = false,\n flip = true,\n altAxis = false,\n children,\n open = false,\n onClose,\n position = Position.BOTTOM,\n anchorRef,\n anchorWidth = false,\n ...rest\n }: PanelProps,\n reference,\n) {\n const [arrowElement, setArrowElement] = useState<HTMLDivElement | null>(null);\n const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n\n const modifiers = [];\n\n if (altAxis) {\n modifiers.push({\n // https://popper.js.org/docs/v2/modifiers/prevent-overflow\n name: 'preventOverflow',\n options: {\n altAxis: true,\n tether: false,\n },\n });\n }\n\n if (arrow) {\n modifiers.push({\n name: 'arrow',\n options: {\n element: arrowElement,\n options: {\n padding: 8, // 8px from the edges of the popper\n },\n },\n });\n // This lets you displace a popper element from its reference element.\n modifiers.push({ name: 'offset', options: { offset: POPOVER_OFFSET } });\n }\n if (flip && fallbackPlacements[position]) {\n modifiers.push({\n name: 'flip',\n options: {\n fallbackPlacements: fallbackPlacements[position],\n },\n });\n }\n\n const { styles, attributes, forceUpdate } = usePopper(anchorRef.current, popperElement, {\n placement: position,\n modifiers,\n });\n\n // If the trigger is not visible when the position is calculated, it will be incorrect. Because this can happen repeatedly (on resize for example),\n // it is most simple just to always position before opening\n useEffect(() => {\n if (open && forceUpdate) {\n forceUpdate();\n }\n }, [open]);\n\n const contentStyle: CSSProperties = {\n ...(anchorWidth ? { width: anchorRef.current?.clientWidth } : undefined),\n };\n\n const overlayId = useContext(OverlayIdContext);\n\n return (\n <Dimmer open={open} transparent fadeContentOnEnter fadeContentOnExit onClose={onClose}>\n <div\n id={overlayId}\n {...rest}\n ref={setPopperElement}\n role=\"dialog\"\n style={{ ...styles.popper }}\n {...attributes.popper}\n className={clsx('np-panel', { 'np-panel--open': open }, rest.className)}\n >\n <div ref={reference} style={contentStyle} className={clsx('np-panel__content')}>\n {children}\n {/* Arrow has to stay inside content to get the same animations as the \"dialog\" and to get hidden when panel is closed. */}\n {arrow && (\n <div ref={setArrowElement} className={clsx('np-panel__arrow')} style={styles.arrow} />\n )}\n </div>\n </div>\n </Dimmer>\n );\n});\n\nexport default Panel;\n"],"names":["POPOVER_OFFSET","fallbackPlacements","Position","TOP","BOTTOM","RIGHT","LEFT","Panel","forwardRef","arrow","flip","altAxis","children","open","onClose","position","anchorRef","anchorWidth","rest","reference","arrowElement","setArrowElement","useState","popperElement","setPopperElement","modifiers","push","name","options","tether","element","padding","offset","styles","attributes","forceUpdate","usePopper","current","placement","useEffect","contentStyle","width","clientWidth","undefined","overlayId","useContext","OverlayIdContext","_jsx","Dimmer","transparent","fadeContentOnEnter","fadeContentOnExit","id","ref","role","style","popper","className","clsx","_jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAMA,cAAc,GAAG,CAAC,CAAC,EAAE,EAAE,CAAC;AAE9B;AACA;AACA;AACA,MAAMC,kBAAkB,GAAG;AACzB,EAAA,CAACC,iBAAQ,CAACC,GAAG,GAAG,CAACD,iBAAQ,CAACE,MAAM,EAAEF,iBAAQ,CAACG,KAAK,EAAEH,iBAAQ,CAACI,IAAI,CAAC;AAChE,EAAA,CAACJ,iBAAQ,CAACE,MAAM,GAAG,CAACF,iBAAQ,CAACC,GAAG,EAAED,iBAAQ,CAACG,KAAK,EAAEH,iBAAQ,CAACI,IAAI,CAAC;AAChE,EAAA,CAACJ,iBAAQ,CAACI,IAAI,GAAG,CAACJ,iBAAQ,CAACG,KAAK,EAAEH,iBAAQ,CAACC,GAAG,EAAED,iBAAQ,CAACE,MAAM,CAAC;AAChE,EAAA,CAACF,iBAAQ,CAACG,KAAK,GAAG,CAACH,iBAAQ,CAACI,IAAI,EAAEJ,iBAAQ,CAACC,GAAG,EAAED,iBAAQ,CAACE,MAAM;CAChE;
|
|
1
|
+
{"version":3,"file":"Panel.js","sources":["../../../src/common/panel/Panel.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport {\n CSSProperties,\n HTMLAttributes,\n MutableRefObject,\n PropsWithChildren,\n SyntheticEvent,\n forwardRef,\n useContext,\n useEffect,\n useState,\n} from 'react';\nimport { usePopper } from 'react-popper';\n\nimport { Position, PositionBottom, PositionLeft, PositionRight, PositionTop } from '..';\nimport Dimmer from '../../dimmer';\nimport { OverlayIdContext } from '../../provider/overlay/OverlayIdProvider';\n\nconst POPOVER_OFFSET = [0, 16];\n\n// By default the flip positioning explores only the opposite alternative. So if left is passed and there's no enough space\n// the right one gets chosen. If there's no space on both sides popover goes back to the initially chosen one left.\n// This mapping forces popover to try the four available positions before going back to the initial chosen one.\nconst fallbackPlacements = {\n [Position.TOP]: [Position.BOTTOM, Position.RIGHT, Position.LEFT],\n [Position.BOTTOM]: [Position.TOP, Position.RIGHT, Position.LEFT],\n [Position.LEFT]: [Position.RIGHT, Position.TOP, Position.BOTTOM],\n [Position.RIGHT]: [Position.LEFT, Position.TOP, Position.BOTTOM],\n};\n\nexport type PanelProps = PropsWithChildren<{\n arrow?: boolean;\n flip?: boolean;\n altAxis?: boolean;\n open?: boolean;\n onClose?: (event: Event | SyntheticEvent) => void;\n position?: PositionBottom | PositionLeft | PositionRight | PositionTop;\n anchorRef: MutableRefObject<Element | null>;\n anchorWidth?: boolean;\n considerHeight?: boolean;\n}> &\n HTMLAttributes<HTMLDivElement>;\n\nconst Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(\n {\n arrow = false,\n flip = true,\n altAxis = false,\n children,\n open = false,\n onClose,\n position = Position.BOTTOM,\n anchorRef,\n anchorWidth = false,\n considerHeight = false,\n ...rest\n }: PanelProps,\n reference,\n) {\n const [arrowElement, setArrowElement] = useState<HTMLDivElement | null>(null);\n const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n\n const modifiers = [];\n\n if (altAxis) {\n modifiers.push({\n // https://popper.js.org/docs/v2/modifiers/prevent-overflow\n name: 'preventOverflow',\n options: {\n altAxis: true,\n tether: false,\n },\n });\n }\n\n if (arrow) {\n modifiers.push({\n name: 'arrow',\n options: {\n element: arrowElement,\n options: {\n padding: 8, // 8px from the edges of the popper\n },\n },\n });\n // This lets you displace a popper element from its reference element.\n modifiers.push({ name: 'offset', options: { offset: POPOVER_OFFSET } });\n }\n if (flip && fallbackPlacements[position]) {\n modifiers.push({\n name: 'flip',\n options: {\n fallbackPlacements: fallbackPlacements[position],\n },\n });\n }\n\n const { styles, attributes, forceUpdate } = usePopper(anchorRef.current, popperElement, {\n placement: position,\n modifiers,\n });\n\n // If the trigger is not visible when the position is calculated, it will be incorrect. Because this can happen repeatedly (on resize for example),\n // it is most simple just to always position before opening\n useEffect(() => {\n if (open && forceUpdate) {\n forceUpdate();\n }\n }, [open]);\n\n const contentStyle: CSSProperties = {\n ...(anchorWidth ? { width: anchorRef.current?.clientWidth } : undefined),\n };\n\n const overlayId = useContext(OverlayIdContext);\n\n return (\n <Dimmer open={open} transparent fadeContentOnEnter fadeContentOnExit onClose={onClose}>\n <div\n id={overlayId}\n {...rest}\n ref={setPopperElement}\n role=\"dialog\"\n style={{ ...styles.popper }}\n {...attributes.popper}\n className={clsx('np-panel', { 'np-panel--open': open }, rest.className)}\n >\n <div ref={reference} style={contentStyle} className={clsx('np-panel__content')}>\n {children}\n {/* Arrow has to stay inside content to get the same animations as the \"dialog\" and to get hidden when panel is closed. */}\n {arrow && (\n <div ref={setArrowElement} className={clsx('np-panel__arrow')} style={styles.arrow} />\n )}\n </div>\n </div>\n </Dimmer>\n );\n});\n\nexport default Panel;\n"],"names":["POPOVER_OFFSET","fallbackPlacements","Position","TOP","BOTTOM","RIGHT","LEFT","Panel","forwardRef","arrow","flip","altAxis","children","open","onClose","position","anchorRef","anchorWidth","considerHeight","rest","reference","arrowElement","setArrowElement","useState","popperElement","setPopperElement","modifiers","push","name","options","tether","element","padding","offset","styles","attributes","forceUpdate","usePopper","current","placement","useEffect","contentStyle","width","clientWidth","undefined","overlayId","useContext","OverlayIdContext","_jsx","Dimmer","transparent","fadeContentOnEnter","fadeContentOnExit","id","ref","role","style","popper","className","clsx","_jsxs"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Panel.mjs","sources":["../../../src/common/panel/Panel.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport {\n CSSProperties,\n HTMLAttributes,\n MutableRefObject,\n PropsWithChildren,\n SyntheticEvent,\n forwardRef,\n useContext,\n useEffect,\n useState,\n} from 'react';\nimport { usePopper } from 'react-popper';\n\nimport { Position, PositionBottom, PositionLeft, PositionRight, PositionTop } from '..';\nimport Dimmer from '../../dimmer';\nimport { OverlayIdContext } from '../../provider/overlay/OverlayIdProvider';\n\nconst POPOVER_OFFSET = [0, 16];\n\n// By default the flip positioning explores only the opposite alternative. So if left is passed and there's no enough space\n// the right one gets chosen. If there's no space on both sides popover goes back to the initially chosen one left.\n// This mapping forces popover to try the four available positions before going back to the initial chosen one.\nconst fallbackPlacements = {\n [Position.TOP]: [Position.BOTTOM, Position.RIGHT, Position.LEFT],\n [Position.BOTTOM]: [Position.TOP, Position.RIGHT, Position.LEFT],\n [Position.LEFT]: [Position.RIGHT, Position.TOP, Position.BOTTOM],\n [Position.RIGHT]: [Position.LEFT, Position.TOP, Position.BOTTOM],\n};\n\nexport type PanelProps = PropsWithChildren<{\n arrow?: boolean;\n flip?: boolean;\n altAxis?: boolean;\n open?: boolean;\n onClose?: (event: Event | SyntheticEvent) => void;\n position?: PositionBottom | PositionLeft | PositionRight | PositionTop;\n anchorRef: MutableRefObject<Element | null>;\n anchorWidth?: boolean;\n}> &\n HTMLAttributes<HTMLDivElement>;\n\nconst Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(\n {\n arrow = false,\n flip = true,\n altAxis = false,\n children,\n open = false,\n onClose,\n position = Position.BOTTOM,\n anchorRef,\n anchorWidth = false,\n ...rest\n }: PanelProps,\n reference,\n) {\n const [arrowElement, setArrowElement] = useState<HTMLDivElement | null>(null);\n const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n\n const modifiers = [];\n\n if (altAxis) {\n modifiers.push({\n // https://popper.js.org/docs/v2/modifiers/prevent-overflow\n name: 'preventOverflow',\n options: {\n altAxis: true,\n tether: false,\n },\n });\n }\n\n if (arrow) {\n modifiers.push({\n name: 'arrow',\n options: {\n element: arrowElement,\n options: {\n padding: 8, // 8px from the edges of the popper\n },\n },\n });\n // This lets you displace a popper element from its reference element.\n modifiers.push({ name: 'offset', options: { offset: POPOVER_OFFSET } });\n }\n if (flip && fallbackPlacements[position]) {\n modifiers.push({\n name: 'flip',\n options: {\n fallbackPlacements: fallbackPlacements[position],\n },\n });\n }\n\n const { styles, attributes, forceUpdate } = usePopper(anchorRef.current, popperElement, {\n placement: position,\n modifiers,\n });\n\n // If the trigger is not visible when the position is calculated, it will be incorrect. Because this can happen repeatedly (on resize for example),\n // it is most simple just to always position before opening\n useEffect(() => {\n if (open && forceUpdate) {\n forceUpdate();\n }\n }, [open]);\n\n const contentStyle: CSSProperties = {\n ...(anchorWidth ? { width: anchorRef.current?.clientWidth } : undefined),\n };\n\n const overlayId = useContext(OverlayIdContext);\n\n return (\n <Dimmer open={open} transparent fadeContentOnEnter fadeContentOnExit onClose={onClose}>\n <div\n id={overlayId}\n {...rest}\n ref={setPopperElement}\n role=\"dialog\"\n style={{ ...styles.popper }}\n {...attributes.popper}\n className={clsx('np-panel', { 'np-panel--open': open }, rest.className)}\n >\n <div ref={reference} style={contentStyle} className={clsx('np-panel__content')}>\n {children}\n {/* Arrow has to stay inside content to get the same animations as the \"dialog\" and to get hidden when panel is closed. */}\n {arrow && (\n <div ref={setArrowElement} className={clsx('np-panel__arrow')} style={styles.arrow} />\n )}\n </div>\n </div>\n </Dimmer>\n );\n});\n\nexport default Panel;\n"],"names":["POPOVER_OFFSET","fallbackPlacements","Position","TOP","BOTTOM","RIGHT","LEFT","Panel","forwardRef","arrow","flip","altAxis","children","open","onClose","position","anchorRef","anchorWidth","rest","reference","arrowElement","setArrowElement","useState","popperElement","setPopperElement","modifiers","push","name","options","tether","element","padding","offset","styles","attributes","forceUpdate","usePopper","current","placement","useEffect","contentStyle","width","clientWidth","undefined","overlayId","useContext","OverlayIdContext","_jsx","Dimmer","transparent","fadeContentOnEnter","fadeContentOnExit","id","ref","role","style","popper","className","clsx","_jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAMA,cAAc,GAAG,CAAC,CAAC,EAAE,EAAE,CAAC;AAE9B;AACA;AACA;AACA,MAAMC,kBAAkB,GAAG;AACzB,EAAA,CAACC,QAAQ,CAACC,GAAG,GAAG,CAACD,QAAQ,CAACE,MAAM,EAAEF,QAAQ,CAACG,KAAK,EAAEH,QAAQ,CAACI,IAAI,CAAC;AAChE,EAAA,CAACJ,QAAQ,CAACE,MAAM,GAAG,CAACF,QAAQ,CAACC,GAAG,EAAED,QAAQ,CAACG,KAAK,EAAEH,QAAQ,CAACI,IAAI,CAAC;AAChE,EAAA,CAACJ,QAAQ,CAACI,IAAI,GAAG,CAACJ,QAAQ,CAACG,KAAK,EAAEH,QAAQ,CAACC,GAAG,EAAED,QAAQ,CAACE,MAAM,CAAC;AAChE,EAAA,CAACF,QAAQ,CAACG,KAAK,GAAG,CAACH,QAAQ,CAACI,IAAI,EAAEJ,QAAQ,CAACC,GAAG,EAAED,QAAQ,CAACE,MAAM;CAChE;
|
|
1
|
+
{"version":3,"file":"Panel.mjs","sources":["../../../src/common/panel/Panel.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport {\n CSSProperties,\n HTMLAttributes,\n MutableRefObject,\n PropsWithChildren,\n SyntheticEvent,\n forwardRef,\n useContext,\n useEffect,\n useState,\n} from 'react';\nimport { usePopper } from 'react-popper';\n\nimport { Position, PositionBottom, PositionLeft, PositionRight, PositionTop } from '..';\nimport Dimmer from '../../dimmer';\nimport { OverlayIdContext } from '../../provider/overlay/OverlayIdProvider';\n\nconst POPOVER_OFFSET = [0, 16];\n\n// By default the flip positioning explores only the opposite alternative. So if left is passed and there's no enough space\n// the right one gets chosen. If there's no space on both sides popover goes back to the initially chosen one left.\n// This mapping forces popover to try the four available positions before going back to the initial chosen one.\nconst fallbackPlacements = {\n [Position.TOP]: [Position.BOTTOM, Position.RIGHT, Position.LEFT],\n [Position.BOTTOM]: [Position.TOP, Position.RIGHT, Position.LEFT],\n [Position.LEFT]: [Position.RIGHT, Position.TOP, Position.BOTTOM],\n [Position.RIGHT]: [Position.LEFT, Position.TOP, Position.BOTTOM],\n};\n\nexport type PanelProps = PropsWithChildren<{\n arrow?: boolean;\n flip?: boolean;\n altAxis?: boolean;\n open?: boolean;\n onClose?: (event: Event | SyntheticEvent) => void;\n position?: PositionBottom | PositionLeft | PositionRight | PositionTop;\n anchorRef: MutableRefObject<Element | null>;\n anchorWidth?: boolean;\n considerHeight?: boolean;\n}> &\n HTMLAttributes<HTMLDivElement>;\n\nconst Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(\n {\n arrow = false,\n flip = true,\n altAxis = false,\n children,\n open = false,\n onClose,\n position = Position.BOTTOM,\n anchorRef,\n anchorWidth = false,\n considerHeight = false,\n ...rest\n }: PanelProps,\n reference,\n) {\n const [arrowElement, setArrowElement] = useState<HTMLDivElement | null>(null);\n const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n\n const modifiers = [];\n\n if (altAxis) {\n modifiers.push({\n // https://popper.js.org/docs/v2/modifiers/prevent-overflow\n name: 'preventOverflow',\n options: {\n altAxis: true,\n tether: false,\n },\n });\n }\n\n if (arrow) {\n modifiers.push({\n name: 'arrow',\n options: {\n element: arrowElement,\n options: {\n padding: 8, // 8px from the edges of the popper\n },\n },\n });\n // This lets you displace a popper element from its reference element.\n modifiers.push({ name: 'offset', options: { offset: POPOVER_OFFSET } });\n }\n if (flip && fallbackPlacements[position]) {\n modifiers.push({\n name: 'flip',\n options: {\n fallbackPlacements: fallbackPlacements[position],\n },\n });\n }\n\n const { styles, attributes, forceUpdate } = usePopper(anchorRef.current, popperElement, {\n placement: position,\n modifiers,\n });\n\n // If the trigger is not visible when the position is calculated, it will be incorrect. Because this can happen repeatedly (on resize for example),\n // it is most simple just to always position before opening\n useEffect(() => {\n if (open && forceUpdate) {\n forceUpdate();\n }\n }, [open]);\n\n const contentStyle: CSSProperties = {\n ...(anchorWidth ? { width: anchorRef.current?.clientWidth } : undefined),\n };\n\n const overlayId = useContext(OverlayIdContext);\n\n return (\n <Dimmer open={open} transparent fadeContentOnEnter fadeContentOnExit onClose={onClose}>\n <div\n id={overlayId}\n {...rest}\n ref={setPopperElement}\n role=\"dialog\"\n style={{ ...styles.popper }}\n {...attributes.popper}\n className={clsx('np-panel', { 'np-panel--open': open }, rest.className)}\n >\n <div ref={reference} style={contentStyle} className={clsx('np-panel__content')}>\n {children}\n {/* Arrow has to stay inside content to get the same animations as the \"dialog\" and to get hidden when panel is closed. */}\n {arrow && (\n <div ref={setArrowElement} className={clsx('np-panel__arrow')} style={styles.arrow} />\n )}\n </div>\n </div>\n </Dimmer>\n );\n});\n\nexport default Panel;\n"],"names":["POPOVER_OFFSET","fallbackPlacements","Position","TOP","BOTTOM","RIGHT","LEFT","Panel","forwardRef","arrow","flip","altAxis","children","open","onClose","position","anchorRef","anchorWidth","considerHeight","rest","reference","arrowElement","setArrowElement","useState","popperElement","setPopperElement","modifiers","push","name","options","tether","element","padding","offset","styles","attributes","forceUpdate","usePopper","current","placement","useEffect","contentStyle","width","clientWidth","undefined","overlayId","useContext","OverlayIdContext","_jsx","Dimmer","transparent","fadeContentOnEnter","fadeContentOnExit","id","ref","role","style","popper","className","clsx","_jsxs"],"mappings":"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"}
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
+
var documentIosClick = require('../domHelpers/documentIosClick.js');
|
|
6
7
|
require('../theme.js');
|
|
7
8
|
require('../direction.js');
|
|
8
9
|
require('../propsValues/control.js');
|
|
@@ -44,12 +45,15 @@ const ResponsivePanel = /*#__PURE__*/React.forwardRef(function ResponsivePanel({
|
|
|
44
45
|
position: position$1 = position.Position.BOTTOM,
|
|
45
46
|
anchorWidth = false,
|
|
46
47
|
'aria-label': ariaLabel,
|
|
48
|
+
considerHeight = false,
|
|
47
49
|
'aria-labelledby': ariaLabelledBy
|
|
48
50
|
}, reference) {
|
|
49
51
|
const {
|
|
50
52
|
isMobile
|
|
51
53
|
} = useLayout.useLayout();
|
|
52
|
-
|
|
54
|
+
const SHORT_SCREEN = 500;
|
|
55
|
+
const isShortViewport = considerHeight && !documentIosClick.isServerSide() && window.innerHeight < SHORT_SCREEN;
|
|
56
|
+
if (isMobile || isShortViewport) {
|
|
53
57
|
return /*#__PURE__*/jsxRuntime.jsx(BottomSheet.default, {
|
|
54
58
|
"aria-label": ariaLabel,
|
|
55
59
|
"aria-labelledby": ariaLabelledBy,
|
|
@@ -68,6 +72,7 @@ const ResponsivePanel = /*#__PURE__*/React.forwardRef(function ResponsivePanel({
|
|
|
68
72
|
anchorWidth: anchorWidth,
|
|
69
73
|
anchorRef: anchorRef,
|
|
70
74
|
"aria-label": ariaLabel,
|
|
75
|
+
considerHeight: considerHeight,
|
|
71
76
|
"aria-labelledby": ariaLabelledBy,
|
|
72
77
|
className: className,
|
|
73
78
|
onClose: onClose,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResponsivePanel.js","sources":["../../../src/common/responsivePanel/ResponsivePanel.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { Position } from '..';\nimport BottomSheet from '../bottomSheet';\nimport { useLayout } from '../hooks';\nimport Panel, { type PanelProps } from '../panel';\n\nconst ResponsivePanel = forwardRef<HTMLDivElement, PanelProps>(function ResponsivePanel(\n {\n anchorRef,\n arrow = false,\n flip = true,\n children,\n className = undefined,\n onClose,\n open = false,\n position = Position.BOTTOM,\n anchorWidth = false,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n }: PanelProps,\n reference,\n) {\n const { isMobile } = useLayout();\n if (isMobile) {\n return (\n <BottomSheet\n key=\"bottomSheet\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n open={open}\n className={className}\n onClose={onClose}\n >\n {children}\n </BottomSheet>\n );\n }\n return (\n <Panel\n key=\"panel\"\n ref={reference}\n flip={flip}\n arrow={arrow}\n open={open}\n position={position}\n anchorWidth={anchorWidth}\n anchorRef={anchorRef}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n className={className}\n onClose={onClose}\n >\n {children}\n </Panel>\n );\n});\n\nexport default ResponsivePanel;\n"],"names":["ResponsivePanel","forwardRef","anchorRef","arrow","flip","children","className","undefined","onClose","open","position","Position","BOTTOM","anchorWidth","ariaLabel","ariaLabelledBy","reference","isMobile","useLayout","_jsx","BottomSheet","Panel","ref"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ResponsivePanel.js","sources":["../../../src/common/responsivePanel/ResponsivePanel.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { Position } from '..';\nimport BottomSheet from '../bottomSheet';\nimport { useLayout } from '../hooks';\nimport Panel, { type PanelProps } from '../panel';\nimport { isServerSide } from '../domHelpers';\n\nconst ResponsivePanel = forwardRef<HTMLDivElement, PanelProps>(function ResponsivePanel(\n {\n anchorRef,\n arrow = false,\n flip = true,\n children,\n className = undefined,\n onClose,\n open = false,\n position = Position.BOTTOM,\n anchorWidth = false,\n 'aria-label': ariaLabel,\n considerHeight = false,\n 'aria-labelledby': ariaLabelledBy,\n }: PanelProps,\n reference,\n) {\n const { isMobile } = useLayout();\n const SHORT_SCREEN = 500;\n const isShortViewport = considerHeight && !isServerSide() && window.innerHeight < SHORT_SCREEN;\n\n if (isMobile || isShortViewport) {\n return (\n <BottomSheet\n key=\"bottomSheet\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n open={open}\n className={className}\n onClose={onClose}\n >\n {children}\n </BottomSheet>\n );\n }\n return (\n <Panel\n key=\"panel\"\n ref={reference}\n flip={flip}\n arrow={arrow}\n open={open}\n position={position}\n anchorWidth={anchorWidth}\n anchorRef={anchorRef}\n aria-label={ariaLabel}\n considerHeight={considerHeight}\n aria-labelledby={ariaLabelledBy}\n className={className}\n onClose={onClose}\n >\n {children}\n </Panel>\n );\n});\n\nexport default ResponsivePanel;\n"],"names":["ResponsivePanel","forwardRef","anchorRef","arrow","flip","children","className","undefined","onClose","open","position","Position","BOTTOM","anchorWidth","ariaLabel","considerHeight","ariaLabelledBy","reference","isMobile","useLayout","SHORT_SCREEN","isShortViewport","isServerSide","window","innerHeight","_jsx","BottomSheet","Panel","ref"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAMA,eAAe,gBAAGC,gBAAU,CAA6B,SAASD,eAAeA,CACrF;EACEE,SAAS;AACTC,EAAAA,KAAK,GAAG,KAAK;AACbC,EAAAA,IAAI,GAAG,IAAI;EACXC,QAAQ;AACRC,EAAAA,SAAS,GAAGC,SAAS;EACrBC,OAAO;AACPC,EAAAA,IAAI,GAAG,KAAK;YACZC,UAAQ,GAAGC,iBAAQ,CAACC,MAAM;AAC1BC,EAAAA,WAAW,GAAG,KAAK;AACnB,EAAA,YAAY,EAAEC,SAAS;AACvBC,EAAAA,cAAc,GAAG,KAAK;AACtB,EAAA,iBAAiB,EAAEC;AAAc,CACtB,EACbC,SAAS,EAAA;EAET,MAAM;AAAEC,IAAAA;GAAU,GAAGC,mBAAS,EAAE;EAChC,MAAMC,YAAY,GAAG,GAAG;AACxB,EAAA,MAAMC,eAAe,GAAGN,cAAc,IAAI,CAACO,6BAAY,EAAE,IAAIC,MAAM,CAACC,WAAW,GAAGJ,YAAY;EAE9F,IAAIF,QAAQ,IAAIG,eAAe,EAAE;IAC/B,oBACEI,cAAA,CAACC,mBAAW,EAAA;AAEV,MAAA,YAAA,EAAYZ,SAAU;AACtB,MAAA,iBAAA,EAAiBE,cAAe;AAChCP,MAAAA,IAAI,EAAEA,IAAK;AACXH,MAAAA,SAAS,EAAEA,SAAU;AACrBE,MAAAA,OAAO,EAAEA,OAAQ;AAAAH,MAAAA,QAAA,EAEhBA;AAAQ,KAAA,EAPL,aAQO,CAAC;AAElB,EAAA;EACA,oBACEoB,cAAA,CAACE,aAAK,EAAA;AAEJC,IAAAA,GAAG,EAAEX,SAAU;AACfb,IAAAA,IAAI,EAAEA,IAAK;AACXD,IAAAA,KAAK,EAAEA,KAAM;AACbM,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,QAAQ,EAAEA,UAAS;AACnBG,IAAAA,WAAW,EAAEA,WAAY;AACzBX,IAAAA,SAAS,EAAEA,SAAU;AACrB,IAAA,YAAA,EAAYY,SAAU;AACtBC,IAAAA,cAAc,EAAEA,cAAe;AAC/B,IAAA,iBAAA,EAAiBC,cAAe;AAChCV,IAAAA,SAAS,EAAEA,SAAU;AACrBE,IAAAA,OAAO,EAAEA,OAAQ;AAAAH,IAAAA,QAAA,EAEhBA;AAAQ,GAAA,EAdL,OAeC,CAAC;AAEZ,CAAC;;;;"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { forwardRef } from 'react';
|
|
2
|
+
import { isServerSide } from '../domHelpers/documentIosClick.mjs';
|
|
2
3
|
import '../theme.mjs';
|
|
3
4
|
import '../direction.mjs';
|
|
4
5
|
import '../propsValues/control.mjs';
|
|
@@ -40,12 +41,15 @@ const ResponsivePanel = /*#__PURE__*/forwardRef(function ResponsivePanel({
|
|
|
40
41
|
position = Position.BOTTOM,
|
|
41
42
|
anchorWidth = false,
|
|
42
43
|
'aria-label': ariaLabel,
|
|
44
|
+
considerHeight = false,
|
|
43
45
|
'aria-labelledby': ariaLabelledBy
|
|
44
46
|
}, reference) {
|
|
45
47
|
const {
|
|
46
48
|
isMobile
|
|
47
49
|
} = useLayout();
|
|
48
|
-
|
|
50
|
+
const SHORT_SCREEN = 500;
|
|
51
|
+
const isShortViewport = considerHeight && !isServerSide() && window.innerHeight < SHORT_SCREEN;
|
|
52
|
+
if (isMobile || isShortViewport) {
|
|
49
53
|
return /*#__PURE__*/jsx(BottomSheet, {
|
|
50
54
|
"aria-label": ariaLabel,
|
|
51
55
|
"aria-labelledby": ariaLabelledBy,
|
|
@@ -64,6 +68,7 @@ const ResponsivePanel = /*#__PURE__*/forwardRef(function ResponsivePanel({
|
|
|
64
68
|
anchorWidth: anchorWidth,
|
|
65
69
|
anchorRef: anchorRef,
|
|
66
70
|
"aria-label": ariaLabel,
|
|
71
|
+
considerHeight: considerHeight,
|
|
67
72
|
"aria-labelledby": ariaLabelledBy,
|
|
68
73
|
className: className,
|
|
69
74
|
onClose: onClose,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResponsivePanel.mjs","sources":["../../../src/common/responsivePanel/ResponsivePanel.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { Position } from '..';\nimport BottomSheet from '../bottomSheet';\nimport { useLayout } from '../hooks';\nimport Panel, { type PanelProps } from '../panel';\n\nconst ResponsivePanel = forwardRef<HTMLDivElement, PanelProps>(function ResponsivePanel(\n {\n anchorRef,\n arrow = false,\n flip = true,\n children,\n className = undefined,\n onClose,\n open = false,\n position = Position.BOTTOM,\n anchorWidth = false,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n }: PanelProps,\n reference,\n) {\n const { isMobile } = useLayout();\n if (isMobile) {\n return (\n <BottomSheet\n key=\"bottomSheet\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n open={open}\n className={className}\n onClose={onClose}\n >\n {children}\n </BottomSheet>\n );\n }\n return (\n <Panel\n key=\"panel\"\n ref={reference}\n flip={flip}\n arrow={arrow}\n open={open}\n position={position}\n anchorWidth={anchorWidth}\n anchorRef={anchorRef}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n className={className}\n onClose={onClose}\n >\n {children}\n </Panel>\n );\n});\n\nexport default ResponsivePanel;\n"],"names":["ResponsivePanel","forwardRef","anchorRef","arrow","flip","children","className","undefined","onClose","open","position","Position","BOTTOM","anchorWidth","ariaLabel","ariaLabelledBy","reference","isMobile","useLayout","_jsx","BottomSheet","Panel","ref"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ResponsivePanel.mjs","sources":["../../../src/common/responsivePanel/ResponsivePanel.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { Position } from '..';\nimport BottomSheet from '../bottomSheet';\nimport { useLayout } from '../hooks';\nimport Panel, { type PanelProps } from '../panel';\nimport { isServerSide } from '../domHelpers';\n\nconst ResponsivePanel = forwardRef<HTMLDivElement, PanelProps>(function ResponsivePanel(\n {\n anchorRef,\n arrow = false,\n flip = true,\n children,\n className = undefined,\n onClose,\n open = false,\n position = Position.BOTTOM,\n anchorWidth = false,\n 'aria-label': ariaLabel,\n considerHeight = false,\n 'aria-labelledby': ariaLabelledBy,\n }: PanelProps,\n reference,\n) {\n const { isMobile } = useLayout();\n const SHORT_SCREEN = 500;\n const isShortViewport = considerHeight && !isServerSide() && window.innerHeight < SHORT_SCREEN;\n\n if (isMobile || isShortViewport) {\n return (\n <BottomSheet\n key=\"bottomSheet\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n open={open}\n className={className}\n onClose={onClose}\n >\n {children}\n </BottomSheet>\n );\n }\n return (\n <Panel\n key=\"panel\"\n ref={reference}\n flip={flip}\n arrow={arrow}\n open={open}\n position={position}\n anchorWidth={anchorWidth}\n anchorRef={anchorRef}\n aria-label={ariaLabel}\n considerHeight={considerHeight}\n aria-labelledby={ariaLabelledBy}\n className={className}\n onClose={onClose}\n >\n {children}\n </Panel>\n );\n});\n\nexport default ResponsivePanel;\n"],"names":["ResponsivePanel","forwardRef","anchorRef","arrow","flip","children","className","undefined","onClose","open","position","Position","BOTTOM","anchorWidth","ariaLabel","considerHeight","ariaLabelledBy","reference","isMobile","useLayout","SHORT_SCREEN","isShortViewport","isServerSide","window","innerHeight","_jsx","BottomSheet","Panel","ref"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAMA,eAAe,gBAAGC,UAAU,CAA6B,SAASD,eAAeA,CACrF;EACEE,SAAS;AACTC,EAAAA,KAAK,GAAG,KAAK;AACbC,EAAAA,IAAI,GAAG,IAAI;EACXC,QAAQ;AACRC,EAAAA,SAAS,GAAGC,SAAS;EACrBC,OAAO;AACPC,EAAAA,IAAI,GAAG,KAAK;EACZC,QAAQ,GAAGC,QAAQ,CAACC,MAAM;AAC1BC,EAAAA,WAAW,GAAG,KAAK;AACnB,EAAA,YAAY,EAAEC,SAAS;AACvBC,EAAAA,cAAc,GAAG,KAAK;AACtB,EAAA,iBAAiB,EAAEC;AAAc,CACtB,EACbC,SAAS,EAAA;EAET,MAAM;AAAEC,IAAAA;GAAU,GAAGC,SAAS,EAAE;EAChC,MAAMC,YAAY,GAAG,GAAG;AACxB,EAAA,MAAMC,eAAe,GAAGN,cAAc,IAAI,CAACO,YAAY,EAAE,IAAIC,MAAM,CAACC,WAAW,GAAGJ,YAAY;EAE9F,IAAIF,QAAQ,IAAIG,eAAe,EAAE;IAC/B,oBACEI,GAAA,CAACC,WAAW,EAAA;AAEV,MAAA,YAAA,EAAYZ,SAAU;AACtB,MAAA,iBAAA,EAAiBE,cAAe;AAChCP,MAAAA,IAAI,EAAEA,IAAK;AACXH,MAAAA,SAAS,EAAEA,SAAU;AACrBE,MAAAA,OAAO,EAAEA,OAAQ;AAAAH,MAAAA,QAAA,EAEhBA;AAAQ,KAAA,EAPL,aAQO,CAAC;AAElB,EAAA;EACA,oBACEoB,GAAA,CAACE,KAAK,EAAA;AAEJC,IAAAA,GAAG,EAAEX,SAAU;AACfb,IAAAA,IAAI,EAAEA,IAAK;AACXD,IAAAA,KAAK,EAAEA,KAAM;AACbM,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,QAAQ,EAAEA,QAAS;AACnBG,IAAAA,WAAW,EAAEA,WAAY;AACzBX,IAAAA,SAAS,EAAEA,SAAU;AACrB,IAAA,YAAA,EAAYY,SAAU;AACtBC,IAAAA,cAAc,EAAEA,cAAe;AAC/B,IAAA,iBAAA,EAAiBC,cAAe;AAChCV,IAAAA,SAAS,EAAEA,SAAU;AACrBE,IAAAA,OAAO,EAAEA,OAAQ;AAAAH,IAAAA,QAAA,EAEhBA;AAAQ,GAAA,EAdL,OAeC,CAAC;AAEZ,CAAC;;;;"}
|
|
@@ -39,6 +39,7 @@ var contexts = require('../inputs/contexts.js');
|
|
|
39
39
|
var DateInput_messages = require('./DateInput.messages.js');
|
|
40
40
|
var convertToLocalMidnight = require('./utils/convertToLocalMidnight/convertToLocalMidnight.js');
|
|
41
41
|
|
|
42
|
+
const DATE_INPUT_PARENT_ID = 'dateInput';
|
|
42
43
|
const DateInput = ({
|
|
43
44
|
'aria-labelledby': ariaLabelledByProp,
|
|
44
45
|
'aria-label': ariaLabel,
|
|
@@ -62,6 +63,10 @@ const DateInput = ({
|
|
|
62
63
|
const inputAttributes = contexts.useInputAttributes({
|
|
63
64
|
nonLabelable: true
|
|
64
65
|
});
|
|
66
|
+
const fieldLabelRef = contexts.useFieldLabelRef();
|
|
67
|
+
const dayRef = React.useRef(null);
|
|
68
|
+
const monthRef = React.useRef(null);
|
|
69
|
+
const yearRef = React.useRef(null);
|
|
65
70
|
const id = idProp ?? inputAttributes.id;
|
|
66
71
|
const ariaLabelledBy = ariaLabelledByProp ?? inputAttributes['aria-labelledby'];
|
|
67
72
|
const {
|
|
@@ -102,6 +107,9 @@ const DateInput = ({
|
|
|
102
107
|
const [displayYear, setDisplayYear] = React.useState(year?.toString());
|
|
103
108
|
const [lastBroadcastedValue, setLastBroadcastedValue] = React.useState(getDateObject);
|
|
104
109
|
const monthNames = getMonthNames.getMonthNames(locale, monthFormat$1);
|
|
110
|
+
const monthYearOnly = mode === dateMode.DateMode.MONTH_YEAR;
|
|
111
|
+
const monthBeforeDay = getFormatForLocale.MDY.has(locale);
|
|
112
|
+
const yearFirst = getFormatForLocale.YMD.has(locale);
|
|
105
113
|
dayLabel ||= formatMessage(DateInput_messages.default.dayLabel);
|
|
106
114
|
monthLabel ||= formatMessage(DateInput_messages.default.monthLabel);
|
|
107
115
|
yearLabel ||= formatMessage(DateInput_messages.default.yearLabel);
|
|
@@ -110,6 +118,25 @@ const DateInput = ({
|
|
|
110
118
|
month: placeholders?.month || formatMessage(DateInput_messages.default.monthLabel),
|
|
111
119
|
year: placeholders?.year || formatMessage(DateInput_messages.default.yearPlaceholder)
|
|
112
120
|
};
|
|
121
|
+
React.useEffect(() => {
|
|
122
|
+
const labelRef = fieldLabelRef?.current;
|
|
123
|
+
if (labelRef) {
|
|
124
|
+
const handleLabelClick = () => {
|
|
125
|
+
// Not the best way to do this, but we're forced to recreate the native Label-click behavior
|
|
126
|
+
if (monthYearOnly || monthBeforeDay) {
|
|
127
|
+
monthRef.current?.click();
|
|
128
|
+
} else if (yearFirst) {
|
|
129
|
+
yearRef.current?.focus();
|
|
130
|
+
} else {
|
|
131
|
+
dayRef.current?.focus();
|
|
132
|
+
}
|
|
133
|
+
};
|
|
134
|
+
labelRef.addEventListener('click', handleLabelClick);
|
|
135
|
+
return () => {
|
|
136
|
+
labelRef?.removeEventListener('click', handleLabelClick);
|
|
137
|
+
};
|
|
138
|
+
}
|
|
139
|
+
}, [fieldLabelRef, id, monthBeforeDay, monthYearOnly, yearFirst]);
|
|
113
140
|
const getDateAsString = date => {
|
|
114
141
|
if (!isDateValid.isDateValid(date)) {
|
|
115
142
|
return '';
|
|
@@ -129,7 +156,9 @@ const DateInput = ({
|
|
|
129
156
|
type: typography.Typography.BODY_DEFAULT,
|
|
130
157
|
children: monthLabel
|
|
131
158
|
}), /*#__PURE__*/jsxRuntime.jsx(SelectInput.SelectInput, {
|
|
159
|
+
triggerRef: monthRef,
|
|
132
160
|
id: `${id}:month`,
|
|
161
|
+
parentId: DATE_INPUT_PARENT_ID,
|
|
133
162
|
name: "month",
|
|
134
163
|
disabled: disabled,
|
|
135
164
|
placeholder: placeholders?.month,
|
|
@@ -213,7 +242,6 @@ const DateInput = ({
|
|
|
213
242
|
onChange(newValue != null ? getDateAsString(newValue) : null);
|
|
214
243
|
}
|
|
215
244
|
};
|
|
216
|
-
const monthYearOnly = mode === dateMode.DateMode.MONTH_YEAR;
|
|
217
245
|
const monthWidth = clsx.clsx({
|
|
218
246
|
'col-sm-8 tw-date--month': monthYearOnly,
|
|
219
247
|
'col-sm-5 tw-date--month': !monthYearOnly
|
|
@@ -232,8 +260,9 @@ const DateInput = ({
|
|
|
232
260
|
type: typography.Typography.BODY_DEFAULT,
|
|
233
261
|
children: dayLabel
|
|
234
262
|
}), /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
235
|
-
className: `input-group input-group-${size$1}`,
|
|
263
|
+
className: `input-group input-group-${size$1} ${disabled ? 'disabled' : ''}`,
|
|
236
264
|
children: /*#__PURE__*/jsxRuntime.jsx(Input.Input, {
|
|
265
|
+
ref: dayRef,
|
|
237
266
|
id: `${id}:day`,
|
|
238
267
|
type: "text",
|
|
239
268
|
inputMode: "numeric",
|
|
@@ -260,8 +289,9 @@ const DateInput = ({
|
|
|
260
289
|
type: typography.Typography.BODY_DEFAULT,
|
|
261
290
|
children: yearLabel
|
|
262
291
|
}), /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
263
|
-
className: `input-group input-group-${size$1}`,
|
|
292
|
+
className: `input-group input-group-${size$1} ${disabled ? 'disabled' : ''}`,
|
|
264
293
|
children: /*#__PURE__*/jsxRuntime.jsx(Input.Input, {
|
|
294
|
+
ref: yearRef,
|
|
265
295
|
id: `${id}:year`,
|
|
266
296
|
type: "text",
|
|
267
297
|
inputMode: "numeric",
|
|
@@ -280,16 +310,14 @@ const DateInput = ({
|
|
|
280
310
|
})
|
|
281
311
|
});
|
|
282
312
|
};
|
|
283
|
-
|
|
284
|
-
const yearFirst = getFormatForLocale.YMD.has(locale);
|
|
285
|
-
return /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
286
|
-
className: "tw-date",
|
|
287
|
-
...inputAttributes,
|
|
313
|
+
return /*#__PURE__*/jsxRuntime.jsx("fieldset", {
|
|
288
314
|
id: id,
|
|
315
|
+
className: "tw-date",
|
|
316
|
+
"aria-describedby": inputAttributes['aria-describedby'],
|
|
317
|
+
"aria-invalid": inputAttributes['aria-invalid'],
|
|
289
318
|
"aria-labelledby": ariaLabelledBy,
|
|
290
319
|
"aria-label": ariaLabel,
|
|
291
|
-
|
|
292
|
-
,
|
|
320
|
+
"data-wds-dateinput": "",
|
|
293
321
|
onFocus: event => shouldPropagateOnFocus(event) ? onFocus?.(event) : event.stopPropagation(),
|
|
294
322
|
onBlur: event => shouldPropagateOnBlur(event) ? onBlur?.(event) : event.stopPropagation(),
|
|
295
323
|
children: /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
@@ -322,25 +350,19 @@ function shouldPropagateOnFocus({
|
|
|
322
350
|
target,
|
|
323
351
|
relatedTarget
|
|
324
352
|
}) {
|
|
325
|
-
const
|
|
326
|
-
const
|
|
327
|
-
return
|
|
353
|
+
const blurredElementParent = target.closest('[data-wds-dateinput]');
|
|
354
|
+
const focusedElementParent = relatedTarget?.closest('[data-wds-dateinput]');
|
|
355
|
+
return blurredElementParent !== focusedElementParent;
|
|
328
356
|
}
|
|
329
|
-
// Should only propagate if the
|
|
357
|
+
// Should only propagate if the focus-gaining element is not part
|
|
358
|
+
// of this DateInput component or the (dropdown) of the month select.
|
|
330
359
|
function shouldPropagateOnBlur({
|
|
331
360
|
target,
|
|
332
361
|
relatedTarget
|
|
333
362
|
}) {
|
|
334
|
-
const
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
// "IE11 sets document.activeElement to the next focused element before the blur event is called."
|
|
338
|
-
// (https://stackoverflow.com/a/49325196/986241)
|
|
339
|
-
// Therefore if the relatedTarget is null, we try the document.activeElement,
|
|
340
|
-
// which may contain the HTML element that is gaining focus
|
|
341
|
-
const focusElement = relatedTarget || (document.activeElement !== target ? document.activeElement : null);
|
|
342
|
-
const focusElementParent = focusElement && focusElement.closest('.tw-date');
|
|
343
|
-
return blurElementParent !== focusElementParent;
|
|
363
|
+
const blurredElementParent = target.closest('[data-wds-dateinput]');
|
|
364
|
+
const focusedElementParent = relatedTarget?.closest('[data-wds-dateinput]');
|
|
365
|
+
return blurredElementParent !== focusedElementParent && !target?.closest(`[data-wds-parent="${DATE_INPUT_PARENT_ID}"]`) && !relatedTarget?.closest(`[data-wds-parent="${DATE_INPUT_PARENT_ID}"]`);
|
|
344
366
|
}
|
|
345
367
|
|
|
346
368
|
exports.default = DateInput;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateInput.js","sources":["../../src/dateInput/DateInput.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useState } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport Body from '../body';\nimport { Input } from '../inputs/Input';\nimport {\n SelectInput,\n SelectInputOptionContent,\n type SelectInputProps,\n} from '../inputs/SelectInput';\nimport {\n DateMode,\n MonthFormat,\n Size,\n SizeLarge,\n SizeMedium,\n SizeSmall,\n Typography,\n} from '../common';\nimport { MDY, YMD, getMonthNames, isDateValid, isMonthAndYearFormat } from '../common/dateUtils';\nimport { useInputAttributes } from '../inputs/contexts';\nimport messages from './DateInput.messages';\nimport { convertToLocalMidnight } from './utils';\n\nexport interface DateInputProps {\n /** @deprecated Use `Field` wrapper or the `aria-labelledby` attribute instead. */\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n disabled?: boolean;\n size?: SizeSmall | SizeMedium | SizeLarge;\n value?: Date | string;\n onChange: (value: string | null) => void;\n onFocus?: React.FocusEventHandler<HTMLDivElement>;\n onBlur?: React.FocusEventHandler<HTMLDivElement>;\n dayLabel?: string;\n dayAutoComplete?: string;\n monthLabel?: string;\n yearLabel?: string;\n yearAutoComplete?: string;\n monthFormat?: `${MonthFormat}`;\n mode?: `${DateMode}`;\n placeholders?: {\n day?: string;\n month?: string;\n year?: string;\n };\n id?: string;\n selectProps?: Partial<SelectInputProps<number | null>>;\n}\n\nconst DateInput = ({\n 'aria-labelledby': ariaLabelledByProp,\n 'aria-label': ariaLabel,\n disabled = false,\n size = Size.MEDIUM,\n value,\n dayLabel,\n dayAutoComplete,\n monthLabel,\n yearLabel,\n yearAutoComplete,\n monthFormat = MonthFormat.LONG,\n mode = DateMode.DAY_MONTH_YEAR,\n onChange,\n onFocus,\n onBlur,\n placeholders,\n id: idProp,\n selectProps = {},\n}: DateInputProps) => {\n const inputAttributes = useInputAttributes({ nonLabelable: true });\n const id = idProp ?? inputAttributes.id;\n const ariaLabelledBy = ariaLabelledByProp ?? inputAttributes['aria-labelledby'];\n\n const { locale, formatMessage } = useIntl();\n\n const getDateObject = (): Date | undefined => {\n if (value && isDateValid(value)) {\n return typeof value === 'string' ? convertToLocalMidnight(value) : value;\n }\n return undefined;\n };\n\n const getInitialDate = (unit: 'year' | 'month' | 'day'): number | null => {\n if (value && isDateValid(value)) {\n const dateObject = getDateObject();\n\n if (typeof value === 'string' && isMonthAndYearFormat(value) && unit === 'day') {\n return null;\n }\n\n if (dateObject !== undefined) {\n switch (unit) {\n case 'year':\n return dateObject.getFullYear();\n case 'month':\n return dateObject.getMonth();\n case 'day':\n return dateObject.getDate();\n default:\n return null;\n }\n }\n }\n return null;\n };\n\n const [day, setDay] = useState(() => getInitialDate('day'));\n const [displayDay, setDisplayDay] = useState(day?.toString());\n const [month, setMonth] = useState(() => getInitialDate('month'));\n const [year, setYear] = useState(() => getInitialDate('year'));\n const [displayYear, setDisplayYear] = useState(year?.toString());\n const [lastBroadcastedValue, setLastBroadcastedValue] = useState<Date | null | undefined>(\n getDateObject,\n );\n const monthNames = getMonthNames(locale, monthFormat);\n\n dayLabel ||= formatMessage(messages.dayLabel);\n monthLabel ||= formatMessage(messages.monthLabel);\n yearLabel ||= formatMessage(messages.yearLabel);\n placeholders = {\n day: placeholders?.day || formatMessage(messages.dayPlaceholder),\n month: placeholders?.month || formatMessage(messages.monthLabel),\n year: placeholders?.year || formatMessage(messages.yearPlaceholder),\n };\n\n const getDateAsString = (date: Date) => {\n if (!isDateValid(date)) {\n return '';\n }\n switch (mode) {\n case DateMode.MONTH_YEAR:\n return [date.getFullYear(), `0${date.getMonth() + 1}`.slice(-2)].join('-');\n case DateMode.DAY_MONTH_YEAR:\n default:\n return [\n date.getFullYear(),\n `0${date.getMonth() + 1}`.slice(-2),\n `0${date.getDate()}`.slice(-2),\n ].join('-');\n }\n };\n\n const getSelectElement = () => {\n return (\n <label className=\"d-flex flex-column\">\n <Body type={Typography.BODY_DEFAULT}>{monthLabel}</Body>\n <SelectInput\n id={`${id}:month`}\n name=\"month\"\n disabled={disabled}\n placeholder={placeholders?.month}\n items={Array.from({ length: 12 }, (_, index) => ({ type: 'option', value: index }))}\n size={size}\n value={month}\n renderValue={(selectedValue) => (\n <SelectInputOptionContent title={monthNames[selectedValue]} />\n )}\n onChange={(selectedValue) => handleMonthChange(selectedValue)}\n {...selectProps}\n />\n </label>\n );\n };\n\n const isDayValid = (newDay: number, newMonth: number, newYear: number) => {\n const maxDay = new Date(newYear, newMonth + 1, 0).getDate();\n return newDay <= maxDay;\n };\n\n const handleInternalValue = (newDay = day, newMonth = month, newYear = year) => {\n if (newDay == null || newDay === 0 || newMonth == null || newYear == null || newYear === 0) {\n broadcastNewValue(null);\n return;\n }\n if (!isDayValid(newDay, newMonth, newYear)) {\n broadcastNewValue(null);\n return;\n }\n\n const dateValue = new Date(newYear, newMonth, newDay);\n if (newYear < 100) {\n dateValue.setFullYear(newYear);\n }\n\n if (!isDateValid(dateValue)) {\n broadcastNewValue(null);\n return;\n }\n\n if (mode === DateMode.MONTH_YEAR) {\n if (newMonth !== month || newYear !== year) {\n broadcastNewValue(dateValue);\n }\n } else if (newDay !== day || newMonth !== month || newYear !== year) {\n broadcastNewValue(dateValue);\n }\n };\n\n const handleDayChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n const newDayString = event.target.value.replace(/\\D/g, '');\n const newDayNumber = Number.parseInt(newDayString, 10);\n\n setDay(newDayNumber);\n setDisplayDay(newDayString);\n handleInternalValue(newDayNumber, month, year);\n };\n\n const handleMonthChange = (selectedMonth: number | null) => {\n if (selectedMonth === null) {\n setMonth(null);\n handleInternalValue(day, null, year);\n return;\n }\n setMonth(selectedMonth);\n handleInternalValue(day, selectedMonth, year);\n };\n\n const handleYearChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n const newYearString = event.target.value.replace(/\\D/g, '');\n const newYearNumber = Number.parseInt(newYearString, 10);\n\n if (newYearString.length >= 4 && newYearString.length <= 6) {\n setYear(newYearNumber);\n setDisplayYear(newYearString);\n handleInternalValue(day, month, newYearNumber);\n } else {\n setYear(null);\n setDisplayYear(newYearString);\n handleInternalValue(day, month, null);\n }\n };\n\n const broadcastNewValue = (newValue: Date | null) => {\n if (newValue !== lastBroadcastedValue) {\n setLastBroadcastedValue(newValue);\n onChange(newValue != null ? getDateAsString(newValue) : null);\n }\n };\n\n const monthYearOnly = mode === DateMode.MONTH_YEAR;\n\n const monthWidth = clsx({\n 'col-sm-8 tw-date--month': monthYearOnly,\n 'col-sm-5 tw-date--month': !monthYearOnly,\n });\n\n const getMonth = () => {\n return <div className={monthWidth}>{getSelectElement()}</div>;\n };\n\n const getDay = () => {\n return (\n <div className=\"col-sm-3 tw-date--day\">\n <label>\n <Body type={Typography.BODY_DEFAULT}>{dayLabel}</Body>\n <div className={`input-group input-group-${size}`}>\n <Input\n id={`${id}:day`}\n type=\"text\"\n inputMode=\"numeric\"\n pattern=\"[0-9]*\"\n name=\"day\"\n autoComplete={dayAutoComplete}\n value={displayDay || ''}\n placeholder={placeholders?.day}\n disabled={disabled}\n min={1}\n max={31}\n maxLength={2}\n onChange={(event) => handleDayChange(event)}\n />\n </div>\n </label>\n </div>\n );\n };\n\n const getYear = () => {\n return (\n <div className=\"col-sm-4 tw-date--year\">\n <label>\n <Body type={Typography.BODY_DEFAULT}>{yearLabel}</Body>\n <div className={`input-group input-group-${size}`}>\n <Input\n id={`${id}:year`}\n type=\"text\"\n inputMode=\"numeric\"\n pattern=\"[0-9]*\"\n name=\"year\"\n autoComplete={yearAutoComplete}\n placeholder={placeholders?.year}\n value={displayYear || ''}\n disabled={disabled}\n min={0}\n max={9999}\n maxLength={6}\n onChange={(event) => handleYearChange(event)}\n />\n </div>\n </label>\n </div>\n );\n };\n const monthBeforeDay = MDY.has(locale);\n const yearFirst = YMD.has(locale);\n\n return (\n <div\n className=\"tw-date\"\n {...inputAttributes}\n id={id}\n aria-labelledby={ariaLabelledBy}\n aria-label={ariaLabel}\n role=\"group\" // Add role attribute to indicate container for interactive elements\n onFocus={(event) =>\n shouldPropagateOnFocus(event) ? onFocus?.(event) : event.stopPropagation()\n }\n onBlur={(event) => (shouldPropagateOnBlur(event) ? onBlur?.(event) : event.stopPropagation())}\n >\n <div className=\"row\">\n {(() => {\n if (monthYearOnly) {\n return (\n <>\n {!yearFirst && getMonth()}\n {getYear()}\n {yearFirst && getMonth()}\n </>\n );\n }\n if (monthBeforeDay) {\n return (\n <>\n {getMonth()}\n {getDay()}\n {getYear()}\n </>\n );\n }\n if (yearFirst) {\n return (\n <>\n {getYear()}\n {getMonth()}\n {getDay()}\n </>\n );\n }\n return (\n <>\n {getDay()}\n {getMonth()}\n {getYear()}\n </>\n );\n })()}\n </div>\n </div>\n );\n};\n\n// Should only propagate if the relatedTarget is not part of this DateInput component.\nfunction shouldPropagateOnFocus({\n target,\n relatedTarget,\n}: Pick<React.FocusEvent, 'target' | 'relatedTarget'>) {\n const targetParent = target.closest('.tw-date');\n const relatedParent = relatedTarget && relatedTarget.closest('.tw-date');\n return targetParent !== relatedParent;\n}\n\n// Should only propagate if the relatedTarget or the activeElement is not part of this DateInput component.\nfunction shouldPropagateOnBlur({\n target,\n relatedTarget,\n}: Pick<React.FocusEvent, 'target' | 'relatedTarget'>) {\n const blurElementParent = target.closest('.tw-date');\n // Even though FocusEvent.relatedTarget is supported by IE\n // (https://developer.mozilla.org/en-US/docs/Web/API/FocusEvent/relatedTarget)\n // \"IE11 sets document.activeElement to the next focused element before the blur event is called.\"\n // (https://stackoverflow.com/a/49325196/986241)\n // Therefore if the relatedTarget is null, we try the document.activeElement,\n // which may contain the HTML element that is gaining focus\n const focusElement =\n relatedTarget || (document.activeElement !== target ? document.activeElement : null);\n const focusElementParent = focusElement && focusElement.closest('.tw-date');\n return blurElementParent !== focusElementParent;\n}\n\nexport default DateInput;\n"],"names":["DateInput","ariaLabelledByProp","ariaLabel","disabled","size","Size","MEDIUM","value","dayLabel","dayAutoComplete","monthLabel","yearLabel","yearAutoComplete","monthFormat","MonthFormat","LONG","mode","DateMode","DAY_MONTH_YEAR","onChange","onFocus","onBlur","placeholders","id","idProp","selectProps","inputAttributes","useInputAttributes","nonLabelable","ariaLabelledBy","locale","formatMessage","useIntl","getDateObject","isDateValid","convertToLocalMidnight","undefined","getInitialDate","unit","dateObject","isMonthAndYearFormat","getFullYear","getMonth","getDate","day","setDay","useState","displayDay","setDisplayDay","toString","month","setMonth","year","setYear","displayYear","setDisplayYear","lastBroadcastedValue","setLastBroadcastedValue","monthNames","getMonthNames","messages","dayPlaceholder","yearPlaceholder","getDateAsString","date","MONTH_YEAR","slice","join","getSelectElement","_jsxs","className","children","_jsx","Body","type","Typography","BODY_DEFAULT","SelectInput","name","placeholder","items","Array","from","length","_","index","renderValue","selectedValue","SelectInputOptionContent","title","handleMonthChange","isDayValid","newDay","newMonth","newYear","maxDay","Date","handleInternalValue","broadcastNewValue","dateValue","setFullYear","handleDayChange","event","newDayString","target","replace","newDayNumber","Number","parseInt","selectedMonth","handleYearChange","newYearString","newYearNumber","newValue","monthYearOnly","monthWidth","clsx","getDay","Input","inputMode","pattern","autoComplete","min","max","maxLength","getYear","monthBeforeDay","MDY","has","yearFirst","YMD","role","shouldPropagateOnFocus","stopPropagation","shouldPropagateOnBlur","_Fragment","relatedTarget","targetParent","closest","relatedParent","blurElementParent","focusElement","document","activeElement","focusElementParent"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DateInput.js","sources":["../../src/dateInput/DateInput.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useEffect, useRef, useState } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport Body from '../body';\nimport { Input } from '../inputs/Input';\nimport {\n SelectInput,\n SelectInputOptionContent,\n type SelectInputProps,\n} from '../inputs/SelectInput';\nimport {\n DateMode,\n MonthFormat,\n Size,\n SizeLarge,\n SizeMedium,\n SizeSmall,\n Typography,\n} from '../common';\nimport { MDY, YMD, getMonthNames, isDateValid, isMonthAndYearFormat } from '../common/dateUtils';\nimport { useFieldLabelRef, useInputAttributes } from '../inputs/contexts';\nimport messages from './DateInput.messages';\nimport { convertToLocalMidnight } from './utils';\n\nexport interface DateInputProps {\n /** @deprecated Use `Field` wrapper or the `aria-labelledby` attribute instead. */\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n disabled?: boolean;\n size?: SizeSmall | SizeMedium | SizeLarge;\n value?: Date | string;\n onChange: (value: string | null) => void;\n onFocus?: React.FocusEventHandler<HTMLDivElement | HTMLFieldSetElement>;\n onBlur?: React.FocusEventHandler<HTMLDivElement | HTMLFieldSetElement>;\n dayLabel?: string;\n dayAutoComplete?: string;\n monthLabel?: string;\n yearLabel?: string;\n yearAutoComplete?: string;\n monthFormat?: `${MonthFormat}`;\n mode?: `${DateMode}`;\n placeholders?: {\n day?: string;\n month?: string;\n year?: string;\n };\n id?: string;\n selectProps?: Partial<SelectInputProps<number | null>>;\n}\n\n/**\n * To be passed to SelectInput's parentId prop for correct blur handling.\n */\nconst DATE_INPUT_PARENT_ID = 'dateInput';\n\nconst DateInput = ({\n 'aria-labelledby': ariaLabelledByProp,\n 'aria-label': ariaLabel,\n disabled = false,\n size = Size.MEDIUM,\n value,\n dayLabel,\n dayAutoComplete,\n monthLabel,\n yearLabel,\n yearAutoComplete,\n monthFormat = MonthFormat.LONG,\n mode = DateMode.DAY_MONTH_YEAR,\n onChange,\n onFocus,\n onBlur,\n placeholders,\n id: idProp,\n selectProps = {},\n}: DateInputProps) => {\n const inputAttributes = useInputAttributes({ nonLabelable: true });\n const fieldLabelRef = useFieldLabelRef();\n const dayRef = useRef<HTMLInputElement>(null);\n const monthRef = useRef<HTMLButtonElement>(null);\n const yearRef = useRef<HTMLInputElement>(null);\n const id = idProp ?? inputAttributes.id;\n const ariaLabelledBy = ariaLabelledByProp ?? inputAttributes['aria-labelledby'];\n\n const { locale, formatMessage } = useIntl();\n\n const getDateObject = (): Date | undefined => {\n if (value && isDateValid(value)) {\n return typeof value === 'string' ? convertToLocalMidnight(value) : value;\n }\n return undefined;\n };\n\n const getInitialDate = (unit: 'year' | 'month' | 'day'): number | null => {\n if (value && isDateValid(value)) {\n const dateObject = getDateObject();\n\n if (typeof value === 'string' && isMonthAndYearFormat(value) && unit === 'day') {\n return null;\n }\n\n if (dateObject !== undefined) {\n switch (unit) {\n case 'year':\n return dateObject.getFullYear();\n case 'month':\n return dateObject.getMonth();\n case 'day':\n return dateObject.getDate();\n default:\n return null;\n }\n }\n }\n return null;\n };\n\n const [day, setDay] = useState(() => getInitialDate('day'));\n const [displayDay, setDisplayDay] = useState(day?.toString());\n const [month, setMonth] = useState(() => getInitialDate('month'));\n const [year, setYear] = useState(() => getInitialDate('year'));\n const [displayYear, setDisplayYear] = useState(year?.toString());\n const [lastBroadcastedValue, setLastBroadcastedValue] = useState<Date | null | undefined>(\n getDateObject,\n );\n const monthNames = getMonthNames(locale, monthFormat);\n\n const monthYearOnly = mode === DateMode.MONTH_YEAR;\n const monthBeforeDay = MDY.has(locale);\n const yearFirst = YMD.has(locale);\n\n dayLabel ||= formatMessage(messages.dayLabel);\n monthLabel ||= formatMessage(messages.monthLabel);\n yearLabel ||= formatMessage(messages.yearLabel);\n placeholders = {\n day: placeholders?.day || formatMessage(messages.dayPlaceholder),\n month: placeholders?.month || formatMessage(messages.monthLabel),\n year: placeholders?.year || formatMessage(messages.yearPlaceholder),\n };\n\n useEffect(() => {\n const labelRef = fieldLabelRef?.current;\n\n if (labelRef) {\n const handleLabelClick = () => {\n // Not the best way to do this, but we're forced to recreate the native Label-click behavior\n if (monthYearOnly || monthBeforeDay) {\n monthRef.current?.click();\n } else if (yearFirst) {\n yearRef.current?.focus();\n } else {\n dayRef.current?.focus();\n }\n };\n\n labelRef.addEventListener('click', handleLabelClick);\n\n return () => {\n labelRef?.removeEventListener('click', handleLabelClick);\n };\n }\n }, [fieldLabelRef, id, monthBeforeDay, monthYearOnly, yearFirst]);\n\n const getDateAsString = (date: Date) => {\n if (!isDateValid(date)) {\n return '';\n }\n switch (mode) {\n case DateMode.MONTH_YEAR:\n return [date.getFullYear(), `0${date.getMonth() + 1}`.slice(-2)].join('-');\n case DateMode.DAY_MONTH_YEAR:\n default:\n return [\n date.getFullYear(),\n `0${date.getMonth() + 1}`.slice(-2),\n `0${date.getDate()}`.slice(-2),\n ].join('-');\n }\n };\n\n const getSelectElement = () => {\n return (\n <label className=\"d-flex flex-column\">\n <Body type={Typography.BODY_DEFAULT}>{monthLabel}</Body>\n <SelectInput\n triggerRef={monthRef}\n id={`${id}:month`}\n parentId={DATE_INPUT_PARENT_ID}\n name=\"month\"\n disabled={disabled}\n placeholder={placeholders?.month}\n items={Array.from({ length: 12 }, (_, index) => ({ type: 'option', value: index }))}\n size={size}\n value={month}\n renderValue={(selectedValue) => (\n <SelectInputOptionContent title={monthNames[selectedValue]} />\n )}\n onChange={(selectedValue) => handleMonthChange(selectedValue)}\n {...selectProps}\n />\n </label>\n );\n };\n\n const isDayValid = (newDay: number, newMonth: number, newYear: number) => {\n const maxDay = new Date(newYear, newMonth + 1, 0).getDate();\n return newDay <= maxDay;\n };\n\n const handleInternalValue = (newDay = day, newMonth = month, newYear = year) => {\n if (newDay == null || newDay === 0 || newMonth == null || newYear == null || newYear === 0) {\n broadcastNewValue(null);\n return;\n }\n if (!isDayValid(newDay, newMonth, newYear)) {\n broadcastNewValue(null);\n return;\n }\n\n const dateValue = new Date(newYear, newMonth, newDay);\n if (newYear < 100) {\n dateValue.setFullYear(newYear);\n }\n\n if (!isDateValid(dateValue)) {\n broadcastNewValue(null);\n return;\n }\n\n if (mode === DateMode.MONTH_YEAR) {\n if (newMonth !== month || newYear !== year) {\n broadcastNewValue(dateValue);\n }\n } else if (newDay !== day || newMonth !== month || newYear !== year) {\n broadcastNewValue(dateValue);\n }\n };\n\n const handleDayChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n const newDayString = event.target.value.replace(/\\D/g, '');\n const newDayNumber = Number.parseInt(newDayString, 10);\n\n setDay(newDayNumber);\n setDisplayDay(newDayString);\n handleInternalValue(newDayNumber, month, year);\n };\n\n const handleMonthChange = (selectedMonth: number | null) => {\n if (selectedMonth === null) {\n setMonth(null);\n handleInternalValue(day, null, year);\n return;\n }\n setMonth(selectedMonth);\n handleInternalValue(day, selectedMonth, year);\n };\n\n const handleYearChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n const newYearString = event.target.value.replace(/\\D/g, '');\n const newYearNumber = Number.parseInt(newYearString, 10);\n\n if (newYearString.length >= 4 && newYearString.length <= 6) {\n setYear(newYearNumber);\n setDisplayYear(newYearString);\n handleInternalValue(day, month, newYearNumber);\n } else {\n setYear(null);\n setDisplayYear(newYearString);\n handleInternalValue(day, month, null);\n }\n };\n\n const broadcastNewValue = (newValue: Date | null) => {\n if (newValue !== lastBroadcastedValue) {\n setLastBroadcastedValue(newValue);\n onChange(newValue != null ? getDateAsString(newValue) : null);\n }\n };\n\n const monthWidth = clsx({\n 'col-sm-8 tw-date--month': monthYearOnly,\n 'col-sm-5 tw-date--month': !monthYearOnly,\n });\n\n const getMonth = () => {\n return <div className={monthWidth}>{getSelectElement()}</div>;\n };\n\n const getDay = () => {\n return (\n <div className=\"col-sm-3 tw-date--day\">\n <label>\n <Body type={Typography.BODY_DEFAULT}>{dayLabel}</Body>\n <div className={`input-group input-group-${size} ${disabled ? 'disabled' : ''}`}>\n <Input\n ref={dayRef}\n id={`${id}:day`}\n type=\"text\"\n inputMode=\"numeric\"\n pattern=\"[0-9]*\"\n name=\"day\"\n autoComplete={dayAutoComplete}\n value={displayDay || ''}\n placeholder={placeholders?.day}\n disabled={disabled}\n min={1}\n max={31}\n maxLength={2}\n onChange={(event) => handleDayChange(event)}\n />\n </div>\n </label>\n </div>\n );\n };\n\n const getYear = () => {\n return (\n <div className=\"col-sm-4 tw-date--year\">\n <label>\n <Body type={Typography.BODY_DEFAULT}>{yearLabel}</Body>\n <div className={`input-group input-group-${size} ${disabled ? 'disabled' : ''}`}>\n <Input\n ref={yearRef}\n id={`${id}:year`}\n type=\"text\"\n inputMode=\"numeric\"\n pattern=\"[0-9]*\"\n name=\"year\"\n autoComplete={yearAutoComplete}\n placeholder={placeholders?.year}\n value={displayYear || ''}\n disabled={disabled}\n min={0}\n max={9999}\n maxLength={6}\n onChange={(event) => handleYearChange(event)}\n />\n </div>\n </label>\n </div>\n );\n };\n\n return (\n <fieldset\n id={id}\n className=\"tw-date\"\n aria-describedby={inputAttributes['aria-describedby']}\n aria-invalid={inputAttributes['aria-invalid']}\n aria-labelledby={ariaLabelledBy}\n aria-label={ariaLabel}\n data-wds-dateinput=\"\"\n onFocus={(event) =>\n shouldPropagateOnFocus(event) ? onFocus?.(event) : event.stopPropagation()\n }\n onBlur={(event) => (shouldPropagateOnBlur(event) ? onBlur?.(event) : event.stopPropagation())}\n >\n <div className=\"row\">\n {(() => {\n if (monthYearOnly) {\n return (\n <>\n {!yearFirst && getMonth()}\n {getYear()}\n {yearFirst && getMonth()}\n </>\n );\n }\n if (monthBeforeDay) {\n return (\n <>\n {getMonth()}\n {getDay()}\n {getYear()}\n </>\n );\n }\n if (yearFirst) {\n return (\n <>\n {getYear()}\n {getMonth()}\n {getDay()}\n </>\n );\n }\n return (\n <>\n {getDay()}\n {getMonth()}\n {getYear()}\n </>\n );\n })()}\n </div>\n </fieldset>\n );\n};\n\n// Should only propagate if the relatedTarget is not part of this DateInput component.\nfunction shouldPropagateOnFocus({\n target,\n relatedTarget,\n}: Pick<React.FocusEvent, 'target' | 'relatedTarget'>) {\n const blurredElementParent = target.closest('[data-wds-dateinput]');\n const focusedElementParent = relatedTarget?.closest('[data-wds-dateinput]');\n return blurredElementParent !== focusedElementParent;\n}\n\n// Should only propagate if the focus-gaining element is not part\n// of this DateInput component or the (dropdown) of the month select.\nfunction shouldPropagateOnBlur({\n target,\n relatedTarget,\n}: Pick<React.FocusEvent, 'target' | 'relatedTarget'>) {\n const blurredElementParent = target.closest('[data-wds-dateinput]');\n const focusedElementParent = relatedTarget?.closest('[data-wds-dateinput]');\n\n return (\n blurredElementParent !== focusedElementParent &&\n !target?.closest(`[data-wds-parent=\"${DATE_INPUT_PARENT_ID}\"]`) &&\n !relatedTarget?.closest(`[data-wds-parent=\"${DATE_INPUT_PARENT_ID}\"]`)\n );\n}\n\nexport default DateInput;\n"],"names":["DATE_INPUT_PARENT_ID","DateInput","ariaLabelledByProp","ariaLabel","disabled","size","Size","MEDIUM","value","dayLabel","dayAutoComplete","monthLabel","yearLabel","yearAutoComplete","monthFormat","MonthFormat","LONG","mode","DateMode","DAY_MONTH_YEAR","onChange","onFocus","onBlur","placeholders","id","idProp","selectProps","inputAttributes","useInputAttributes","nonLabelable","fieldLabelRef","useFieldLabelRef","dayRef","useRef","monthRef","yearRef","ariaLabelledBy","locale","formatMessage","useIntl","getDateObject","isDateValid","convertToLocalMidnight","undefined","getInitialDate","unit","dateObject","isMonthAndYearFormat","getFullYear","getMonth","getDate","day","setDay","useState","displayDay","setDisplayDay","toString","month","setMonth","year","setYear","displayYear","setDisplayYear","lastBroadcastedValue","setLastBroadcastedValue","monthNames","getMonthNames","monthYearOnly","MONTH_YEAR","monthBeforeDay","MDY","has","yearFirst","YMD","messages","dayPlaceholder","yearPlaceholder","useEffect","labelRef","current","handleLabelClick","click","focus","addEventListener","removeEventListener","getDateAsString","date","slice","join","getSelectElement","_jsxs","className","children","_jsx","Body","type","Typography","BODY_DEFAULT","SelectInput","triggerRef","parentId","name","placeholder","items","Array","from","length","_","index","renderValue","selectedValue","SelectInputOptionContent","title","handleMonthChange","isDayValid","newDay","newMonth","newYear","maxDay","Date","handleInternalValue","broadcastNewValue","dateValue","setFullYear","handleDayChange","event","newDayString","target","replace","newDayNumber","Number","parseInt","selectedMonth","handleYearChange","newYearString","newYearNumber","newValue","monthWidth","clsx","getDay","Input","ref","inputMode","pattern","autoComplete","min","max","maxLength","getYear","shouldPropagateOnFocus","stopPropagation","shouldPropagateOnBlur","_Fragment","relatedTarget","blurredElementParent","closest","focusedElementParent"],"mappings":"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"}
|