@ni/spright-components 6.22.4 → 6.22.5

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.
@@ -81800,27 +81800,13 @@ focus outline in that case.
81800
81800
  return mixinGroupableColumnAPI(mixinFractionalWidthColumnAPI(mixinColumnWithPlaceholderAPI(mixinSortableColumnAPI(base))));
81801
81801
  }
81802
81802
 
81803
- function formatNumericDate(formatter, date) {
81804
- if (typeof date === 'number') {
81805
- try {
81806
- return formatter.format(date);
81807
- }
81808
- catch (_e) {
81809
- return '';
81810
- }
81811
- }
81812
- else {
81813
- return '';
81814
- }
81815
- }
81816
-
81817
81803
  /**
81818
81804
  * The group header view for displaying date/time fields as text.
81819
81805
  */
81820
81806
  class TableColumnDateTextGroupHeaderView extends TableColumnTextGroupHeaderViewBase {
81821
81807
  updateText() {
81822
81808
  if (this.columnConfig) {
81823
- this.text = formatNumericDate(this.columnConfig.formatter, this.groupHeaderValue);
81809
+ this.text = this.columnConfig.formatter.format(this.groupHeaderValue);
81824
81810
  }
81825
81811
  else {
81826
81812
  this.text = '';
@@ -81946,7 +81932,7 @@ focus outline in that case.
81946
81932
  class TableColumnDateTextCellView extends TableColumnTextCellViewBase {
81947
81933
  updateText() {
81948
81934
  if (this.columnConfig) {
81949
- this.text = formatNumericDate(this.columnConfig.formatter, this.cellRecord?.value);
81935
+ this.text = this.columnConfig.formatter.format(this.cellRecord?.value);
81950
81936
  }
81951
81937
  else {
81952
81938
  this.text = '';
@@ -81966,6 +81952,30 @@ focus outline in that case.
81966
81952
  */
81967
81953
  const DateTextFormat = {
81968
81954
  default: undefined};
81955
+ /**
81956
+ * The `Intl.DateTimeFormatOptions` properties supported by the date-text column and `DateTextFormatter`.
81957
+ */
81958
+ const supportedIntlDateTimeFormatOptionNames = [
81959
+ 'localeMatcher',
81960
+ 'weekday',
81961
+ 'era',
81962
+ 'year',
81963
+ 'month',
81964
+ 'day',
81965
+ 'hour',
81966
+ 'minute',
81967
+ 'second',
81968
+ 'dayPeriod',
81969
+ 'timeZoneName',
81970
+ 'formatMatcher',
81971
+ 'hour12',
81972
+ 'timeZone',
81973
+ 'calendar',
81974
+ 'numberingSystem',
81975
+ 'dateStyle',
81976
+ 'timeStyle',
81977
+ 'hourCycle'
81978
+ ];
81969
81979
 
81970
81980
  const dateTextValidityFlagNames = ['invalidCustomOptionsCombination'];
81971
81981
  /**
@@ -81997,6 +82007,65 @@ focus outline in that case.
81997
82007
  }
81998
82008
  };
81999
82009
 
82010
+ /**
82011
+ * A class for formatting date values using the provided locale and options.
82012
+ */
82013
+ class DateTextFormatter {
82014
+ constructor(lang, options) {
82015
+ this.options = this.resolveOptions(options);
82016
+ this.formatter = new Intl.DateTimeFormat(lang, this.options);
82017
+ }
82018
+ format(value) {
82019
+ const milliseconds = this.parseValue(value);
82020
+ if (milliseconds === undefined || !Number.isFinite(milliseconds)) {
82021
+ return '';
82022
+ }
82023
+ try {
82024
+ return this.formatter.format(milliseconds);
82025
+ }
82026
+ catch (_e) {
82027
+ return '';
82028
+ }
82029
+ }
82030
+ optionsMatch(targetOptions) {
82031
+ const resolvedTargetOptions = targetOptions ?? DateTextFormatter.defaultOptions;
82032
+ for (const name of supportedIntlDateTimeFormatOptionNames) {
82033
+ if (this.options[name] !== resolvedTargetOptions[name]) {
82034
+ return false;
82035
+ }
82036
+ }
82037
+ return true;
82038
+ }
82039
+ parseValue(value) {
82040
+ if (value instanceof Date) {
82041
+ return value.getTime();
82042
+ }
82043
+ if (typeof value === 'number') {
82044
+ return value;
82045
+ }
82046
+ return undefined;
82047
+ }
82048
+ resolveOptions(options) {
82049
+ if (options === undefined) {
82050
+ return DateTextFormatter.defaultOptions;
82051
+ }
82052
+ const supportedOptions = {};
82053
+ for (const name of supportedIntlDateTimeFormatOptionNames) {
82054
+ this.resolveOption(supportedOptions, options, name);
82055
+ }
82056
+ return supportedOptions;
82057
+ }
82058
+ resolveOption(target, source, name) {
82059
+ if (source[name] !== undefined) {
82060
+ target[name] = source[name];
82061
+ }
82062
+ }
82063
+ }
82064
+ DateTextFormatter.defaultOptions = {
82065
+ dateStyle: 'medium',
82066
+ timeStyle: 'medium'
82067
+ };
82068
+
82000
82069
  /**
82001
82070
  * The table column for displaying dates/times as text.
82002
82071
  */
@@ -82107,18 +82176,11 @@ focus outline in that case.
82107
82176
  }
82108
82177
  }
82109
82178
  createFormatter() {
82110
- let options;
82111
- if (this.format === DateTextFormat.default) {
82112
- options = {
82113
- dateStyle: 'medium',
82114
- timeStyle: 'medium'
82115
- };
82116
- }
82117
- else {
82118
- options = this.getCustomFormattingOptions();
82119
- }
82179
+ const options = this.format === DateTextFormat.default
82180
+ ? undefined
82181
+ : this.getCustomFormattingOptions();
82120
82182
  try {
82121
- return new Intl.DateTimeFormat(lang.getValueFor(this), options);
82183
+ return new DateTextFormatter(lang.getValueFor(this), options);
82122
82184
  }
82123
82185
  catch (_e) {
82124
82186
  return undefined;