expose close on select date props to use outside carbon iot

carbon-design-system · Feb 6, 2025 · fc656b7 · fc656b7
1 parent f778f01
commit fc656b7
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 1 deletion.
diff --git a/packages/react/src/components/DateTimePicker/DateTimePickerV2.jsx b/packages/react/src/components/DateTimePicker/DateTimePickerV2.jsx
@@ -33,6 +33,7 @@ const DateTimePicker = ({
   renderInPortal,
   useAutoPositioning,
   style,
+  closeOnSelect,
   ...others
 }) => {
   return useNewTimeSpinner ? (
@@ -64,6 +65,7 @@ const DateTimePicker = ({
       renderInPortal={renderInPortal}
       useAutoPositioning={useAutoPositioning}
       style={style}
+      closeOnSelect={closeOnSelect}
       others={others}
     />
   ) : (
@@ -93,6 +95,7 @@ const DateTimePicker = ({
       renderInPortal={renderInPortal}
       useAutoPositioning={useAutoPositioning}
       style={style}
+      closeOnSelect={closeOnSelect}
       others={others}
     />
   );

diff --git a/packages/react/src/components/DateTimePicker/DateTimePickerV2.story.jsx b/packages/react/src/components/DateTimePicker/DateTimePickerV2.story.jsx
@@ -202,6 +202,7 @@ export const SingleSelect = () => {
         style={{ zIndex: number('zIndex', 0) }}
         renderInPortal={boolean('renderInPortal', true)}
         locale={text('locale', 'en')}
+        closeOnSelect={boolean('Close On Select', true)}
       />
       <div style={{ height: '10rem' }} />
     </div>

diff --git a/packages/react/src/components/DateTimePicker/DateTimePickerV2WithTimeSpinner.jsx b/packages/react/src/components/DateTimePicker/DateTimePickerV2WithTimeSpinner.jsx
@@ -200,6 +200,8 @@ export const propTypes = {
   /** Auto reposition if flyout menu offscreen */
   useAutoPositioning: PropTypes.bool,
   style: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),
+  /** If is set to true Datepicker will close after date select */
+  closeOnSelect: PropTypes.bool,
 };
 
 export const defaultProps = {
@@ -298,6 +300,7 @@ export const defaultProps = {
   renderInPortal: true,
   useAutoPositioning: false,
   style: {},
+  closeOnSelect: true,
 };
 
 const DateTimePicker = ({
@@ -327,6 +330,7 @@ const DateTimePicker = ({
   renderInPortal,
   useAutoPositioning,
   style,
+  closeOnSelect,
   ...others
 }) => {
   const id = useRef(others.id || uuidv4()).current;
@@ -1220,7 +1224,7 @@ const DateTimePicker = ({
                             : null
                         }
                         locale={locale?.split('-')[0]}
-                        closeOnSelect={false}
+                        closeOnSelect={closeOnSelect}
                       >
                         <DatePickerInput
                           labelText={mergedI18n.startDateLabel}