@phpsoftbox/react-softbox 2.4.1 → 2.4.2

package/dist/components/Badge/Badge.module.css

@@ -6,6 +6,7 @@
   padding: var(--badge-padding-y, 0.25rem) var(--badge-padding-x, 0.5rem);
   border-radius: var(--badge-border-radius, var(--radius-default));
   line-height: 1;
+  font-size: var(--badge-font-size, var(--badge-font-size-md, var(--font-size-2)));
   border: 0 solid var(--ui-border-color, var(--badge-border, transparent));
   background: var(--badge-bg, var(--variant-default-bg));
   color: var(--badge-color, var(--variant-default-text));
@@ -17,6 +18,7 @@
 .sizeSm {
   --badge-padding-y: 0.125rem;
   --badge-padding-x: 0.375rem;
+  --badge-font-size: var(--badge-font-size-sm, var(--font-size-1));
   --badge-circle-size: 1.125rem;
   --badge-dot-padding: 0.25rem;
 }
@@ -24,6 +26,7 @@
 .sizeMd {
   --badge-padding-y: 0.25rem;
   --badge-padding-x: 0.5rem;
+  --badge-font-size: var(--badge-font-size-md, var(--font-size-2));
   --badge-circle-size: 1.375rem;
   --badge-dot-padding: 0.3125rem;
 }
@@ -31,6 +34,7 @@
 .sizeLg {
   --badge-padding-y: 0.375rem;
   --badge-padding-x: 0.75rem;
+  --badge-font-size: var(--badge-font-size-lg, var(--font-size-3));
   --badge-circle-size: 1.625rem;
   --badge-dot-padding: 0.375rem;
 }

package/dist/components/Progress/Progress.module.css

@@ -1,11 +1,13 @@
 .progress {
+  --progress-label-font-size: var(--progress-label-font-size-md, var(--font-size-3));
+  --progress-value-font-size: var(--progress-value-font-size-md, var(--font-size-2));
   display: flex;
   flex-direction: column;
   gap: 8px;
 }
 
 .label {
-  font-size: 13px;
+  font-size: var(--progress-label-font-size);
   color: var(--color-muted);
 }
 
@@ -26,19 +28,34 @@
 }
 
 .value {
-  font-size: 12px;
+  font-size: var(--progress-value-font-size);
   color: var(--color-muted);
   text-align: right;
 }
 
+.sm {
+  --progress-label-font-size: var(--progress-label-font-size-sm, var(--font-size-2));
+  --progress-value-font-size: var(--progress-value-font-size-sm, var(--font-size-1));
+}
+
 .sm .track {
   height: 6px;
 }
 
+.md {
+  --progress-label-font-size: var(--progress-label-font-size-md, var(--font-size-3));
+  --progress-value-font-size: var(--progress-value-font-size-md, var(--font-size-2));
+}
+
 .md .track {
   height: 10px;
 }
 
+.lg {
+  --progress-label-font-size: var(--progress-label-font-size-lg, var(--font-size-4));
+  --progress-value-font-size: var(--progress-value-font-size-lg, var(--font-size-3));
+}
+
 .lg .track {
   height: 14px;
 }

package/dist/components/Table/Table.module.css

@@ -1,4 +1,7 @@
 .wrapper {
+  --table-font-size: var(--table-font-size-md, var(--font-size-3));
+  --table-head-font-size: var(--table-head-font-size-md, var(--font-size-2));
+  --table-caption-font-size: var(--table-caption-font-size-md, var(--font-size-2));
   width: 100%;
   border-radius: var(--table-border-radius, var(--radius-default));
   border: 1px solid var(--color-line);
@@ -28,6 +31,7 @@
   border-bottom: 1px solid var(--color-divider);
   background: var(--surface-panel-soft);
   border-radius: var(--table-border-radius, var(--radius-default)) var(--table-border-radius, var(--radius-default)) 0 0;
+  font-size: var(--table-font-size);
 }
 
 .bulkActions[data-position='bottom'] {
@@ -104,7 +108,7 @@
   width: 100%;
   border-collapse: collapse;
   color: var(--color-text);
-  font-size: var(--font-size-3);
+  font-size: var(--table-font-size);
   min-width: var(--ui-table-min, 560px);
 }
 
@@ -112,7 +116,7 @@
   caption-side: top;
   text-align: left;
   padding: var(--spacing-3) var(--spacing-4);
-  font-size: var(--font-size-2);
+  font-size: var(--table-caption-font-size);
   color: var(--color-muted);
 }
 
@@ -140,14 +144,14 @@
 }
 
 .headCell {
-  font-size: var(--font-size-2);
+  font-size: var(--table-head-font-size);
   letter-spacing: 0.02em;
   color: var(--color-muted);
   text-align: left;
 }
 
 .cell {
-  font-size: var(--font-size-3);
+  font-size: var(--table-font-size);
 }
 
 .cellContent {
@@ -161,6 +165,7 @@
 }
 
 .footerCell {
+  font-size: var(--table-font-size);
   font-weight: 600;
   border-top: 1px solid var(--color-divider);
   border-bottom: none;
@@ -190,7 +195,12 @@
 .sizeSm .cell,
 .sizeSm .footerCell {
   padding: var(--spacing-2) var(--spacing-3);
-  font-size: var(--font-size-2);
+}
+
+.sizeSm {
+  --table-font-size: var(--table-font-size-sm, var(--font-size-2));
+  --table-head-font-size: var(--table-head-font-size-sm, var(--font-size-1));
+  --table-caption-font-size: var(--table-caption-font-size-sm, var(--font-size-1));
 }
 
 .alignCenter {

package/dist/foundations/tokens.css

@@ -223,6 +223,9 @@
   --badge-border-radius: var(--radius-default);
   --badge-pill-border-radius: var(--radius-pill);
   --badge-circle-border-radius: var(--radius-circle);
+  --badge-font-size-sm: var(--font-size-1);
+  --badge-font-size-md: var(--font-size-2);
+  --badge-font-size-lg: var(--font-size-3);
   --card-border-radius: var(--radius-default);
   --card-toolbar-border-radius: var(--radius-default);
   --card-toolbar-button-height-sm: 2rem;
@@ -239,6 +242,12 @@
   --card-toolbar-button-font-size-lg: var(--font-size-4);
   --alert-border-radius: var(--radius-default);
   --table-border-radius: var(--radius-default);
+  --table-font-size-sm: var(--font-size-2);
+  --table-font-size-md: var(--font-size-3);
+  --table-head-font-size-sm: var(--font-size-1);
+  --table-head-font-size-md: var(--font-size-2);
+  --table-caption-font-size-sm: var(--font-size-1);
+  --table-caption-font-size-md: var(--font-size-2);
   --input-border-radius: var(--radius-default);
   --select-border-radius: var(--input-border-radius);
   --textarea-border-radius: var(--input-border-radius);
@@ -247,6 +256,12 @@
   --tooltip-border-radius: var(--radius-default);
   --toast-border-radius: var(--radius-default);
   --progress-border-radius: var(--radius-pill);
+  --progress-label-font-size-sm: var(--font-size-2);
+  --progress-label-font-size-md: var(--font-size-3);
+  --progress-label-font-size-lg: var(--font-size-4);
+  --progress-value-font-size-sm: var(--font-size-1);
+  --progress-value-font-size-md: var(--font-size-2);
+  --progress-value-font-size-lg: var(--font-size-3);
   --wizard-step-border-radius: var(--radius-default);
   --wizard-step-index-border-radius: var(--radius-circle);
   --wizard-content-border-radius: var(--radius-default);

package/docs/feedback.md

@@ -24,7 +24,7 @@
 <Badge variant="danger" dot aria-label="Ошибка" className="p-2" />
 ```
 
-`Badge` не меняет регистр текста и не задает font-size. Для декоративных решений используйте helpers: `text-uppercase`, `f-2`, `border`, `rounded-pill`, `rounded-circle` и т.д.
+`Badge` не меняет регистр текста. Размеры `sm`, `md`, `lg` задают padding, circle-size и font-size через `--badge-*` токены; для декоративных решений используйте helpers: `text-uppercase`, `f-2`, `border`, `rounded-pill`, `rounded-circle` и т.д.
 
 ## Alert
 

package/docs/progress.md

@@ -8,11 +8,13 @@
 <Progress value={40} label="Миграции" />
 <Progress value={72} label="Сборка" variant="primary" />
 <Progress value={88} label="Тесты" variant="info" showValue />
+<Progress value={36} label="Мини" variant="success" size="sm" showValue />
+<Progress value={92} label="Крупный" variant="warning" size="lg" showValue />
 <Progress label="Синхронизация" indeterminate />
 ```
 
 ## Варианты
 
 - `variant`: `default`, `primary`, `info`, `success`, `warning`, `danger`.
-- `size`: `sm`, `md`, `lg`.
+- `size`: `sm`, `md`, `lg`; меняет высоту трека и размер шрифта `label`/`showValue`.
 - `indeterminate`: бесконечная анимация, без значения.

package/docs/table.md

@@ -138,3 +138,4 @@ const [selected, setSelected] = useState<React.Key[]>([]);
 - `hideOn` — скрыть колонку на `sm`/`md`/`lg`
 - `width` / `minWidth` — размеры колонки
 - `align` — `left` | `center` | `right`
+- `size` — `sm` или `md`; меняет padding и font-size таблицы, заголовков и caption через `--table-*` токены

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@phpsoftbox/react-softbox",
-  "version": "2.4.1",
+  "version": "2.4.2",
   "license": "MIT",
   "type": "module",
   "main": "./dist/index.js",