@antscorp/antsomi-ui 1.3.5-beta.167 → 1.3.5-beta.169

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.
@@ -20,6 +20,7 @@ export interface AdvancedPickerProps {
20
20
  errorMessage?: string;
21
21
  showTime?: boolean;
22
22
  timezone?: string;
23
+ isViewMode?: boolean;
23
24
  onUpdatedNewDate?: ({ date, option }: {
24
25
  date: string;
25
26
  option: TOption;
@@ -29,7 +29,7 @@ const { Text } = Typography;
29
29
  export const AdvancedPicker = props => {
30
30
  var _a, _b;
31
31
  // Props
32
- const { label, inputStyle, dateTypeKeysShow, calculationTypeKeysShow, showCalculationTypeCondition, defaultDateTypeKey, valueType, option: propsOption, operatorKey, type, date: propsDate, format, formatInputDisplay, errorMessage, disableAfterDate, disableBeforeDate, showTime, disabled, timezone, onUpdatedNewDate, onApply, } = props;
32
+ const { label, inputStyle, dateTypeKeysShow, calculationTypeKeysShow, showCalculationTypeCondition, defaultDateTypeKey, valueType, option: propsOption, operatorKey, type, date: propsDate, format, formatInputDisplay, errorMessage, disableAfterDate, disableBeforeDate, showTime, disabled, timezone, isViewMode, onUpdatedNewDate, onApply, } = props;
33
33
  // Memo
34
34
  const newDateTypes = useMemo(() => {
35
35
  if (dateTypeKeysShow && dateTypeKeysShow.length) {
@@ -378,6 +378,10 @@ export const AdvancedPicker = props => {
378
378
  onChangeDatePicker(current);
379
379
  } }, getCellRender(current, valueType, info)));
380
380
  }, [valueType, format, date]);
381
+ if (isViewMode)
382
+ return (React.createElement(Space, { direction: "vertical", size: 5, className: "antsomi-advanced-picker-container", ref: ref },
383
+ !!label && typeof label === 'string' ? (React.createElement(Text, { style: { color: '#666666' } }, label)) : (label),
384
+ React.createElement("span", { className: "date-picker__title--view-mode" }, selectedDateTitle)));
381
385
  return (React.createElement(Space, { direction: "vertical", size: 5, className: "antsomi-advanced-picker-container", ref: ref },
382
386
  !!label && typeof label === 'string' ? (React.createElement(Text, { style: { color: '#666666' } }, label)) : (label),
383
387
  option.dateType.value === 'fixed' &&
@@ -2,6 +2,7 @@ import React, { ReactNode } from 'react';
2
2
  import { TShowCalculationTypeCondition, ValueTypes } from '../AdvancedPicker/types';
3
3
  import { TDateConfig, TOnChangePayload, TTimeRange } from './types';
4
4
  export interface AdvancedRangePickerProps {
5
+ className?: string;
5
6
  valueType?: ValueTypes;
6
7
  disabled?: boolean;
7
8
  showCalculationTypeCondition?: TShowCalculationTypeCondition;
@@ -14,6 +15,7 @@ export interface AdvancedRangePickerProps {
14
15
  timezone?: string;
15
16
  separator?: ReactNode;
16
17
  inputStyle?: React.CSSProperties;
18
+ isViewMode?: boolean;
17
19
  onChange?: ({ timeRange, mode }: TOnChangePayload) => void;
18
20
  }
19
21
  export declare const AdvancedRangePicker: React.FC<AdvancedRangePickerProps>;
@@ -19,7 +19,7 @@ const PATH = '@antscorp/antsomi-ui/es/components/molecules/DatePicker/components
19
19
  export const AdvancedRangePicker = props => {
20
20
  const { t } = i18nInstance;
21
21
  // Props
22
- const { valueType, timeRange, errorMessage, showLabel, startDateConfig, endDateConfig, showTime, showCalculationTypeCondition, disabled, timezone, separator, inputStyle, onChange, } = props;
22
+ const { className, valueType, timeRange, errorMessage, showLabel, startDateConfig, endDateConfig, showTime, showCalculationTypeCondition, disabled, timezone, separator, inputStyle, isViewMode, onChange, } = props;
23
23
  const [timeRangeState, setTimeRange] = useState(timeRange);
24
24
  useDeepCompareEffect(() => {
25
25
  if (typeof onChange === 'function') {
@@ -54,10 +54,10 @@ export const AdvancedRangePicker = props => {
54
54
  });
55
55
  }
56
56
  };
57
- return (React.createElement(Space, { size: 20, align: "end" },
58
- React.createElement(AdvancedPicker, { valueType: valueType, disabled: disabled, label: showLabel ? t(translations.datePicker.startDate) || '' : '', date: timeRange.startDate.date, option: omit(timeRange.startDate, 'date'), operatorKey: "between", type: "startDate", format: ADVANCED_RANGE_PICKER_FORMAT.startDate, errorMessage: errorMessage, disableAfterDate: timeRange.endDate.date, showTime: showTime, calculationTypeKeysShow: startDateConfig === null || startDateConfig === void 0 ? void 0 : startDateConfig.calculationTypeKeysShow, showCalculationTypeCondition: showCalculationTypeCondition, timezone: timezone, onUpdatedNewDate: ({ date }) => onUpdateTimeRange('startDate', { date }, 'system'), onApply: ({ date, option }) => onUpdateTimeRange('startDate', Object.assign({ date }, option), 'user'), inputStyle: inputStyle }),
57
+ return (React.createElement(Space, { size: 20, align: "end", className: className || '' },
58
+ React.createElement(AdvancedPicker, { valueType: valueType, disabled: disabled, label: showLabel ? t(translations.datePicker.startDate) || '' : '', date: timeRange.startDate.date, option: omit(timeRange.startDate, 'date'), operatorKey: "between", type: "startDate", format: ADVANCED_RANGE_PICKER_FORMAT.startDate, errorMessage: errorMessage, disableAfterDate: timeRange.endDate.date, showTime: showTime, calculationTypeKeysShow: startDateConfig === null || startDateConfig === void 0 ? void 0 : startDateConfig.calculationTypeKeysShow, showCalculationTypeCondition: showCalculationTypeCondition, timezone: timezone, onUpdatedNewDate: ({ date }) => onUpdateTimeRange('startDate', { date }, 'system'), onApply: ({ date, option }) => onUpdateTimeRange('startDate', Object.assign({ date }, option), 'user'), inputStyle: inputStyle, isViewMode: isViewMode }),
59
59
  separator || null,
60
- React.createElement(AdvancedPicker, { valueType: valueType, disabled: disabled, label: showLabel ? t(translations.datePicker.endDate) || '' : '', date: timeRange.endDate.date, option: omit(timeRange.endDate, 'date'), operatorKey: "between", type: "endDate", format: ADVANCED_RANGE_PICKER_FORMAT.endDate, errorMessage: errorMessage, showTime: showTime, calculationTypeKeysShow: endDateConfig === null || endDateConfig === void 0 ? void 0 : endDateConfig.calculationTypeKeysShow, showCalculationTypeCondition: showCalculationTypeCondition, timezone: timezone, onUpdatedNewDate: ({ date }) => onUpdateTimeRange('endDate', { date }, 'system'), onApply: ({ date, option }) => onUpdateTimeRange('endDate', Object.assign({ date }, option), 'user'), inputStyle: inputStyle })));
60
+ React.createElement(AdvancedPicker, { valueType: valueType, disabled: disabled, label: showLabel ? t(translations.datePicker.endDate) || '' : '', date: timeRange.endDate.date, option: omit(timeRange.endDate, 'date'), operatorKey: "between", type: "endDate", format: ADVANCED_RANGE_PICKER_FORMAT.endDate, errorMessage: errorMessage, showTime: showTime, calculationTypeKeysShow: endDateConfig === null || endDateConfig === void 0 ? void 0 : endDateConfig.calculationTypeKeysShow, showCalculationTypeCondition: showCalculationTypeCondition, timezone: timezone, onUpdatedNewDate: ({ date }) => onUpdateTimeRange('endDate', { date }, 'system'), onApply: ({ date, option }) => onUpdateTimeRange('endDate', Object.assign({ date }, option), 'user'), inputStyle: inputStyle, isViewMode: isViewMode })));
61
61
  };
62
62
  AdvancedRangePicker.defaultProps = {
63
63
  timeRange: {
@@ -120,7 +120,7 @@ export const CategoryListing = memo(props => {
120
120
  });
121
121
  return menuItems;
122
122
  }, [getItem, items]);
123
- return show || header ? (React.createElement(MenuWrapper, { "$width": width },
123
+ return (show && !isEmpty(menuItems)) || header ? (React.createElement(MenuWrapper, { "$width": width },
124
124
  header,
125
125
  React.createElement("div", { className: "category__listing" },
126
126
  React.createElement(Spin, { spinning: loading, wrapperClassName: "template-listing__loading" },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@antscorp/antsomi-ui",
3
- "version": "1.3.5-beta.167",
3
+ "version": "1.3.5-beta.169",
4
4
  "description": "An enterprise-class UI design language and React UI library.",
5
5
  "sideEffects": [
6
6
  "dist/*",