size.chip: размер лейбла и иконки, граница без слоя синонимов

src/lib/providers/prime-preset/tokens/components/chip.ts

@@ -1,45 +1,33 @@
-/**
- * Кастомная CSS-стилизация для компонента p-chip.
- * Публикует extend-токены как CSS-переменные и применяет глобальные стили.
- * Подключается в map-tokens.ts: `import { chipCss } from './components/chip'`
- */
 export const chipCss = ({ dt }: { dt: (token: string) => string }): string => `
-  /* ─── Chip extend: публикуем кастомные переменные в :root ─── */
-  :root {
-    --p-chip-extend-border-color: ${dt('chip.extend.borderColor')};
-    --p-chip-extend-border-width: ${dt('chip.extend.borderWidth')};
-  }
+.p-chip {
+  border: ${dt('chip.extend.borderWidth')} solid ${dt('chip.extend.borderColor')};
+}
 
-  /* ─── Граница чипа ─── */
-  .p-chip {
-    border: var(--p-chip-extend-border-width) solid var(--p-chip-extend-border-color);
-  }
+.p-chip-icon {
+  font-size: ${dt('chip.icon.size')};
+}
 
-  /* ─── Типографика лейбла ─── */
-  .p-chip-label {
-    font-family: ${dt('fonts.fontFamily.base')};
-    font-size: ${dt('fonts.fontSize.300')};
-    font-weight: ${dt('fonts.fontWeight.regular')};
-    line-height: ${dt('fonts.lineHeight.400')};
-  }
+.p-chip-label {
+  font-family: ${dt('fonts.fontFamily.base')};
+  font-size: ${dt('fonts.fontSize.200')};
+  font-weight: ${dt('fonts.fontWeight.regular')};
+  line-height: ${dt('fonts.lineHeight.none')};
+}
 
-  /* ─── Сброс уменьшенного padding PrimeNG при наличии кнопки удаления ─── */
-  .p-chip:has(.p-chip-remove-icon) {
-    padding-inline-end: ${dt('chip.root.paddingX')};
-  }
+.p-chip:has(.p-chip-remove-icon) {
+  padding-inline-end: ${dt('chip.root.paddingX')};
+}
 
-  /* ─── Focus ring иконки удаления ─── */
-  .p-chip-remove-icon:focus-visible {
-    outline: ${dt('chip.removeIcon.focusRing.width')} solid ${dt('color.border.focus')};
-  }
+.p-chip-remove-icon:focus-visible {
+  outline: ${dt('chip.removeIcon.focusRing.width')} solid ${dt('chip.removeIcon.focusRing.color')};
+}
 
-  /* ─── Disabled состояние ─── */
-  .p-chip.p-disabled {
-    opacity: ${dt('effects.opacity.50')};
-    pointer-events: none;
-  }
+.p-chip.p-disabled {
+  opacity: ${dt('effects.opacity.50')};
+  pointer-events: none;
+}
 
-  .p-chip.p-disabled .p-chip-remove-icon {
-    pointer-events: none;
-  }
+.p-chip.p-disabled .p-chip-remove-icon {
+  pointer-events: none;
+}
 `;

src/stories/components/chip/examples/chip-disabled.component.ts

@@ -2,7 +2,7 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { ExtraChipComponent } from '../../../../lib/components/chip/chip.component';
 
 const template = `
-<div class="bg-surface-ground">
+<div>
   <extra-chip label="Доставлен" icon="ti ti-check" [removable]="true" [disabled]="true"></extra-chip>
 </div>
 `;

src/stories/components/chip/examples/chip-removable-with-icon.component.ts

@@ -2,7 +2,7 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { ExtraChipComponent } from '../../../../lib/components/chip/chip.component';
 
 const template = `
-<div class="bg-surface-ground">
+<div>
   <extra-chip label="Задержан" icon="ti ti-alert-triangle" [removable]="true"></extra-chip>
 </div>
 `;

src/stories/components/chip/examples/chip-removable.component.ts

@@ -2,7 +2,7 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { ExtraChipComponent } from '../../../../lib/components/chip/chip.component';
 
 const template = `
-<div class="bg-surface-ground">
+<div>
   <extra-chip label="Хрупкий груз" [removable]="true"></extra-chip>
 </div>
 `;

src/stories/components/chip/examples/chip-with-icon.component.ts

@@ -2,7 +2,7 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { ExtraChipComponent } from '../../../../lib/components/chip/chip.component';
 
 const template = `
-<div class="bg-surface-ground">
+<div>
   <extra-chip label="В пути" icon="ti ti-map-pin"></extra-chip>
 </div>
 `;