@pushwoosh/smart-components-kit 1.21.2 → 1.23.0

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.
@@ -1,6 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useEffect, useState } from 'react';
2
+ import { useEffect, useLayoutEffect, useRef, useState } from 'react';
3
3
  import { Button, Chip, Drawer, DrawerBody, DrawerHeader, DrawerTitle, ModalConfirm, NativeInput, useToast } from '@pushwoosh/dumb-components';
4
+ import { Color } from '@pushwoosh/kit-constants';
4
5
  import { Columns, Vertical } from '@pushwoosh/kit-helpers';
5
6
  import { CloseIcon, TrashIcon } from '@pushwoosh/kit-icons';
6
7
  import { Text } from '@pushwoosh/kit-typography';
@@ -10,7 +11,7 @@ import { CENTER_FOCAL, getCropWindow, getRequestedSize, getStoredOrigin, getStor
10
11
  import { useDeleteMediaFile } from './hooks';
11
12
  import { getAspectRatio, getCropCaption, getThumbUrl } from './mediaFile.utils';
12
13
  import { useLang } from './polyglot';
13
- import { Chips, CropStrip, CropThumb, CropThumbButton, CropThumbCaption, CropThumbDelete, CropThumbImage, FieldLabel, PreviewFrame, PreviewImage, PreviewStage, Segment, SegmentItem, SizeInput } from './styles';
14
+ import { Chips, CropStrip, CropThumb, CropThumbButton, CropThumbCaption, CropThumbDelete, CropThumbImage, FieldLabel, PreviewFrame, PreviewImage, PreviewStage, SizeInput } from './styles';
14
15
  const RATIOS = [{
15
16
  value: 'ASPECT_RATIO_1_1',
16
17
  label: '1:1',
@@ -58,6 +59,15 @@ const RATIOS = [{
58
59
  }];
59
60
  const DEFAULT_SIZE = '1080';
60
61
  const DEFAULT_QUALITY = '90';
62
+ const flashRecalculated = input => {
63
+ if (!input || window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;
64
+ input.animate([{
65
+ color: Color.PRIMARY
66
+ }, {}], {
67
+ duration: 600,
68
+ easing: 'ease-out'
69
+ });
70
+ };
61
71
  export const CreateCropDrawer = ({
62
72
  application,
63
73
  original,
@@ -76,7 +86,7 @@ export const CreateCropDrawer = ({
76
86
  } = useToast();
77
87
  const deleteMediaFile = useDeleteMediaFile(application);
78
88
  const [ratio, setRatio] = useState('original');
79
- const [dimension, setDimension] = useState('width');
89
+ const [lastEdited, setLastEdited] = useState('width');
80
90
  const [size, setSize] = useState(DEFAULT_SIZE);
81
91
  const [quality, setQuality] = useState(DEFAULT_QUALITY);
82
92
  const [isCreating, setIsCreating] = useState(false);
@@ -89,7 +99,7 @@ export const CreateCropDrawer = ({
89
99
  useEffect(() => {
90
100
  if (original) {
91
101
  setRatio('original');
92
- setDimension('width');
102
+ setLastEdited('width');
93
103
  setSize(DEFAULT_SIZE);
94
104
  setQuality(DEFAULT_QUALITY);
95
105
  setViewedCrop(null);
@@ -119,7 +129,7 @@ export const CreateCropDrawer = ({
119
129
  const {
120
130
  width: outputWidth,
121
131
  height: outputHeight
122
- } = getRequestedSize(ratioW, ratioH, dimension, sizeValue);
132
+ } = getRequestedSize(ratioW, ratioH, lastEdited, sizeValue);
123
133
  const srcW = originalMeta?.width ?? 0;
124
134
  const srcH = originalMeta?.height ?? 0;
125
135
  const canPlaceWindow = !isOriginalView && srcW > 0 && srcH > 0;
@@ -134,20 +144,34 @@ export const CreateCropDrawer = ({
134
144
  height: outputHeight
135
145
  };
136
146
  const isCapped = storedSize.width !== outputWidth || storedSize.height !== outputHeight;
137
- // Both inputs are always visible: the driving one is editable, the other is
138
- // read-only and shows the value computed from the aspect ratio.
147
+ // Both inputs are editable; the last edited one drives the size, the other follows the ratio.
139
148
  const computedText = value => isSizeValid ? String(value) : '';
140
- const widthText = dimension === 'width' ? size : computedText(outputWidth);
141
- const heightText = dimension === 'height' ? size : computedText(outputHeight);
142
- const handleDimensionChange = next => {
143
- if (next === dimension) return;
144
- // Seed the newly editable field with its computed value so the visible
145
- // numbers stay put and only editability swaps.
146
- if (isSizeValid) {
147
- setSize(String(next === 'width' ? outputWidth : outputHeight));
148
- }
149
- setDimension(next);
149
+ const widthText = lastEdited === 'width' ? size : computedText(outputWidth);
150
+ const heightText = lastEdited === 'height' ? size : computedText(outputHeight);
151
+ const handleSizeChange = (edited, value) => {
152
+ setLastEdited(edited);
153
+ setSize(value);
150
154
  };
155
+ const widthInputRef = useRef(null);
156
+ const heightInputRef = useRef(null);
157
+ const prevSizeRef = useRef({
158
+ original,
159
+ ratio,
160
+ width: widthText,
161
+ height: heightText
162
+ });
163
+ useLayoutEffect(() => {
164
+ const prev = prevSizeRef.current;
165
+ prevSizeRef.current = {
166
+ original,
167
+ ratio,
168
+ width: widthText,
169
+ height: heightText
170
+ };
171
+ if (isOriginalView || prev.original !== original || prev.ratio === 'original') return;
172
+ if (lastEdited === 'width' && heightText && heightText !== prev.height) flashRecalculated(heightInputRef.current);
173
+ if (lastEdited === 'height' && widthText && widthText !== prev.width) flashRecalculated(widthInputRef.current);
174
+ }, [original, ratio, isOriginalView, lastEdited, widthText, heightText]);
151
175
  // A crop is the same one only at the same ratio, output size and window position.
152
176
  const duplicateExists = !isOriginalView && isSizeValid && existingCrops.some(crop => {
153
177
  if (crop.meta?.type !== 'imageMeta') return false;
@@ -172,7 +196,7 @@ export const CreateCropDrawer = ({
172
196
  uuid: parent.uuid,
173
197
  ratio,
174
198
  size: {
175
- type: dimension,
199
+ type: lastEdited,
176
200
  data: sizeValue
177
201
  },
178
202
  ...(isJpeg ? {
@@ -265,45 +289,31 @@ export const CreateCropDrawer = ({
265
289
  message: 'SMART.MEDIA_STORAGE.CREATE_CROP.SIZE_LABEL'
266
290
  })
267
291
  }), _jsxs(Columns, {
268
- "$sizes": "auto 1fr 1fr",
292
+ "$sizes": "1fr auto 1fr",
269
293
  "$gap": 8,
270
294
  "$alignItems": "center",
271
- children: [_jsxs(Segment, {
272
- children: [_jsx(SegmentItem, {
273
- type: "button",
274
- "$active": dimension === 'width',
275
- onClick: () => handleDimensionChange('width'),
276
- children: lang({
277
- message: 'SMART.MEDIA_STORAGE.CREATE_CROP.WIDTH'
278
- })
279
- }), _jsx(SegmentItem, {
280
- type: "button",
281
- "$active": dimension === 'height',
282
- onClick: () => handleDimensionChange('height'),
283
- children: lang({
284
- message: 'SMART.MEDIA_STORAGE.CREATE_CROP.HEIGHT'
285
- })
286
- })]
287
- }), _jsx(SizeInput, {
295
+ children: [_jsx(SizeInput, {
288
296
  type: "number",
289
297
  min: 1,
290
298
  value: widthText,
291
- readOnly: dimension !== 'width',
292
- "$isErrored": dimension === 'width' && !isSizeValid,
299
+ "$isErrored": lastEdited === 'width' && !isSizeValid,
300
+ ref: widthInputRef,
293
301
  "aria-label": lang({
294
302
  message: 'SMART.MEDIA_STORAGE.CREATE_CROP.WIDTH'
295
303
  }),
296
- onChange: event => setSize(event.target.value)
304
+ onChange: event => handleSizeChange('width', event.target.value)
305
+ }), _jsx(Text, {
306
+ children: "\u00D7"
297
307
  }), _jsx(SizeInput, {
298
308
  type: "number",
299
309
  min: 1,
300
310
  value: heightText,
301
- readOnly: dimension !== 'height',
302
- "$isErrored": dimension === 'height' && !isSizeValid,
311
+ "$isErrored": lastEdited === 'height' && !isSizeValid,
312
+ ref: heightInputRef,
303
313
  "aria-label": lang({
304
314
  message: 'SMART.MEDIA_STORAGE.CREATE_CROP.HEIGHT'
305
315
  }),
306
- onChange: event => setSize(event.target.value)
316
+ onChange: event => handleSizeChange('height', event.target.value)
307
317
  })]
308
318
  })]
309
319
  }), _jsxs(Vertical, {
@@ -115,7 +115,7 @@ export const FieldLabel = styled.div.withConfig({
115
115
  export const SizeInput = styled(NativeInput).withConfig({
116
116
  displayName: "SizeInput",
117
117
  componentId: "sc-uu3cbo-25"
118
- })(["&[readonly]{background:", ";color:", ";}"], Color.SOFT_LIGHT, Color.LOCKED);
118
+ })(["-webkit-text-fill-color:currentColor;"]);
119
119
  export const Chips = styled.div.withConfig({
120
120
  displayName: "Chips",
121
121
  componentId: "sc-uu3cbo-26"
@@ -1,4 +1,4 @@
1
1
  import { type FC } from 'react';
2
2
  import { type PickerSortMenuProps } from './types';
3
- /** Compact "⇅ <order> ▾" button that lets the user pick the order of a picker list. */
3
+ /** Compact "⇅ Sort: <order>" button that lets the user pick the order of a picker list. */
4
4
  export declare const PickerSortMenu: FC<PickerSortMenuProps>;
@@ -1,9 +1,9 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { DropdownMenuButton, DropdownMenuItem, DropdownMenuSection } from '@pushwoosh/dumb-components';
3
- import { DropdownIcon, SortIcon } from '@pushwoosh/kit-icons';
3
+ import { SortIcon } from '@pushwoosh/kit-icons';
4
4
  import { PICKER_SORT_ORDERS } from '../../constants';
5
5
  import { ORDER_MESSAGES, useLang } from '../../polyglot';
6
- /** Compact "⇅ <order> ▾" button that lets the user pick the order of a picker list. */
6
+ /** Compact "⇅ Sort: <order>" button that lets the user pick the order of a picker list. */
7
7
  export const PickerSortMenu = ({
8
8
  value,
9
9
  onChange,
@@ -11,6 +11,9 @@ export const PickerSortMenu = ({
11
11
  isDisabled
12
12
  }) => {
13
13
  const lang = useLang();
14
+ const order = lang({
15
+ message: ORDER_MESSAGES[value]
16
+ });
14
17
  return _jsx(DropdownMenuButton, {
15
18
  color: "secondary",
16
19
  view: "ghost",
@@ -19,12 +22,9 @@ export const PickerSortMenu = ({
19
22
  size: "small",
20
23
  type: "not-sorted"
21
24
  }),
22
- rightIcon: _jsx(DropdownIcon, {
23
- direction: "down",
24
- size: "small"
25
- }),
26
25
  label: lang({
27
- message: ORDER_MESSAGES[value]
26
+ message: 'SMART.PICKER_SORT.LABEL',
27
+ order
28
28
  }),
29
29
  isDisabled: isDisabled,
30
30
  menuPlacement: "bottom-end",
@@ -1,4 +1,4 @@
1
1
  import { type PickerSortOrder } from '../types';
2
2
  import { type PickerSortMessages } from './types';
3
3
  export declare const Lang: import("react").FC<import("@pushwoosh/dumb-components/polyglot").LangProps<PickerSortMessages>>, useLang: () => (props: import("@pushwoosh/dumb-components/polyglot").LangProps<PickerSortMessages>) => string;
4
- export declare const ORDER_MESSAGES: Record<PickerSortOrder, keyof PickerSortMessages>;
4
+ export declare const ORDER_MESSAGES: Record<PickerSortOrder, Extract<keyof PickerSortMessages, `SMART.PICKER_SORT.ORDER.${string}`>>;
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': 'ترتيب حسب',
3
+ 'SMART.PICKER_SORT.LABEL': 'الترتيب: {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': 'الأحدث أولاً',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': 'الأقدم أولاً',
5
- 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'المحدّثة مؤخرًا',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'الاسم أ→ي',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'الاسم ي→أ'
6
+ 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'آخر تحديث',
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'أ-ي',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'ي-أ'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': 'সাজান',
3
+ 'SMART.PICKER_SORT.LABEL': 'সাজানো: {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': 'নতুন আগে',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': 'পুরনো আগে',
5
- 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'সম্প্রতি আপডেট করা',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'নাম A→Z',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'নাম Z→A'
6
+ 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'সর্বশেষ আপডেট',
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'A-Z',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Z-A'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': 'Sortieren nach',
3
+ 'SMART.PICKER_SORT.LABEL': 'Sortierung: {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': 'Neueste zuerst',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': 'Älteste zuerst',
5
6
  'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'Zuletzt aktualisiert',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'Name A→Z',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Name Z→A'
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'A-Z',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Z-A'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': 'Sort by',
3
+ 'SMART.PICKER_SORT.LABEL': 'Sort: {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': 'Newest first',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': 'Oldest first',
5
- 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'Recently updated',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'Name A→Z',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Name Z→A'
6
+ 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'Last updated',
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'A-Z',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Z-A'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': 'Ordenar por',
3
+ 'SMART.PICKER_SORT.LABEL': 'Orden: {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': 'Más recientes primero',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': 'Más antiguos primero',
5
- 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'Actualizados recientemente',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'Nombre A→Z',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Nombre Z→A'
6
+ 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'Última actualización',
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'A-Z',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Z-A'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': 'Trier par',
3
+ 'SMART.PICKER_SORT.LABEL': 'Tri : {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': 'Plus récents d’abord',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': 'Plus anciens d’abord',
5
- 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'Modifiés récemment',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'Nom A→Z',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Nom Z→A'
6
+ 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'Dernière modification',
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'A-Z',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Z-A'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': 'מיון לפי',
3
+ 'SMART.PICKER_SORT.LABEL': 'מיון: {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': 'החדשים קודם',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': 'הישנים קודם',
5
- 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'עודכנו לאחרונה',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'שם א→ת',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'שם ת→א'
6
+ 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'עודכן לאחרונה',
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'א-ת',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'ת-א'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': 'क्रमबद्ध करें',
3
+ 'SMART.PICKER_SORT.LABEL': 'क्रम: {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': 'नए पहले',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': 'पुराने पहले',
5
- 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'हाल ही में अपडेट किए गए',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'नाम A→Z',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'नाम Z→A'
6
+ 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'अंतिम अपडेट',
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'A-Z',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Z-A'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': '並べ替え',
3
+ 'SMART.PICKER_SORT.LABEL': '並べ替え: {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': '新しい順',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': '古い順',
5
- 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': '最近更新した順',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': '名前 A→Z',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': '名前 Z→A'
6
+ 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': '最終更新',
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'A-Z',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Z-A'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': '정렬',
3
+ 'SMART.PICKER_SORT.LABEL': '정렬: {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': '최신순',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': '오래된순',
5
- 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': '최근 업데이트순',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': '이름 A→Z',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': '이름 Z→A'
6
+ 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': '최종 업데이트',
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'A-Z',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Z-A'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': 'Ordenar por',
3
+ 'SMART.PICKER_SORT.LABEL': 'Ordem: {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': 'Mais recentes primeiro',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': 'Mais antigos primeiro',
5
- 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'Atualizados recentemente',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'Nome A→Z',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Nome Z→A'
6
+ 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'Última atualização',
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'A-Z',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Z-A'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': 'Сортировка',
3
+ 'SMART.PICKER_SORT.LABEL': 'Сортировка: {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': 'Сначала новые',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': 'Сначала старые',
5
- 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'Недавно изменённые',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'Название А→Я',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Название Я→А'
6
+ 'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'Последнее изменение',
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'А-Я',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Я-А'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': 'เรียงตาม',
3
+ 'SMART.PICKER_SORT.LABEL': 'เรียง: {{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': 'ใหม่สุดก่อน',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': 'เก่าสุดก่อน',
5
6
  'SMART.PICKER_SORT.ORDER.UPDATED_DESC': 'อัปเดตล่าสุด',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'ชื่อ A→Z',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'ชื่อ Z→A'
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'A-Z',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Z-A'
8
9
  };
@@ -1,8 +1,9 @@
1
1
  export const messages = {
2
2
  'SMART.PICKER_SORT.TITLE': '排序方式',
3
+ 'SMART.PICKER_SORT.LABEL': '排序:{{order}}',
3
4
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': '最新优先',
4
5
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': '最早优先',
5
6
  'SMART.PICKER_SORT.ORDER.UPDATED_DESC': '最近更新',
6
- 'SMART.PICKER_SORT.ORDER.NAME_ASC': '名称 A→Z',
7
- 'SMART.PICKER_SORT.ORDER.NAME_DESC': '名称 Z→A'
7
+ 'SMART.PICKER_SORT.ORDER.NAME_ASC': 'A-Z',
8
+ 'SMART.PICKER_SORT.ORDER.NAME_DESC': 'Z-A'
8
9
  };
@@ -1,6 +1,9 @@
1
1
  import type { NoParams } from '@pushwoosh/dumb-components/polyglot';
2
2
  export type PickerSortMessages = {
3
3
  'SMART.PICKER_SORT.TITLE': NoParams;
4
+ 'SMART.PICKER_SORT.LABEL': {
5
+ order: string;
6
+ };
4
7
  'SMART.PICKER_SORT.ORDER.CREATED_DESC': NoParams;
5
8
  'SMART.PICKER_SORT.ORDER.CREATED_ASC': NoParams;
6
9
  'SMART.PICKER_SORT.ORDER.UPDATED_DESC': NoParams;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pushwoosh/smart-components-kit",
3
- "version": "1.21.2",
3
+ "version": "1.23.0",
4
4
  "description": "Stateful, data-connected React components shared by Pushwoosh micro-frontends",
5
5
  "repository": {
6
6
  "type": "git",
@@ -17,7 +17,7 @@
17
17
  },
18
18
  "dependencies": {
19
19
  "@floating-ui/react-dom": "^2.1.2",
20
- "@pushwoosh/dumb-components": "^3.2.0",
20
+ "@pushwoosh/dumb-components": "^3.4.0",
21
21
  "@pushwoosh/kit-constants": "^2.1.1",
22
22
  "@pushwoosh/kit-helpers": "^4.16.0",
23
23
  "@pushwoosh/kit-icons": "^2.3.10",