From 4221b2bf4e4b6c797067cc348563826937aead93 Mon Sep 17 00:00:00 2001 From: Danil Khaliulin Date: Tue, 16 Jun 2026 22:32:27 +0800 Subject: [PATCH 1/3] figma-to-code --- src/lib/components/button/button.component.ts | 14 +++++++------- src/stories/components/button/button.stories.ts | 10 +++++----- .../button/examples/button-extra.component.ts | 6 +++--- 3 files changed, 15 insertions(+), 15 deletions(-) diff --git a/src/lib/components/button/button.component.ts b/src/lib/components/button/button.component.ts index d182381c..d7ecfc0d 100644 --- a/src/lib/components/button/button.component.ts +++ b/src/lib/components/button/button.component.ts @@ -1,10 +1,10 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; import { Button, ButtonSeverity as PrimeButtonSeverity } from 'primeng/button'; -export type ExtraButtonVariant = 'primary' | 'secondary' | 'outlined' | 'text' | 'link'; +export type ExtraButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'text' | 'link'; export type ExtraButtonSeverity = 'success' | 'warning' | 'danger' | 'info' | null; export type ExtraButtonSize = 'small' | 'base' | 'large' | 'xlarge'; -export type ExtraButtonIconPos = 'prefix' | 'postfix' | null; +export type ExtraButtonIconPosition = 'prefix' | 'postfix' | null; export type ExtraBadgeSeverity = 'success' | 'info' | 'warning' | 'danger' | 'secondary' | 'contrast' | null; type PrimeBadgeSeverity = Extract; type ExtraButtonSeverityValue = PrimeButtonSeverity; @@ -23,11 +23,11 @@ type ExtraBadgeSeverityValue = PrimeBadgeSeverity; [size]="primeSize" [styleClass]="size === 'xlarge' ? 'p-button-xlg' : ''" [rounded]="rounded" - [outlined]="variant === 'outlined'" + [outlined]="variant === 'tertiary'" [text]="variant === 'text' || text" [link]="variant === 'link'" [icon]="icon" - [iconPos]="primeIconPos" + [iconPos]="primeIconPosition" [severity]="primeSeverity" [badge]="showBadge ? badge || ' ' : undefined" [badgeSeverity]="primeBadgeSeverity" @@ -44,7 +44,7 @@ export class ExtraButtonComponent { @Input() severity: ExtraButtonSeverity = null; @Input() size: ExtraButtonSize = 'base'; @Input() rounded = false; - @Input() iconPos: ExtraButtonIconPos = null; + @Input() iconPosition: ExtraButtonIconPosition = null; @Input() iconOnly = false; @Input() icon = ''; @Input() disabled = false; @@ -64,8 +64,8 @@ export class ExtraButtonComponent { return undefined; } - get primeIconPos(): 'left' | 'right' { - return this.iconPos === 'postfix' ? 'right' : 'left'; + get primeIconPosition(): 'left' | 'right' { + return this.iconPosition === 'postfix' ? 'right' : 'left'; } get primeSeverity(): ExtraButtonSeverityValue | null { diff --git a/src/stories/components/button/button.stories.ts b/src/stories/components/button/button.stories.ts index 568eb7f8..38bf7970 100644 --- a/src/stories/components/button/button.stories.ts +++ b/src/stories/components/button/button.stories.ts @@ -70,12 +70,12 @@ import { ExtraButtonComponent } from '@cdek-it/angular-ui-kit'; }, variant: { control: 'select', - options: ['primary', 'secondary', 'outlined', 'text', 'link'], + options: ['primary', 'secondary', 'tertiary', 'text', 'link'], description: 'Вариант отображения кнопки', table: { category: 'Props', defaultValue: { summary: 'primary' }, - type: { summary: "'primary' | 'secondary' | 'outlined' | 'text' | 'link'" } + type: { summary: "'primary' | 'secondary' | 'tertiary' | 'text' | 'link'" } } }, size: { @@ -97,7 +97,7 @@ import { ExtraButtonComponent } from '@cdek-it/angular-ui-kit'; type: { summary: 'string' } } }, - iconPos: { + iconPosition: { control: 'select', options: [null, 'prefix', 'postfix'], description: 'Позиция иконки относительно текста', @@ -244,7 +244,7 @@ const commonTemplate = ` [severity]="severity" [size]="size" [rounded]="rounded" - [iconPos]="iconPos" + [iconPosition]="iconPosition" [iconOnly]="iconOnly" [icon]="icon" [disabled]="disabled" @@ -275,7 +275,7 @@ export const Default: Story = { if (args.variant != null) parts.push(`variant="${args.variant}"`); if (args.size != null) parts.push(`size="${args.size}"`); if (args.icon != null && (args.icon as string) !== '') parts.push(`icon="${args.icon}"`); - if (args.iconPos != null) parts.push(`iconPos="${args.iconPos}"`); + if (args.iconPosition != null) parts.push(`iconPosition="${args.iconPosition}"`); if (args.rounded) parts.push(`[rounded]="true"`); if (args.disabled) parts.push(`[disabled]="true"`); if (args.loading) parts.push(`[loading]="true"`); diff --git a/src/stories/components/button/examples/button-extra.component.ts b/src/stories/components/button/examples/button-extra.component.ts index 6114f0bf..a6127a44 100644 --- a/src/stories/components/button/examples/button-extra.component.ts +++ b/src/stories/components/button/examples/button-extra.component.ts @@ -12,7 +12,7 @@ export const Extra: StoryObj = { [severity]="severity" [size]="size" [rounded]="rounded" - [iconPos]="iconPos" + [iconPosition]="iconPosition" [iconOnly]="iconOnly" [icon]="icon" [disabled]="disabled" @@ -38,7 +38,7 @@ export const Extra: StoryObj = { label: { control: 'text' }, variant: { control: 'select', - options: ['primary', 'secondary', 'outlined', 'text', 'link'] + options: ['primary', 'secondary', 'tertiary', 'text', 'link'] }, severity: { control: 'select', @@ -49,7 +49,7 @@ export const Extra: StoryObj = { options: ['small', 'base', 'large', 'xlarge'] }, rounded: { control: 'boolean' }, - iconPos: { + iconPosition: { control: 'select', options: [null, 'prefix', 'postfix'] }, From ca15f0c5e1ffbd1037d6a5ed44c7770c6cd251d8 Mon Sep 17 00:00:00 2001 From: Danil Khaliulin Date: Fri, 19 Jun 2026 00:06:59 +0800 Subject: [PATCH 2/3] =?UTF-8?q?=D0=BD=D0=B5=D0=B9=D0=BC=D0=B8=D0=BD=D0=B3?= =?UTF-8?q?=20=D0=BE=D0=B1=D1=91=D1=80=D1=82=D0=BE=D0=BA=20=D0=B2=D1=8B?= =?UTF-8?q?=D1=80=D0=BE=D0=B2=D0=BD=D0=B5=D0=BD=20=D0=BF=D0=BE=20Figma?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - avatar.size: normal → base - progressspinner.size: medium → base (+ селектор .p-progressspinner-base) - select-button.size: xLarge → xlarge - message.severity: warn → warning, error → danger - tag.severity: warn → warning - confirm-dialog.severity: warn → warning Внутренние строки PrimeNG сохранены через маппинг; обновлены истории и примеры. --- src/lib/components/avatar/avatar.component.ts | 8 ++++---- .../confirm-dialog.component.ts | 4 ++-- .../components/message/message.component.ts | 16 +++++++++++---- .../progressspinner.component.ts | 4 ++-- .../select-button/select-button.component.ts | 4 ++-- src/lib/components/tag/tag.component.ts | 3 ++- .../tokens/components/progressspinner.ts | 4 ++-- .../components/avatar/avatar.stories.ts | 20 +++++++++---------- .../avatar/examples/avatar-sizes.component.ts | 2 +- .../confirm-dialog/confirm-dialog.stories.ts | 4 ++-- .../confirm-dialog-severities.component.ts | 18 ++++++++--------- .../examples/message-severities.component.ts | 8 ++++---- .../message-with-close-button.component.ts | 4 ++-- .../message-with-content.component.ts | 4 ++-- .../components/message/message.stories.ts | 4 ++-- .../progressspinner-monochrome.component.ts | 4 ++-- .../progressspinner.stories.ts | 10 +++++----- .../select-button/select-button.stories.ts | 4 ++-- .../tag/examples/tag-severity.component.ts | 2 +- src/stories/components/tag/tag.stories.ts | 4 ++-- 20 files changed, 70 insertions(+), 61 deletions(-) diff --git a/src/lib/components/avatar/avatar.component.ts b/src/lib/components/avatar/avatar.component.ts index c8feedb7..e7810ddb 100644 --- a/src/lib/components/avatar/avatar.component.ts +++ b/src/lib/components/avatar/avatar.component.ts @@ -2,7 +2,7 @@ import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular import { Avatar } from 'primeng/avatar'; import { AvatarGroup } from 'primeng/avatargroup'; -export type ExtraAvatarSize = 'normal' | 'large' | 'xlarge'; +export type ExtraAvatarSize = 'base' | 'large' | 'xlarge'; export type ExtraAvatarShape = 'square' | 'circle'; @Component({ @@ -24,7 +24,7 @@ export class ExtraAvatarComponent { @Input() label = ''; @Input() icon = ''; @Input() image = ''; - @Input() size: ExtraAvatarSize = 'normal'; + @Input() size: ExtraAvatarSize = 'base'; @Input() shape: ExtraAvatarShape = 'square'; @HostBinding('class') get hostClass(): string { @@ -34,8 +34,8 @@ export class ExtraAvatarComponent { return classes.join(' '); } - get primeSize(): 'normal' | 'large' | 'xlarge' | undefined { - return this.size === 'normal' ? undefined : this.size; + get primeSize(): 'large' | 'xlarge' | undefined { + return this.size === 'base' ? undefined : this.size; } } diff --git a/src/lib/components/confirm-dialog/confirm-dialog.component.ts b/src/lib/components/confirm-dialog/confirm-dialog.component.ts index 5db4b06e..6e1a71be 100644 --- a/src/lib/components/confirm-dialog/confirm-dialog.component.ts +++ b/src/lib/components/confirm-dialog/confirm-dialog.component.ts @@ -5,7 +5,7 @@ import { PrimeTemplate } from 'primeng/api'; import { ExtraButtonComponent } from '@cdek-it/angular-ui-kit/components/button'; export type ExtraConfirmDialogSize = 'sm' | 'default' | 'lg' | 'xlg'; -export type ExtraConfirmDialogSeverity = 'success' | 'info' | 'warn' | 'help' | 'danger' | 'default'; +export type ExtraConfirmDialogSeverity = 'success' | 'info' | 'warning' | 'help' | 'danger' | 'default'; @Directive({ selector: '[extraConfirmDialogHeader]', standalone: true }) export class ExtraConfirmDialogHeaderDirective {} @@ -84,7 +84,7 @@ export class ExtraConfirmDialogComponent { const severityMap: Record = { success: 'p-confirm-dialog-accept', info: 'p-confirm-dialog-info', - warn: 'p-confirm-dialog-warn', + warning: 'p-confirm-dialog-warn', help: 'p-confirm-dialog-help', danger: 'p-confirm-dialog-error', default: '' diff --git a/src/lib/components/message/message.component.ts b/src/lib/components/message/message.component.ts index d5abaf41..7c0e9f49 100644 --- a/src/lib/components/message/message.component.ts +++ b/src/lib/components/message/message.component.ts @@ -3,13 +3,15 @@ import { Message } from 'primeng/message'; import { ButtonDirective } from 'primeng/button'; import { SharedModule } from 'primeng/api'; -export type ExtraMessageSeverity = 'success' | 'info' | 'warn' | 'error' | 'secondary' | 'contrast'; +export type ExtraMessageSeverity = 'success' | 'info' | 'warning' | 'danger' | 'secondary' | 'contrast'; + +type PrimeMessageSeverity = 'success' | 'info' | 'warn' | 'error' | 'secondary' | 'contrast'; const SEVERITY_ICONS: Record = { info: 'ti ti-info-circle', success: 'ti ti-circle-check', - warn: 'ti ti-alert-triangle', - error: 'ti ti-alert-circle' + warning: 'ti ti-alert-triangle', + danger: 'ti ti-alert-circle' }; @Component({ @@ -17,7 +19,7 @@ const SEVERITY_ICONS: Record = { standalone: true, imports: [Message, ButtonDirective, SharedModule], template: ` - +
@@ -55,4 +57,10 @@ export class ExtraMessageComponent { get resolvedIcon(): string { return this.icon ?? SEVERITY_ICONS[this.severity] ?? 'ti ti-info-circle'; } + + get primeSeverity(): PrimeMessageSeverity { + if (this.severity === 'warning') return 'warn'; + if (this.severity === 'danger') return 'error'; + return this.severity; + } } diff --git a/src/lib/components/progressspinner/progressspinner.component.ts b/src/lib/components/progressspinner/progressspinner.component.ts index 99597eaa..8ae8810e 100644 --- a/src/lib/components/progressspinner/progressspinner.component.ts +++ b/src/lib/components/progressspinner/progressspinner.component.ts @@ -2,7 +2,7 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; // Let's import the component directly. Wait, index.d.ts exports { ProgressSpinner, ProgressSpinnerModule }. Either is fine. Let's use ProgressSpinner. import { ProgressSpinner } from 'primeng/progressspinner'; -export type ExtraProgressSpinnerSize = 'small' | 'medium' | 'large' | 'xlarge'; +export type ExtraProgressSpinnerSize = 'small' | 'base' | 'large' | 'xlarge'; @Component({ selector: 'extra-progressspinner', @@ -20,7 +20,7 @@ export type ExtraProgressSpinnerSize = 'small' | 'medium' | 'large' | 'xlarge'; ` }) export class ExtraProgressSpinnerComponent { - @Input() size: ExtraProgressSpinnerSize = 'medium'; + @Input() size: ExtraProgressSpinnerSize = 'base'; @Input() multicolor = true; @Input() strokeWidth = '2'; @Input() fill = 'none'; diff --git a/src/lib/components/select-button/select-button.component.ts b/src/lib/components/select-button/select-button.component.ts index a85e4099..b23a66b1 100644 --- a/src/lib/components/select-button/select-button.component.ts +++ b/src/lib/components/select-button/select-button.component.ts @@ -42,7 +42,7 @@ export class ExtraSelectButtonComponent implements ControlValueAccessor { @Input() optionLabel = 'label'; @Input() optionValue = 'value'; @Input() optionDisabled = 'disabled'; - @Input() size: 'base' | 'small' | 'large' | 'xLarge' = 'base'; + @Input() size: 'base' | 'small' | 'large' | 'xlarge' = 'base'; @Input() multiple = false; @Input() allowEmpty = true; @@ -66,7 +66,7 @@ export class ExtraSelectButtonComponent implements ControlValueAccessor { const sizeMap: Record = { small: 'p-selectbutton-small', large: 'p-selectbutton-large', - xLarge: 'p-selectbutton-xlarge', + xlarge: 'p-selectbutton-xlarge', }; return sizeMap[this.size] ?? ''; } diff --git a/src/lib/components/tag/tag.component.ts b/src/lib/components/tag/tag.component.ts index 34d600b8..ac7ec5f0 100644 --- a/src/lib/components/tag/tag.component.ts +++ b/src/lib/components/tag/tag.component.ts @@ -1,7 +1,7 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; import { Tag } from 'primeng/tag'; -export type ExtraTagSeverity = 'primary' | 'secondary' | 'success' | 'info' | 'warn' | 'danger'; +export type ExtraTagSeverity = 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'danger'; @Component({ selector: 'extra-tag', @@ -20,6 +20,7 @@ export class ExtraTagComponent { get primeSeverity(): 'secondary' | 'success' | 'info' | 'warn' | 'danger' | undefined { if (this.severity === 'primary') return undefined; + if (this.severity === 'warning') return 'warn'; return this.severity; } } diff --git a/src/lib/providers/prime-preset/tokens/components/progressspinner.ts b/src/lib/providers/prime-preset/tokens/components/progressspinner.ts index d901e3e1..e1651ce5 100644 --- a/src/lib/providers/prime-preset/tokens/components/progressspinner.ts +++ b/src/lib/providers/prime-preset/tokens/components/progressspinner.ts @@ -15,8 +15,8 @@ export const progressspinnerCss = ({ dt }: { dt: (token: string) => string }): s height: ${dt('progressspinner.extend.small')}; } -.p-progressspinner.p-progressspinner-medium, -.p-progressspinner.p-progressspinner-medium .p-progressspinner-circle { +.p-progressspinner.p-progressspinner-base, +.p-progressspinner.p-progressspinner-base .p-progressspinner-circle { width: ${dt('progressspinner.extend.medium')}; height: ${dt('progressspinner.extend.medium')}; } diff --git a/src/stories/components/avatar/avatar.stories.ts b/src/stories/components/avatar/avatar.stories.ts index d063e2fb..d9a0f889 100644 --- a/src/stories/components/avatar/avatar.stories.ts +++ b/src/stories/components/avatar/avatar.stories.ts @@ -54,12 +54,12 @@ import { ExtraAvatarComponent, ExtraAvatarGroupComponent } from '@cdek-it/angula }, size: { control: 'select', - options: ['normal', 'large', 'xlarge'], + options: ['base', 'large', 'xlarge'], description: 'Размер аватара', table: { category: 'Props', - defaultValue: { summary: 'normal' }, - type: { summary: "'normal' | 'large' | 'xlarge'" } + defaultValue: { summary: 'base' }, + type: { summary: "'base' | 'large' | 'xlarge'" } } }, shape: { @@ -98,7 +98,7 @@ export const Default: Story = { if (args.label) parts.push(`label="${args.label}"`); if (args.icon) parts.push(`icon="${args.icon}"`); if (args.image) parts.push(`image="${args.image}"`); - if (args.size && args.size !== 'normal') parts.push(`size="${args.size}"`); + if (args.size && args.size !== 'base') parts.push(`size="${args.size}"`); if (args.shape && args.shape !== 'square') parts.push(`shape="${args.shape}"`); const template = parts.length @@ -109,7 +109,7 @@ export const Default: Story = { }, args: { label: 'A', - size: 'normal', + size: 'base', shape: 'square' }, parameters: { @@ -125,7 +125,7 @@ export const Default: Story = { export const Label: Story = { render: (args) => ({ props: args, template: commonTemplate }), - args: { label: 'A', size: 'normal', shape: 'square' }, + args: { label: 'A', size: 'base', shape: 'square' }, parameters: { docs: { description: { story: 'Аватар с текстовой меткой.' }, @@ -140,7 +140,7 @@ export const Label: Story = { export const Icon: Story = { render: (args) => ({ props: args, template: commonTemplate }), - args: { icon: 'ti ti-user', size: 'normal', shape: 'square' }, + args: { icon: 'ti ti-user', size: 'base', shape: 'square' }, parameters: { docs: { description: { story: 'Аватар с иконкой.' }, @@ -155,7 +155,7 @@ export const Icon: Story = { export const Image: Story = { render: (args) => ({ props: args, template: commonTemplate }), - args: { image: '/assets/images/avatar/avatar.png', size: 'normal', shape: 'square' }, + args: { image: '/assets/images/avatar/avatar.png', size: 'base', shape: 'square' }, parameters: { docs: { description: { @@ -175,7 +175,7 @@ export const Sizes: Story = { args: { label: 'L', size: 'large', shape: 'square' }, parameters: { docs: { - description: { story: 'Размер аватара. Доступны: normal, large, xlarge.' }, + description: { story: 'Размер аватара. Доступны: base, large, xlarge.' }, source: { code: `` } @@ -187,7 +187,7 @@ export const Sizes: Story = { export const Shapes: Story = { render: (args) => ({ props: args, template: commonTemplate }), - args: { label: 'C', size: 'normal', shape: 'circle' }, + args: { label: 'C', size: 'base', shape: 'circle' }, parameters: { docs: { description: { story: 'Форма аватара. circle — круглый, square — квадратный (по умолчанию).' }, diff --git a/src/stories/components/avatar/examples/avatar-sizes.component.ts b/src/stories/components/avatar/examples/avatar-sizes.component.ts index 26457b64..04d2e359 100644 --- a/src/stories/components/avatar/examples/avatar-sizes.component.ts +++ b/src/stories/components/avatar/examples/avatar-sizes.component.ts @@ -30,7 +30,7 @@ export const Sizes: StoryObj = { parameters: { docs: { description: { - story: 'Все доступные размеры аватара: normal, large, xlarge.' + story: 'Все доступные размеры аватара: base, large, xlarge.' }, source: { language: 'ts', diff --git a/src/stories/components/confirm-dialog/confirm-dialog.stories.ts b/src/stories/components/confirm-dialog/confirm-dialog.stories.ts index 65b5a996..0a89746f 100644 --- a/src/stories/components/confirm-dialog/confirm-dialog.stories.ts +++ b/src/stories/components/confirm-dialog/confirm-dialog.stories.ts @@ -63,12 +63,12 @@ import { ExtraConfirmDialogComponent, ExtraConfirmDialogService, provideExtraCon }, severity: { control: 'select', - options: ['default', 'success', 'info', 'warn', 'help', 'danger'], + options: ['default', 'success', 'info', 'warning', 'help', 'danger'], description: 'Цветовая схема иконки в заголовке', table: { category: 'Props', defaultValue: { summary: 'default' }, - type: { summary: "'default' | 'success' | 'info' | 'warn' | 'help' | 'danger'" } + type: { summary: "'default' | 'success' | 'info' | 'warning' | 'help' | 'danger'" } } } } diff --git a/src/stories/components/confirm-dialog/examples/confirm-dialog-severities.component.ts b/src/stories/components/confirm-dialog/examples/confirm-dialog-severities.component.ts index 7dbe9d78..9c3d189b 100644 --- a/src/stories/components/confirm-dialog/examples/confirm-dialog-severities.component.ts +++ b/src/stories/components/confirm-dialog/examples/confirm-dialog-severities.component.ts @@ -4,8 +4,8 @@ import { ExtraConfirmDialogComponent } from '../../../../lib/components/confirm- import { ExtraConfirmDialogService } from '../../../../lib/components/confirm-dialog/confirm-dialog.service'; interface SeverityItem { - type: 'success' | 'info' | 'warn' | 'help' | 'danger'; - buttonSeverity: 'success' | 'info' | 'warn' | 'help' | 'danger'; + type: 'success' | 'info' | 'warning' | 'help' | 'danger'; + buttonSeverity: 'success' | 'info' | 'warning' | 'help' | 'danger'; icon: string; label: string; header: string; @@ -33,8 +33,8 @@ const SEVERITIES: SeverityItem[] = [ acceptLabel: 'Понятно', }, { - type: 'warn', - buttonSeverity: 'warn', + type: 'warning', + buttonSeverity: 'warning', icon: 'ti ti-alert-triangle', label: 'Предупреждение', header: 'Предупреждение', @@ -65,7 +65,7 @@ const template = `
- + @@ -122,8 +122,8 @@ export const Severities = { import { ExtraConfirmDialogComponent, ExtraConfirmDialogService, ExtraButtonComponent, provideExtraConfirmDialog } from '@cdek-it/angular-ui-kit'; interface SeverityItem { - type: 'success' | 'info' | 'warn' | 'help' | 'danger'; - buttonSeverity: 'success' | 'info' | 'warn' | 'help' | 'danger'; + type: 'success' | 'info' | 'warning' | 'help' | 'danger'; + buttonSeverity: 'success' | 'info' | 'warning' | 'help' | 'danger'; icon: string; label: string; header: string; @@ -134,7 +134,7 @@ interface SeverityItem { const SEVERITIES: SeverityItem[] = [ { type: 'success', buttonSeverity: 'success', icon: 'ti ti-circle-check', label: 'Успех', header: 'Успех', message: 'Операция выполнена успешно.', acceptLabel: 'OK' }, { type: 'info', buttonSeverity: 'info', icon: 'ti ti-info-circle', label: 'Информация', header: 'Информация', message: 'Это информационное сообщение.', acceptLabel: 'Понятно' }, - { type: 'warn', buttonSeverity: 'warn', icon: 'ti ti-alert-triangle', label: 'Предупреждение', header: 'Предупреждение', message: 'Внимание! Это действие может иметь последствия.', acceptLabel: 'Продолжить' }, + { type: 'warning', buttonSeverity: 'warning', icon: 'ti ti-alert-triangle', label: 'Предупреждение', header: 'Предупреждение', message: 'Внимание! Это действие может иметь последствия.', acceptLabel: 'Продолжить' }, { type: 'help', buttonSeverity: 'help', icon: 'ti ti-help-circle', label: 'Справка', header: 'Справка', message: 'Нужна помощь с этим действием?', acceptLabel: 'Да' }, { type: 'danger', buttonSeverity: 'danger', icon: 'ti ti-circle-x', label: 'Удаление', header: 'Подтверждение', message: 'Это действие нельзя отменить. Продолжить?', acceptLabel: 'Удалить' }, ]; @@ -147,7 +147,7 @@ const SEVERITIES: SeverityItem[] = [ template: \` - + diff --git a/src/stories/components/message/examples/message-severities.component.ts b/src/stories/components/message/examples/message-severities.component.ts index 8e0e5c45..cea020c8 100644 --- a/src/stories/components/message/examples/message-severities.component.ts +++ b/src/stories/components/message/examples/message-severities.component.ts @@ -6,8 +6,8 @@ const template = `
- - + +
`; @@ -32,8 +32,8 @@ export const Severities: StoryObj = { code: ` - - + + ` } } diff --git a/src/stories/components/message/examples/message-with-close-button.component.ts b/src/stories/components/message/examples/message-with-close-button.component.ts index c1a8314d..219bd7c4 100644 --- a/src/stories/components/message/examples/message-with-close-button.component.ts +++ b/src/stories/components/message/examples/message-with-close-button.component.ts @@ -6,8 +6,8 @@ const template = `
- - + +
`; diff --git a/src/stories/components/message/examples/message-with-content.component.ts b/src/stories/components/message/examples/message-with-content.component.ts index 61c26f9b..57f402be 100644 --- a/src/stories/components/message/examples/message-with-content.component.ts +++ b/src/stories/components/message/examples/message-with-content.component.ts @@ -22,7 +22,7 @@ const template = `
Cell 2
- +
CONTENT
@@ -31,7 +31,7 @@ const template = `
Cell 2
- +
CONTENT
diff --git a/src/stories/components/message/message.stories.ts b/src/stories/components/message/message.stories.ts index 96bfa4b8..f19f5d68 100644 --- a/src/stories/components/message/message.stories.ts +++ b/src/stories/components/message/message.stories.ts @@ -36,12 +36,12 @@ import { ExtraMessageComponent } from '@cdek-it/angular-ui-kit'; // ── Props ──────────────────────────────────────────────── severity: { control: 'select', - options: ['info', 'success', 'warn', 'error', 'secondary', 'contrast'], + options: ['info', 'success', 'warning', 'danger', 'secondary', 'contrast'], description: 'Тип сообщения.', table: { category: 'Props', defaultValue: { summary: 'info' }, - type: { summary: "'info' | 'success' | 'warn' | 'error' | 'secondary' | 'contrast'" } + type: { summary: "'info' | 'success' | 'warning' | 'danger' | 'secondary' | 'contrast'" } } }, summary: { diff --git a/src/stories/components/progressspinner/examples/progressspinner-monochrome.component.ts b/src/stories/components/progressspinner/examples/progressspinner-monochrome.component.ts index 38998b74..0d8b898f 100644 --- a/src/stories/components/progressspinner/examples/progressspinner-monochrome.component.ts +++ b/src/stories/components/progressspinner/examples/progressspinner-monochrome.component.ts @@ -14,7 +14,7 @@ const template = ` template }) export class ProgressSpinnerMonochromeComponent { - @Input() size: any = 'medium'; + @Input() size: any = 'base'; @Input() multicolor = false; } @@ -24,7 +24,7 @@ export const Monochrome: StoryObj = { template: `` }), args: { - size: 'medium', + size: 'base', multicolor: false }, parameters: { diff --git a/src/stories/components/progressspinner/progressspinner.stories.ts b/src/stories/components/progressspinner/progressspinner.stories.ts index cc0ad2f3..251f50c0 100644 --- a/src/stories/components/progressspinner/progressspinner.stories.ts +++ b/src/stories/components/progressspinner/progressspinner.stories.ts @@ -25,12 +25,12 @@ import { ExtraProgressSpinnerComponent } from '@cdek-it/angular-ui-kit'; argTypes: { size: { control: 'select', - options: ['small', 'medium', 'large', 'xlarge'], + options: ['small', 'base', 'large', 'xlarge'], description: 'Размер спиннера (задает вычисленные CSS-классы).', table: { category: 'Props', - defaultValue: { summary: 'medium' }, - type: { summary: "'small' | 'medium' | 'large' | 'xlarge'" }, + defaultValue: { summary: 'base' }, + type: { summary: "'small' | 'base' | 'large' | 'xlarge'" }, }, }, multicolor: { @@ -62,7 +62,7 @@ import { ExtraProgressSpinnerComponent } from '@cdek-it/angular-ui-kit'; }, }, args: { - size: 'medium', + size: 'base', multicolor: true, strokeWidth: '2', fill: 'none', @@ -79,7 +79,7 @@ export const Default: Story = { render: (args) => { const parts: string[] = []; - if (args.size && args.size !== 'medium') parts.push(`size="${args.size}"`); + if (args.size && args.size !== 'base') parts.push(`size="${args.size}"`); if (!args.multicolor) parts.push(`[multicolor]="false"`); if (args.strokeWidth && args.strokeWidth !== '2') parts.push(`strokeWidth="${args.strokeWidth}"`); if (args.fill && args.fill !== 'none') parts.push(`fill="${args.fill}"`); diff --git a/src/stories/components/select-button/select-button.stories.ts b/src/stories/components/select-button/select-button.stories.ts index fd6f5aef..a16bf479 100644 --- a/src/stories/components/select-button/select-button.stories.ts +++ b/src/stories/components/select-button/select-button.stories.ts @@ -45,12 +45,12 @@ import { ExtraSelectButtonComponent, ExtraSelectButtonItem } from '@cdek-it/angu }, size: { control: 'radio', - options: ['base', 'small', 'large', 'xLarge'], + options: ['base', 'small', 'large', 'xlarge'], description: 'Размер компонента', table: { category: 'Props', defaultValue: { summary: 'base' }, - type: { summary: "'base' | 'small' | 'large' | 'xLarge'" }, + type: { summary: "'base' | 'small' | 'large' | 'xlarge'" }, }, }, multiple: { diff --git a/src/stories/components/tag/examples/tag-severity.component.ts b/src/stories/components/tag/examples/tag-severity.component.ts index 82eca452..3f323c75 100644 --- a/src/stories/components/tag/examples/tag-severity.component.ts +++ b/src/stories/components/tag/examples/tag-severity.component.ts @@ -24,7 +24,7 @@ export const Severity: StoryObj = { parameters: { docs: { description: { - story: 'Вариант цветового оформления. Доступные значения: primary, secondary, success, info, warn, danger.' + story: 'Вариант цветового оформления. Доступные значения: primary, secondary, success, info, warning, danger.' }, source: { language: 'ts', diff --git a/src/stories/components/tag/tag.stories.ts b/src/stories/components/tag/tag.stories.ts index 137a3744..43cc6a97 100644 --- a/src/stories/components/tag/tag.stories.ts +++ b/src/stories/components/tag/tag.stories.ts @@ -35,12 +35,12 @@ const meta: Meta = { }, severity: { control: 'select', - options: ['primary', 'secondary', 'success', 'info', 'warn', 'danger'], + options: ['primary', 'secondary', 'success', 'info', 'warning', 'danger'], description: 'Вариант цветового оформления', table: { category: 'Props', defaultValue: { summary: "'primary'" }, - type: { summary: "'primary' | 'secondary' | 'success' | 'info' | 'warn' | 'danger'" } + type: { summary: "'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'danger'" } } }, rounded: { From 601ff9af7bb429a23a6520ce6df8724c6b52fb2a Mon Sep 17 00:00:00 2001 From: Danil Khaliulin Date: Fri, 19 Jun 2026 12:27:17 +0800 Subject: [PATCH 3/3] =?UTF-8?q?=D1=81=D0=B8=D0=BD=D1=85=D1=80=D0=BE=D0=BD?= =?UTF-8?q?=D0=B8=D0=B7=D0=B0=D1=86=D0=B8=D1=8F=20package-lock=20=D1=81=20?= =?UTF-8?q?@primeuix/themes?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package-lock.json b/package-lock.json index 5fe8bcf3..f0dafe55 100644 --- a/package-lock.json +++ b/package-lock.json @@ -31,6 +31,7 @@ "@angular/router": "20.3.15", "@compodoc/compodoc": "1.1.32", "@primeng/themes": "20.4.0", + "@primeuix/themes": "1.2.5", "@storybook/addon-a11y": "10.1.8", "@storybook/addon-docs": "10.1.8", "@storybook/addon-themes": "^10.1.8",