@spaced-out/ui-design-system 0.3.46 → 0.3.47

package/CHANGELOG.md

@@ -2,6 +2,20 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.3.47](https://github.com/spaced-out/ui-design-system/compare/v0.3.47-beta.0...v0.3.47) (2025-06-24)
+
+
+### Bug Fixes
+
+* added labels support for i18n ([#360](https://github.com/spaced-out/ui-design-system/issues/360)) ([f33f4ed](https://github.com/spaced-out/ui-design-system/commit/f33f4ed8fe8346c1c884d67fd8d9ea0cd0331602))
+
+### [0.3.47-beta.0](https://github.com/spaced-out/ui-design-system/compare/v0.3.46...v0.3.47-beta.0) (2025-06-20)
+
+
+### Features
+
+* **GDS-524:** render dropdown menus via portal for improved positioning ([#353](https://github.com/spaced-out/ui-design-system/issues/353)) ([3421218](https://github.com/spaced-out/ui-design-system/commit/342121840775dfa142307858f4d8ced40c311bfd))
+
 ### [0.3.46](https://github.com/spaced-out/ui-design-system/compare/v0.3.45...v0.3.46) (2025-06-17)
 
 

package/lib/components/DateRangePicker/DateRangePicker.js

@@ -24,7 +24,9 @@ const DateRangePicker = exports.DateRangePicker = /*#__PURE__*/React.forwardRef(
     onCancel,
     classNames,
     hideTimezone = false,
-    selectedDateRange = {}
+    selectedDateRange = {},
+    startDateLabel,
+    endDateLabel
   } = _ref;
   const localTimezone = _momentTimezone.default.tz.guess();
   const {
@@ -128,6 +130,8 @@ const DateRangePicker = exports.DateRangePicker = /*#__PURE__*/React.forwardRef(
     setRangeEndMonth: setRangeEndMonthValidated,
     hideTimezone: hideTimezone,
     cardWrapperClass: (0, _classify.default)(_DateRangePickerModule.default.container, classNames?.wrapper),
-    today: today
+    today: today,
+    startDateLabel: startDateLabel,
+    endDateLabel: endDateLabel
   });
 });

package/lib/components/DateRangePicker/DateRangePicker.js.flow

@@ -45,6 +45,8 @@ export type DateRangePickerProps = {
   hideTimezone?: boolean,
   minDate?: string,
   maxDate?: string,
+  startDateLabel?: string,
+  endDateLabel?: string,
 };
 
 export const DateRangePicker: React$AbstractComponent<
@@ -61,6 +63,8 @@ export const DateRangePicker: React$AbstractComponent<
       classNames,
       hideTimezone = false,
       selectedDateRange = {},
+      startDateLabel,
+      endDateLabel,
     }: DateRangePickerProps,
     ref,
   ): React.Node => {
@@ -195,6 +199,8 @@ export const DateRangePicker: React$AbstractComponent<
         hideTimezone={hideTimezone}
         cardWrapperClass={classify(css.container, classNames?.wrapper)}
         today={today}
+        startDateLabel={startDateLabel}
+        endDateLabel={endDateLabel}
       />
     );
   },

package/lib/components/DateRangePicker/DateRangeWrapper.js

@@ -113,8 +113,8 @@ const DateRangeWrapper = exports.DateRangeWrapper = /*#__PURE__*/React.forwardRe
     cardWrapperClass,
     hideTimezone,
     today,
-    startDateLabel = 'Start Date',
-    endDateLabel = 'End Date'
+    startDateLabel,
+    endDateLabel
   } = _ref2;
   const canNavigateCloser = _moment.default.utc(rangeStartMonth).year() !== _moment.default.utc(rangeEndMonth).year() || Math.abs(_moment.default.utc(rangeStartMonth).month() - _moment.default.utc(rangeEndMonth).month()) > 1;
   const handleApplyClick = () => {
@@ -154,7 +154,7 @@ const DateRangeWrapper = exports.DateRangeWrapper = /*#__PURE__*/React.forwardRe
   }, /*#__PURE__*/React.createElement(_Text.BodySmall, {
     className: _DateRangeWrapperModule.default.selectedDate,
     color: _Text.TEXT_COLORS.secondary
-  }, `${startDateLabel}: ${(0, _dateRangePicker.getFormattedDate)(_utils.MARKERS.DATE_RANGE_START, dateRange)}`), /*#__PURE__*/React.createElement(_Icon.Icon, {
+  }, `${startDateLabel || 'Start Date'}: ${(0, _dateRangePicker.getFormattedDate)(_utils.MARKERS.DATE_RANGE_START, dateRange)}`), /*#__PURE__*/React.createElement(_Icon.Icon, {
     name: "minus",
     size: _Icon.ICON_SIZE.small,
     type: _Icon.ICON_TYPE.regular,
@@ -162,7 +162,7 @@ const DateRangeWrapper = exports.DateRangeWrapper = /*#__PURE__*/React.forwardRe
   }), /*#__PURE__*/React.createElement(_Text.BodySmall, {
     className: _DateRangeWrapperModule.default.selectedDate,
     color: _Text.TEXT_COLORS.secondary
-  }, `${endDateLabel}: ${(0, _dateRangePicker.getFormattedDate)(_utils.MARKERS.DATE_RANGE_END, dateRange)}`)), /*#__PURE__*/React.createElement("div", {
+  }, `${endDateLabel || 'End Date'}: ${(0, _dateRangePicker.getFormattedDate)(_utils.MARKERS.DATE_RANGE_END, dateRange)}`)), /*#__PURE__*/React.createElement("div", {
     className: _DateRangeWrapperModule.default.calendarMenuContainer
   }, /*#__PURE__*/React.createElement(CalendarHeader, {
     marker: _utils.MARKERS.DATE_RANGE_START,

package/lib/components/DateRangePicker/DateRangeWrapper.js.flow

@@ -188,8 +188,8 @@ export const DateRangeWrapper: React$AbstractComponent<
       cardWrapperClass,
       hideTimezone,
       today,
-      startDateLabel = 'Start Date',
-      endDateLabel = 'End Date',
+      startDateLabel,
+      endDateLabel,
     }: DateRangeWrapperProps,
     ref,
   ): React.Node => {
@@ -238,7 +238,7 @@ export const DateRangeWrapper: React$AbstractComponent<
               className={css.selectedDate}
               color={TEXT_COLORS.secondary}
             >
-              {`${startDateLabel}: ${getFormattedDate(
+              {`${startDateLabel || 'Start Date'}: ${getFormattedDate(
                 MARKERS.DATE_RANGE_START,
                 dateRange,
               )}`}
@@ -255,7 +255,7 @@ export const DateRangeWrapper: React$AbstractComponent<
               className={css.selectedDate}
               color={TEXT_COLORS.secondary}
             >
-              {`${endDateLabel}: ${getFormattedDate(
+              {`${endDateLabel || 'End Date'}: ${getFormattedDate(
                 MARKERS.DATE_RANGE_END,
                 dateRange,
               )}`}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spaced-out/ui-design-system",
-  "version": "0.3.46",
+  "version": "0.3.47",
   "main": "index.js",
   "description": "Sense UI components library",
   "author": {