@konce-pt/react 0.12.0 → 0.15.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.
- package/README.md +122 -64
- package/dist/accordion/accordion.d.ts +14 -6
- package/dist/accordion/accordion.js +14 -7
- package/dist/accordion/llms.txt +22 -10
- package/dist/alert/alert.d.ts +2 -2
- package/dist/alert/alert.js +2 -2
- package/dist/alert/llms.txt +10 -10
- package/dist/app-shell/app-shell.d.ts +14 -14
- package/dist/app-shell/app-shell.js +11 -11
- package/dist/app-shell/llms.txt +13 -13
- package/dist/auth/auth-types.d.ts +6 -6
- package/dist/auth/auth.d.ts +2 -2
- package/dist/auth/auth.js +7 -7
- package/dist/auth/llms.txt +9 -9
- package/dist/autocomplete/autocomplete.d.ts +19 -6
- package/dist/autocomplete/autocomplete.js +23 -10
- package/dist/autocomplete/llms.txt +16 -5
- package/dist/avatar/avatar.d.ts +6 -6
- package/dist/avatar/avatar.js +5 -5
- package/dist/avatar/llms.txt +10 -10
- package/dist/avatar-group/avatar-group.d.ts +4 -4
- package/dist/avatar-group/avatar-group.js +3 -3
- package/dist/avatar-group/llms.txt +8 -8
- package/dist/backdrop/backdrop.d.ts +7 -7
- package/dist/backdrop/backdrop.js +16 -16
- package/dist/backdrop/llms.txt +27 -27
- package/dist/badge/badge.d.ts +3 -3
- package/dist/badge/badge.js +1 -1
- package/dist/badge/llms.txt +11 -11
- package/dist/bottom-sheet/bottom-sheet.d.ts +4 -4
- package/dist/bottom-sheet/bottom-sheet.js +2 -2
- package/dist/bottom-sheet/llms.txt +9 -9
- package/dist/breadcrumb/breadcrumb.d.ts +2 -2
- package/dist/breadcrumb/breadcrumb.js +3 -3
- package/dist/breadcrumb/llms.txt +3 -3
- package/dist/button/button.d.ts +3 -3
- package/dist/button/button.js +8 -8
- package/dist/button/llms.txt +27 -19
- package/dist/button-group/button-group.d.ts +9 -9
- package/dist/button-group/button-group.js +30 -8
- package/dist/button-group/llms.txt +20 -14
- package/dist/card/card.d.ts +8 -8
- package/dist/card/card.js +6 -6
- package/dist/card/llms.txt +20 -20
- package/dist/carousel/carousel.d.ts +6 -6
- package/dist/carousel/carousel.js +4 -4
- package/dist/carousel/llms.txt +10 -10
- package/dist/charts/chart-legend.d.ts +3 -3
- package/dist/charts/chart-legend.js +1 -1
- package/dist/charts/chart-tooltip.d.ts +3 -3
- package/dist/charts/chart-tooltip.js +1 -1
- package/dist/charts/chart.d.ts +1 -1
- package/dist/charts/chart.js +8 -8
- package/dist/charts/llms.txt +6 -6
- package/dist/charts-entry/public-api.js +2 -2
- package/dist/chat/chat.d.ts +17 -10
- package/dist/chat/chat.js +42 -18
- package/dist/chat/llms.txt +32 -17
- package/dist/chat-composer/chat-composer.d.ts +17 -7
- package/dist/chat-composer/chat-composer.js +21 -8
- package/dist/chat-composer/llms.txt +20 -11
- package/dist/chat-dock/chat-dock.d.ts +11 -4
- package/dist/chat-dock/chat-dock.js +9 -6
- package/dist/chat-dock/llms.txt +15 -14
- package/dist/chat-entry/public-api.js +1 -1
- package/dist/chat-message/chat-message.d.ts +12 -5
- package/dist/chat-message/chat-message.js +17 -7
- package/dist/chat-message/llms.txt +16 -15
- package/dist/chat-typing/chat-typing.d.ts +2 -2
- package/dist/chat-typing/chat-typing.js +3 -3
- package/dist/chat-typing/llms.txt +6 -6
- package/dist/checkbox/checkbox.d.ts +13 -6
- package/dist/checkbox/checkbox.js +26 -7
- package/dist/checkbox/llms.txt +24 -12
- package/dist/chip/chip.d.ts +4 -4
- package/dist/chip/chip.js +2 -2
- package/dist/chip/llms.txt +11 -11
- package/dist/chips-input/chips-input.d.ts +4 -4
- package/dist/chips-input/chips-input.js +35 -9
- package/dist/chips-input/llms.txt +15 -8
- package/dist/clock/clock.d.ts +4 -4
- package/dist/clock/clock.js +7 -7
- package/dist/clock/llms.txt +8 -8
- package/dist/color-picker/color-picker.d.ts +6 -6
- package/dist/color-picker/color-picker.js +3 -3
- package/dist/color-picker/llms.txt +5 -5
- package/dist/confirm/confirm-container.d.ts +3 -3
- package/dist/confirm/confirm-container.js +5 -5
- package/dist/confirm/confirm-store.d.ts +4 -4
- package/dist/confirm/confirm-store.js +7 -7
- package/dist/confirm/llms.txt +6 -6
- package/dist/context-menu/context-menu.d.ts +1 -1
- package/dist/context-menu/context-menu.js +5 -5
- package/dist/context-menu/llms.txt +7 -7
- package/dist/data-table/data-table-types.d.ts +5 -5
- package/dist/data-table/data-table.d.ts +29 -8
- package/dist/data-table/data-table.js +340 -95
- package/dist/data-table/export-csv.d.ts +3 -3
- package/dist/data-table/export-csv.js +4 -4
- package/dist/data-table/llms.txt +127 -94
- package/dist/data-view/data-view.d.ts +13 -5
- package/dist/data-view/data-view.js +67 -6
- package/dist/data-view/llms.txt +29 -10
- package/dist/date-range/date-range.d.ts +9 -9
- package/dist/date-range/date-range.js +24 -24
- package/dist/date-range/llms.txt +20 -20
- package/dist/datepicker/datepicker.d.ts +10 -10
- package/dist/datepicker/datepicker.js +29 -29
- package/dist/datepicker/llms.txt +24 -24
- package/dist/dialog/dialog.d.ts +12 -7
- package/dist/dialog/dialog.js +4 -4
- package/dist/dialog/llms.txt +14 -11
- package/dist/divider/divider.d.ts +1 -1
- package/dist/divider/llms.txt +4 -4
- package/dist/drawer/drawer.d.ts +5 -5
- package/dist/drawer/drawer.js +2 -2
- package/dist/drawer/llms.txt +11 -11
- package/dist/empty/empty.d.ts +2 -2
- package/dist/empty/empty.js +1 -1
- package/dist/empty/llms.txt +9 -9
- package/dist/fab/fab.d.ts +1 -1
- package/dist/fab/fab.js +1 -1
- package/dist/fab/llms.txt +10 -6
- package/dist/fieldset/fieldset.d.ts +18 -4
- package/dist/fieldset/fieldset.js +9 -6
- package/dist/fieldset/llms.txt +26 -9
- package/dist/file-upload/file-upload.d.ts +3 -3
- package/dist/file-upload/file-upload.js +7 -7
- package/dist/file-upload/llms.txt +7 -7
- package/dist/form-field/form-field-context.d.ts +4 -4
- package/dist/form-field/form-field.d.ts +12 -4
- package/dist/form-field/form-field.js +26 -6
- package/dist/form-field/llms.txt +25 -11
- package/dist/galleria/galleria.d.ts +3 -3
- package/dist/galleria/galleria.js +5 -5
- package/dist/galleria/llms.txt +7 -7
- package/dist/grid/col.d.ts +4 -4
- package/dist/grid/col.js +2 -2
- package/dist/grid/flex.d.ts +3 -3
- package/dist/grid/flex.js +1 -1
- package/dist/grid/grid.d.ts +7 -7
- package/dist/grid/grid.js +3 -3
- package/dist/grid/layout.d.ts +2 -2
- package/dist/grid/layout.js +2 -2
- package/dist/grid/llms.txt +15 -15
- package/dist/grid-entry/public-api.js +1 -1
- package/dist/i18n/i18n-context.d.ts +3 -3
- package/dist/i18n/i18n-context.js +7 -7
- package/dist/icon/icon-registry.d.ts +3 -3
- package/dist/icon/icon-registry.js +3 -3
- package/dist/icon/icon.d.ts +4 -4
- package/dist/icon/icon.js +6 -6
- package/dist/icon/llms.txt +13 -13
- package/dist/icon-button/icon-button.d.ts +2 -2
- package/dist/icon-button/icon-button.js +1 -1
- package/dist/icon-button/llms.txt +9 -5
- package/dist/icons-entry/public-api.d.ts +2 -2
- package/dist/icons-entry/public-api.js +3 -3
- package/dist/image/image.js +1 -1
- package/dist/image/llms.txt +13 -13
- package/dist/input/input.d.ts +18 -5
- package/dist/input/input.js +21 -6
- package/dist/input/llms.txt +25 -11
- package/dist/input-mask/input-mask.d.ts +1 -1
- package/dist/input-mask/input-mask.js +2 -2
- package/dist/input-mask/llms.txt +5 -5
- package/dist/input-number/input-number.d.ts +9 -9
- package/dist/input-number/input-number.js +11 -11
- package/dist/input-number/llms.txt +14 -14
- package/dist/input-otp/input-otp.d.ts +6 -6
- package/dist/input-otp/input-otp.js +10 -10
- package/dist/input-otp/llms.txt +9 -9
- package/dist/internal/calendar-focus.d.ts +1 -1
- package/dist/internal/calendar-focus.js +3 -3
- package/dist/internal/cn.d.ts +1 -1
- package/dist/internal/mask.d.ts +2 -2
- package/dist/internal/mask.js +4 -4
- package/dist/internal/option-key.d.ts +2 -2
- package/dist/internal/option-key.js +2 -2
- package/dist/internal/option-nav.d.ts +4 -4
- package/dist/internal/option-nav.js +5 -5
- package/dist/internal/overlay-container.js +1 -1
- package/dist/internal/overlay.d.ts +3 -3
- package/dist/internal/overlay.js +8 -8
- package/dist/internal/password-strength.d.ts +2 -2
- package/dist/internal/password-strength.js +6 -6
- package/dist/internal/roving.d.ts +2 -2
- package/dist/internal/roving.js +3 -3
- package/dist/internal/scroll-lock.d.ts +1 -1
- package/dist/internal/scroll-lock.js +2 -2
- package/dist/internal/slot-children.d.ts +3 -3
- package/dist/internal/slot-children.js +4 -4
- package/dist/internal/slot.d.ts +3 -3
- package/dist/internal/slot.js +2 -2
- package/dist/internal/step.d.ts +3 -3
- package/dist/internal/step.js +4 -4
- package/dist/internal/tween.d.ts +5 -5
- package/dist/internal/tween.js +5 -5
- package/dist/internal/types.d.ts +2 -2
- package/dist/internal/use-breakpoint.d.ts +2 -2
- package/dist/internal/use-breakpoint.js +4 -4
- package/dist/internal/use-controllable-state.d.ts +1 -1
- package/dist/internal/use-controllable-state.js +3 -3
- package/dist/internal/use-id.d.ts +2 -2
- package/dist/internal/use-id.js +2 -2
- package/dist/internal/use-modal-focus.d.ts +1 -1
- package/dist/internal/use-modal-focus.js +3 -3
- package/dist/knob/knob.d.ts +4 -4
- package/dist/knob/knob.js +14 -10
- package/dist/knob/llms.txt +17 -12
- package/dist/listbox/listbox.d.ts +6 -6
- package/dist/listbox/listbox.js +9 -9
- package/dist/listbox/llms.txt +10 -10
- package/dist/loader/llms.txt +56 -0
- package/dist/loader/loader.d.ts +49 -0
- package/dist/loader/loader.js +68 -0
- package/dist/map/llms.txt +25 -22
- package/dist/map/map-create-dialog.d.ts +4 -4
- package/dist/map/map-create-dialog.js +10 -10
- package/dist/map/map-hours-field.d.ts +4 -4
- package/dist/map/map-hours-field.js +7 -7
- package/dist/map/map-image-field.d.ts +2 -2
- package/dist/map/map-image-field.js +4 -4
- package/dist/map/map-legend.d.ts +4 -4
- package/dist/map/map-legend.js +2 -2
- package/dist/map/map-poi-card.d.ts +3 -3
- package/dist/map/map-poi-card.js +9 -9
- package/dist/map/map-search.d.ts +17 -6
- package/dist/map/map-search.js +21 -18
- package/dist/map/map.d.ts +21 -14
- package/dist/map/map.js +30 -29
- package/dist/map/ports.d.ts +9 -9
- package/dist/map/ports.js +6 -6
- package/dist/map-entry/public-api.js +2 -2
- package/dist/megamenu/llms.txt +9 -9
- package/dist/megamenu/megamenu.d.ts +6 -6
- package/dist/megamenu/megamenu.js +10 -10
- package/dist/mention/llms.txt +15 -15
- package/dist/mention/mention.d.ts +5 -5
- package/dist/mention/mention.js +2 -2
- package/dist/mention/mentions.d.ts +1 -1
- package/dist/mention/mentions.js +1 -1
- package/dist/menu/llms.txt +12 -12
- package/dist/menu/menu-item.d.ts +4 -4
- package/dist/menu/menu-keys.d.ts +2 -2
- package/dist/menu/menu-keys.js +5 -5
- package/dist/menu/menu.d.ts +2 -2
- package/dist/menu/menu.js +6 -6
- package/dist/menubar/llms.txt +10 -10
- package/dist/menubar/menubar.d.ts +5 -5
- package/dist/menubar/menubar.js +10 -10
- package/dist/meter-group/llms.txt +12 -12
- package/dist/meter-group/meter-group.d.ts +2 -2
- package/dist/meter-group/meter-group.js +1 -1
- package/dist/motion/motion-context.d.ts +22 -0
- package/dist/motion/motion-context.js +28 -0
- package/dist/order-list/llms.txt +22 -10
- package/dist/order-list/order-list.d.ts +12 -4
- package/dist/order-list/order-list.js +104 -21
- package/dist/paginator/llms.txt +8 -8
- package/dist/paginator/paginator.js +1 -1
- package/dist/panel/llms.txt +25 -13
- package/dist/panel/panel.d.ts +11 -3
- package/dist/panel/panel.js +7 -4
- package/dist/password/llms.txt +16 -8
- package/dist/password/password.d.ts +2 -2
- package/dist/password/password.js +24 -3
- package/dist/peek/llms.txt +10 -10
- package/dist/peek/peek.d.ts +6 -6
- package/dist/peek/peek.js +7 -7
- package/dist/pick-list/llms.txt +33 -13
- package/dist/pick-list/pick-list.d.ts +12 -4
- package/dist/pick-list/pick-list.js +111 -23
- package/dist/popover/llms.txt +11 -11
- package/dist/popover/popover.d.ts +4 -4
- package/dist/popover/popover.js +5 -5
- package/dist/progress/llms.txt +17 -17
- package/dist/progress/progress.d.ts +7 -7
- package/dist/progress/progress.js +6 -6
- package/dist/public-api.d.ts +15 -3
- package/dist/public-api.js +13 -7
- package/dist/radio-group/llms.txt +13 -6
- package/dist/radio-group/radio-group.d.ts +11 -4
- package/dist/radio-group/radio-group.js +15 -7
- package/dist/rating/llms.txt +20 -13
- package/dist/rating/rating-pointer.d.ts +16 -0
- package/dist/rating/rating-pointer.js +26 -0
- package/dist/rating/rating.d.ts +6 -6
- package/dist/rating/rating.js +76 -12
- package/dist/rich-text/lists.d.ts +2 -2
- package/dist/rich-text/lists.js +7 -7
- package/dist/rich-text/llms.txt +26 -17
- package/dist/rich-text/rich-text.d.ts +12 -7
- package/dist/rich-text/rich-text.js +78 -54
- package/dist/rich-text/sanitize.d.ts +3 -3
- package/dist/rich-text/sanitize.js +12 -12
- package/dist/rich-text/tables.d.ts +3 -3
- package/dist/rich-text/tables.js +3 -3
- package/dist/roadmap/llms.txt +15 -15
- package/dist/roadmap/roadmap.d.ts +6 -6
- package/dist/roadmap/roadmap.js +19 -19
- package/dist/roadmap-entry/public-api.js +2 -2
- package/dist/scroll-top/llms.txt +6 -6
- package/dist/scroll-top/scroll-top.d.ts +1 -1
- package/dist/scroll-top/scroll-top.js +1 -1
- package/dist/select/llms.txt +19 -12
- package/dist/select/select.d.ts +8 -8
- package/dist/select/select.js +47 -21
- package/dist/shared/types.d.ts +5 -5
- package/dist/shared/types.js +1 -1
- package/dist/sidenav/llms.txt +9 -9
- package/dist/sidenav/sidenav.d.ts +1 -1
- package/dist/sidenav/sidenav.js +1 -1
- package/dist/skeleton/llms.txt +3 -3
- package/dist/skeleton/skeleton.d.ts +1 -1
- package/dist/skeleton/skeleton.js +1 -1
- package/dist/slider/llms.txt +32 -13
- package/dist/slider/slider-drag.d.ts +26 -0
- package/dist/slider/slider-drag.js +79 -0
- package/dist/slider/slider.d.ts +6 -5
- package/dist/slider/slider.js +27 -8
- package/dist/speech/llms.txt +97 -0
- package/dist/speech/speech-button.d.ts +44 -0
- package/dist/speech/speech-button.js +86 -0
- package/dist/speech/speech-wave.d.ts +19 -0
- package/dist/speech/speech-wave.js +16 -0
- package/dist/speech/use-speech-recognition.d.ts +81 -0
- package/dist/speech/use-speech-recognition.js +179 -0
- package/dist/speed-dial/llms.txt +14 -8
- package/dist/speed-dial/speed-dial.d.ts +1 -1
- package/dist/speed-dial/speed-dial.js +1 -1
- package/dist/spinner/llms.txt +7 -7
- package/dist/spinner/spinner.d.ts +1 -1
- package/dist/spinner/spinner.js +1 -1
- package/dist/split-button/llms.txt +21 -15
- package/dist/split-button/split-button.d.ts +2 -2
- package/dist/split-button/split-button.js +4 -4
- package/dist/splitter/llms.txt +11 -11
- package/dist/splitter/splitter.d.ts +3 -3
- package/dist/splitter/splitter.js +5 -5
- package/dist/stepper/llms.txt +33 -14
- package/dist/stepper/stepper.d.ts +6 -6
- package/dist/stepper/stepper.js +53 -10
- package/dist/switch/llms.txt +12 -5
- package/dist/switch/switch.d.ts +10 -3
- package/dist/switch/switch.js +12 -5
- package/dist/switch-group/llms.txt +9 -9
- package/dist/switch-group/switch-group.d.ts +4 -4
- package/dist/switch-group/switch-group.js +4 -4
- package/dist/tabs/llms.txt +10 -10
- package/dist/tabs/tabs.d.ts +5 -5
- package/dist/tabs/tabs.js +8 -8
- package/dist/textarea/llms.txt +23 -12
- package/dist/textarea/textarea.d.ts +19 -6
- package/dist/textarea/textarea.js +21 -7
- package/dist/timeline/llms.txt +4 -4
- package/dist/timeline/timeline.d.ts +1 -1
- package/dist/timeline/timeline.js +1 -1
- package/dist/toast/llms.txt +47 -17
- package/dist/toast/toast-container.d.ts +9 -3
- package/dist/toast/toast-container.js +17 -9
- package/dist/toast/toast-store.d.ts +40 -4
- package/dist/toast/toast-store.js +36 -1
- package/dist/toolbar/llms.txt +7 -7
- package/dist/toolbar/toolbar.d.ts +3 -3
- package/dist/toolbar/toolbar.js +2 -2
- package/dist/tooltip/llms.txt +10 -10
- package/dist/tooltip/tooltip.d.ts +3 -3
- package/dist/tooltip/tooltip.js +18 -18
- package/dist/tree/llms.txt +25 -12
- package/dist/tree/tree-keys.d.ts +5 -5
- package/dist/tree/tree-keys.js +7 -7
- package/dist/tree/tree.d.ts +14 -7
- package/dist/tree/tree.js +53 -18
- package/dist/update/llms.txt +54 -0
- package/dist/update/update.d.ts +49 -0
- package/dist/update/update.js +82 -0
- package/package.json +15 -13
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
/** Klawisze, które przesuwają aktywną opcję. */
|
|
2
2
|
export declare const OPTION_NAV_KEYS: Set<string>;
|
|
3
3
|
/**
|
|
4
|
-
* Indeks opcji po klawiszu `key`, z pominięciem wyłączonych (`disabled[i]`). Bez zawijania
|
|
5
|
-
* końcu listy strzałka zostaje na miejscu, jak w natywnym `<select>`. `current` = -1 znaczy
|
|
6
|
-
* aktywnego
|
|
4
|
+
* Indeks opcji po klawiszu `key`, z pominięciem wyłączonych (`disabled[i]`). Bez zawijania - na
|
|
5
|
+
* końcu listy strzałka zostaje na miejscu, jak w natywnym `<select>`. `current` = -1 znaczy "nic
|
|
6
|
+
* aktywnego": `ArrowDown` idzie wtedy na pierwszą, `ArrowUp` na ostatnią. `null` dla innych klawiszy albo listy
|
|
7
7
|
* bez aktywnych opcji.
|
|
8
8
|
*/
|
|
9
9
|
export declare function nextOptionIndex(disabled: readonly boolean[], current: number, key: string): number | null;
|
|
10
10
|
/**
|
|
11
11
|
* Wyszukiwanie po pierwszych literach (type-ahead): pierwsza aktywna opcja zaczynająca się od
|
|
12
12
|
* `query`, licząc od pozycji za `current` i zawijając. Porównanie bez wielkości liter i polskich
|
|
13
|
-
* znaków
|
|
13
|
+
* znaków - "lo" znajduje "Łódź".
|
|
14
14
|
*/
|
|
15
15
|
export declare function typeaheadIndex(labels: readonly string[], disabled: readonly boolean[], current: number, query: string): number | null;
|
|
16
16
|
/** Bufor wpisywanych liter dla type-ahead: zeruje się po chwili bez pisania. */
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*
|
|
2
|
-
* Nawigacja klawiaturą po liście opcji z aktywną pozycją (`aria-activedescendant`)
|
|
2
|
+
* Nawigacja klawiaturą po liście opcji z aktywną pozycją (`aria-activedescendant`) - wspólna dla
|
|
3
3
|
* `KptSelect`, `KptListbox` i `KptAutocomplete`. Port Angulara ma bliźniaczy plik
|
|
4
4
|
* `shared/option-nav.ts`. Fokus zostaje na kontrolce; zmienia się tylko indeks aktywnej opcji.
|
|
5
5
|
*/
|
|
@@ -9,9 +9,9 @@ const PAGE = 10;
|
|
|
9
9
|
/** Klawisze, które przesuwają aktywną opcję. */
|
|
10
10
|
export const OPTION_NAV_KEYS = new Set(['ArrowDown', 'ArrowUp', 'Home', 'End', 'PageDown', 'PageUp']);
|
|
11
11
|
/**
|
|
12
|
-
* Indeks opcji po klawiszu `key`, z pominięciem wyłączonych (`disabled[i]`). Bez zawijania
|
|
13
|
-
* końcu listy strzałka zostaje na miejscu, jak w natywnym `<select>`. `current` = -1 znaczy
|
|
14
|
-
* aktywnego
|
|
12
|
+
* Indeks opcji po klawiszu `key`, z pominięciem wyłączonych (`disabled[i]`). Bez zawijania - na
|
|
13
|
+
* końcu listy strzałka zostaje na miejscu, jak w natywnym `<select>`. `current` = -1 znaczy "nic
|
|
14
|
+
* aktywnego": `ArrowDown` idzie wtedy na pierwszą, `ArrowUp` na ostatnią. `null` dla innych klawiszy albo listy
|
|
15
15
|
* bez aktywnych opcji.
|
|
16
16
|
*/
|
|
17
17
|
export function nextOptionIndex(disabled, current, key) {
|
|
@@ -47,7 +47,7 @@ export function nextOptionIndex(disabled, current, key) {
|
|
|
47
47
|
/**
|
|
48
48
|
* Wyszukiwanie po pierwszych literach (type-ahead): pierwsza aktywna opcja zaczynająca się od
|
|
49
49
|
* `query`, licząc od pozycji za `current` i zawijając. Porównanie bez wielkości liter i polskich
|
|
50
|
-
* znaków
|
|
50
|
+
* znaków - "lo" znajduje "Łódź".
|
|
51
51
|
*/
|
|
52
52
|
export function typeaheadIndex(labels, disabled, current, query) {
|
|
53
53
|
const q = foldMentionText(query);
|
|
@@ -3,7 +3,7 @@ import { createContext, useContext } from 'react';
|
|
|
3
3
|
* Miejsce, do którego portalują się panele nakładek.
|
|
4
4
|
*
|
|
5
5
|
* `showModal()` wynosi `<dialog>` do warstwy szczytowej przeglądarki, a ta stoi ponad całym
|
|
6
|
-
* drzewem dokumentu
|
|
6
|
+
* drzewem dokumentu - żaden `z-index` tego nie przebije. Panel selecta czy menu otwarty
|
|
7
7
|
* z wnętrza modala portalowałby się na `document.body` i byłby NIEWIDOCZNY, schowany za tłem
|
|
8
8
|
* okna. `KptDialog` podstawia więc siebie jako kontener na czas, gdy jest otwarty.
|
|
9
9
|
*
|
|
@@ -5,7 +5,7 @@ export interface KptOverlayProps {
|
|
|
5
5
|
anchor: HTMLElement | null;
|
|
6
6
|
/** Kliknięcie w backdrop albo Escape. */
|
|
7
7
|
onClose: () => void;
|
|
8
|
-
/** Panel dostaje szerokość wyzwalacza
|
|
8
|
+
/** Panel dostaje szerokość wyzwalacza - dokładnie tę (podpowiedzi autocomplete pod polem). */
|
|
9
9
|
matchAnchorWidth?: boolean;
|
|
10
10
|
/**
|
|
11
11
|
* Panel jest co najmniej tak szeroki jak wyzwalacz, ale rośnie do treści (lista selecta:
|
|
@@ -16,13 +16,13 @@ export interface KptOverlayProps {
|
|
|
16
16
|
offset?: number;
|
|
17
17
|
/**
|
|
18
18
|
* Krawędź, do której wyrównujemy panel: `start` (lewa, domyślnie) albo `end` (prawa).
|
|
19
|
-
* `end` przydaje się, gdy wyzwalacz siedzi przy prawej krawędzi kontrolki
|
|
19
|
+
* `end` przydaje się, gdy wyzwalacz siedzi przy prawej krawędzi kontrolki - panel otwiera się
|
|
20
20
|
* wtedy w lewo i nie wychodzi poza nią.
|
|
21
21
|
*/
|
|
22
22
|
align?: 'start' | 'end';
|
|
23
23
|
/**
|
|
24
24
|
* Przezroczysty backdrop przechwytujący kliknięcie poza panelem. Wyłącz go tam, gdzie panel
|
|
25
|
-
* ma zostawić wyzwalacz klikalnym
|
|
25
|
+
* ma zostawić wyzwalacz klikalnym - autocomplete zamyka się na `blur` pola, a backdrop
|
|
26
26
|
* zasłoniłby to pole i zabrałby mu każde kliknięcie.
|
|
27
27
|
*/
|
|
28
28
|
withBackdrop?: boolean;
|
package/dist/internal/overlay.js
CHANGED
|
@@ -9,12 +9,12 @@ import { useKptOverlayContainer } from "./overlay-container.js";
|
|
|
9
9
|
* Port Angulara stoi tu na CDK Overlay, którego w Reakcie nie ma. Odtwarzamy jego zachowanie:
|
|
10
10
|
* pozycjonowanie względem wyzwalacza z odbiciem w górę, gdy pod spodem brakuje miejsca,
|
|
11
11
|
* przezroczysty backdrop zamykający kliknięciem oraz Escape. Style samego panelu pochodzą
|
|
12
|
-
* ze wspólnego arkusza (`.kpt-select__panel`, `.kpt-popover__panel`)
|
|
12
|
+
* ze wspólnego arkusza (`.kpt-select__panel`, `.kpt-popover__panel`) - tutaj są wyłącznie
|
|
13
13
|
* współrzędne, więc nic nie duplikuje wyglądu.
|
|
14
14
|
*/
|
|
15
|
-
/** Otwarte nakładki od najstarszej
|
|
15
|
+
/** Otwarte nakładki od najstarszej - Escape obsługuje tylko ostatnia. */
|
|
16
16
|
const overlayStack = [];
|
|
17
|
-
/** Ta sama warstwa co `--kpt-z-overlay` w tokenach
|
|
17
|
+
/** Ta sama warstwa co `--kpt-z-overlay` w tokenach - panel ma być nad treścią aplikacji. */
|
|
18
18
|
const Z_INDEX = 'var(--kpt-z-overlay, 1100)';
|
|
19
19
|
export function KptOverlay({ open, anchor, onClose, matchAnchorWidth = false, minAnchorWidth = false, offset = 4, align = 'start', withBackdrop = true, preferAbove = false, children, }) {
|
|
20
20
|
const container = useKptOverlayContainer();
|
|
@@ -28,7 +28,7 @@ export function KptOverlay({ open, anchor, onClose, matchAnchorWidth = false, mi
|
|
|
28
28
|
const panelWidth = panelRef.current?.offsetWidth ?? 0;
|
|
29
29
|
const below = window.innerHeight - rect.bottom;
|
|
30
30
|
// Odbicie w górę tylko wtedy, gdy pod spodem naprawdę brakuje miejsca, a nad wyzwalaczem
|
|
31
|
-
// jest go więcej
|
|
31
|
+
// jest go więcej - inaczej panel skakałby przy każdym przewinięciu o kilka pikseli.
|
|
32
32
|
// Przy `preferAbove` jest odwrotnie: panel stoi nad wyzwalaczem, dopóki się tam mieści.
|
|
33
33
|
const fitsAbove = panelHeight === 0 || rect.top > panelHeight + offset;
|
|
34
34
|
const flip = preferAbove ? fitsAbove : panelHeight > 0 && below < panelHeight + offset && rect.top > below;
|
|
@@ -39,8 +39,8 @@ export function KptOverlay({ open, anchor, onClose, matchAnchorWidth = false, mi
|
|
|
39
39
|
...(minAnchorWidth ? { minWidth: rect.width } : {}),
|
|
40
40
|
});
|
|
41
41
|
}, [anchor, matchAnchorWidth, minAnchorWidth, offset, align, preferAbove]);
|
|
42
|
-
// Zamknięcie zeruje pozycję w tym samym renderze (wzorzec
|
|
43
|
-
// ponowne otwarcie nie pokaże panelu na klatkę w starym miejscu
|
|
42
|
+
// Zamknięcie zeruje pozycję w tym samym renderze (wzorzec "poprzednia wartość w stanie"), więc
|
|
43
|
+
// ponowne otwarcie nie pokaże panelu na klatkę w starym miejscu - bez setState w efekcie.
|
|
44
44
|
const [wasOpen, setWasOpen] = useState(open);
|
|
45
45
|
if (wasOpen !== open) {
|
|
46
46
|
setWasOpen(open);
|
|
@@ -61,7 +61,7 @@ export function KptOverlay({ open, anchor, onClose, matchAnchorWidth = false, mi
|
|
|
61
61
|
/*
|
|
62
62
|
* Escape zamyka tylko najwyższą nakładkę (stos jak `OverlayKeyboardDispatcher` w CDK) i tylko
|
|
63
63
|
* wtedy, gdy komponent nie obsłużył klawisza sam. `preventDefault` jest konieczne: natywny
|
|
64
|
-
* `<dialog>` traktuje ten sam Escape jako żądanie zamknięcia
|
|
64
|
+
* `<dialog>` traktuje ten sam Escape jako żądanie zamknięcia - popover w `KptDialog` zamykał
|
|
65
65
|
* razem ze sobą całe okno.
|
|
66
66
|
*/
|
|
67
67
|
const token = {};
|
|
@@ -91,7 +91,7 @@ export function KptOverlay({ open, anchor, onClose, matchAnchorWidth = false, mi
|
|
|
91
91
|
width: position?.width,
|
|
92
92
|
minWidth: position?.minWidth,
|
|
93
93
|
zIndex: Z_INDEX,
|
|
94
|
-
// Panel bez pozycji jeszcze nie został zmierzony
|
|
94
|
+
// Panel bez pozycji jeszcze nie został zmierzony - chowamy go na pierwszej klatce,
|
|
95
95
|
// żeby nie mrugnął w lewym górnym rogu.
|
|
96
96
|
visibility: position ? 'visible' : 'hidden',
|
|
97
97
|
}, children: children })] }), container);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
/** 0 = bardzo słabe
|
|
1
|
+
/** 0 = bardzo słabe ... 4 = silne. */
|
|
2
2
|
export type KptPasswordScore = 0 | 1 | 2 | 3 | 4;
|
|
3
3
|
/** Przybliżona entropia w bitach. */
|
|
4
4
|
export declare function kptPasswordBits(value: string): number;
|
|
5
|
-
/** Wynik 0
|
|
5
|
+
/** Wynik 0-4 z entropii: <28 bardzo słabe, <36 słabe, <50 średnie, <64 dobre, reszta silne. */
|
|
6
6
|
export declare function kptPasswordScore(value: string): KptPasswordScore;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
/*
|
|
2
|
-
* Ocena siły hasła dla miernika `kpt-password`. Bliźniak w porcie Angulara (`shared/password-strength.ts`)
|
|
2
|
+
* Ocena siły hasła dla miernika `kpt-password`. Bliźniak w porcie Angulara (`shared/password-strength.ts`) - zmiana w obu.
|
|
3
3
|
*
|
|
4
4
|
* Wynik idzie przede wszystkim za długością, a nie za regułami składu, które odradza NIST SP 800-63B:
|
|
5
|
-
* `Password1!` spełnia wszystkie
|
|
5
|
+
* `Password1!` spełnia wszystkie "wielka, cyfra, znak specjalny", a jest jednym z najczęściej
|
|
6
6
|
* zgadywanych haseł, podczas gdy trzydzieści małych liter jest bardzo mocne. Liczymy przybliżoną
|
|
7
|
-
* entropię znak po znaku
|
|
8
|
-
* ciągi (`abcd`, `1234`, `qwerty`) i schemat
|
|
7
|
+
* entropię znak po znaku - z puli klas, które naprawdę wystąpiły - i obcinamy ją za powtórzenia,
|
|
8
|
+
* ciągi (`abcd`, `1234`, `qwerty`) i schemat "Słowo + cyfry + znak". Litery spoza ASCII
|
|
9
9
|
* (`ą`, `ż`) są literami, nie znakami specjalnymi. Bez słownika: to podpowiedź, nie zabezpieczenie.
|
|
10
10
|
*/
|
|
11
11
|
const KEYBOARD_ROWS = ['qwertyuiop', 'asdfghjkl', 'zxcvbnm', '1234567890'];
|
|
@@ -37,7 +37,7 @@ function isSequential(a, b) {
|
|
|
37
37
|
export function kptPasswordBits(value) {
|
|
38
38
|
if (!value)
|
|
39
39
|
return 0;
|
|
40
|
-
//
|
|
40
|
+
// "Słowo + cyfry + znak" (`Password1!`, `Kwiatek2024`) to pierwsze, co zgaduje atakujący -
|
|
41
41
|
// liczymy je jak samo słowo pisane małymi literami.
|
|
42
42
|
const pattern = /^(\p{Lu}?\p{Ll}+)(\p{N}{0,4})([^\p{L}\p{N}]{0,2})$/u.exec(value);
|
|
43
43
|
const chars = [...(pattern ? pattern[1] : value)];
|
|
@@ -59,7 +59,7 @@ export function kptPasswordBits(value) {
|
|
|
59
59
|
bits += pattern[2].length * 2 + pattern[3].length * 3;
|
|
60
60
|
return bits;
|
|
61
61
|
}
|
|
62
|
-
/** Wynik 0
|
|
62
|
+
/** Wynik 0-4 z entropii: <28 bardzo słabe, <36 słabe, <50 średnie, <64 dobre, reszta silne. */
|
|
63
63
|
export function kptPasswordScore(value) {
|
|
64
64
|
const bits = kptPasswordBits(value);
|
|
65
65
|
if (bits < 28)
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Indeks elementu, na który ma przejść fokus po klawiszu `key`. `disabled[i]` mówi, czy element
|
|
3
|
-
* `i` jest wyłączony
|
|
3
|
+
* `i` jest wyłączony - takie są pomijane. Strzałki zawijają się na końcach, `Home`/`End` idą do
|
|
4
4
|
* pierwszego/ostatniego aktywnego. Zwraca `null` dla klawisza, który nie nawiguje, albo gdy nie ma
|
|
5
5
|
* dokąd przejść.
|
|
6
6
|
*/
|
|
7
7
|
export declare function nextRovingIndex(disabled: readonly boolean[], current: number, key: string): number | null;
|
|
8
|
-
/** Pierwszy aktywny indeks od `preferred`
|
|
8
|
+
/** Pierwszy aktywny indeks od `preferred` - przystanek Tab, gdy wskazany element jest wyłączony. */
|
|
9
9
|
export declare function rovingStop(disabled: readonly boolean[], preferred: number): number;
|
package/dist/internal/roving.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
/*
|
|
2
|
-
* Nawigacja strzałkami po poziomym rzędzie z jednym przystankiem Tab (
|
|
2
|
+
* Nawigacja strzałkami po poziomym rzędzie z jednym przystankiem Tab ("roving tabindex") -
|
|
3
3
|
* wspólna dla `KptTabs`, `KptMenubar` i `KptMegamenu`. Port Angulara ma bliźniaczy plik
|
|
4
4
|
* `shared/roving.ts`.
|
|
5
5
|
*/
|
|
6
6
|
/**
|
|
7
7
|
* Indeks elementu, na który ma przejść fokus po klawiszu `key`. `disabled[i]` mówi, czy element
|
|
8
|
-
* `i` jest wyłączony
|
|
8
|
+
* `i` jest wyłączony - takie są pomijane. Strzałki zawijają się na końcach, `Home`/`End` idą do
|
|
9
9
|
* pierwszego/ostatniego aktywnego. Zwraca `null` dla klawisza, który nie nawiguje, albo gdy nie ma
|
|
10
10
|
* dokąd przejść.
|
|
11
11
|
*/
|
|
@@ -34,7 +34,7 @@ export function nextRovingIndex(disabled, current, key) {
|
|
|
34
34
|
return null;
|
|
35
35
|
}
|
|
36
36
|
}
|
|
37
|
-
/** Pierwszy aktywny indeks od `preferred`
|
|
37
|
+
/** Pierwszy aktywny indeks od `preferred` - przystanek Tab, gdy wskazany element jest wyłączony. */
|
|
38
38
|
export function rovingStop(disabled, preferred) {
|
|
39
39
|
if (preferred >= 0 && preferred < disabled.length && !disabled[preferred])
|
|
40
40
|
return preferred;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Blokuje przewijanie dokumentu i zwraca funkcję zdejmującą tę jedną blokadę. Licznik pozwala
|
|
3
|
-
* zagnieżdżać okna (szuflada
|
|
3
|
+
* zagnieżdżać okna (szuflada -> dialog): przewijanie wraca dopiero po zdjęciu ostatniej.
|
|
4
4
|
* `scrollbar-gutter: stable` trzyma miejsce po pasku przewijania, więc treść nie przeskakuje w bok.
|
|
5
5
|
*/
|
|
6
6
|
export declare function kptLockScroll(): () => void;
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
/*
|
|
2
2
|
* Blokada przewijania strony pod oknem modalnym. `showModal()` blokuje interakcję z tłem, ale nie
|
|
3
|
-
* jego przewijanie
|
|
3
|
+
* jego przewijanie - kółko myszy dalej przesuwa stronę. Bliźniak w porcie Angulara (`shared/scroll-lock.ts`) - zmiana w obu.
|
|
4
4
|
*/
|
|
5
5
|
let locks = 0;
|
|
6
6
|
let savedOverflow = '';
|
|
7
7
|
let savedGutter = '';
|
|
8
8
|
/**
|
|
9
9
|
* Blokuje przewijanie dokumentu i zwraca funkcję zdejmującą tę jedną blokadę. Licznik pozwala
|
|
10
|
-
* zagnieżdżać okna (szuflada
|
|
10
|
+
* zagnieżdżać okna (szuflada -> dialog): przewijanie wraca dopiero po zdjęciu ostatniej.
|
|
11
11
|
* `scrollbar-gutter: stable` trzyma miejsce po pasku przewijania, więc treść nie przeskakuje w bok.
|
|
12
12
|
*/
|
|
13
13
|
export function kptLockScroll() {
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { type ReactNode } from 'react';
|
|
2
2
|
/**
|
|
3
3
|
* Dzieci komponentu ze slotami, z rozwiniętymi fragmentami. `Children.forEach` traktuje
|
|
4
|
-
*
|
|
5
|
-
* `{admin && <><KptTab
|
|
4
|
+
* `<>...</>` jak jedno dziecko, więc slot owinięty we fragment (np. z warunku
|
|
5
|
+
* `{admin && <><KptTab .../><KptTab .../></>}`) był dla komponentu niewidoczny. Rozwijamy fragmenty
|
|
6
6
|
* rekurencyjnie; `null`, `false` i puste napisy odpadają tak jak w `Children.forEach`.
|
|
7
7
|
*/
|
|
8
8
|
export declare function slotChildren(children: ReactNode): ReactNode[];
|
|
9
9
|
/**
|
|
10
10
|
* Ostrzeżenie deweloperskie o dziecku, które komponent przyjmujący wyłącznie sloty pominie.
|
|
11
|
-
* Białe znaki między tagami (`"\n "`) nie są pomyłką
|
|
11
|
+
* Białe znaki między tagami (`"\n "`) nie są pomyłką - te przemilczamy.
|
|
12
12
|
*/
|
|
13
13
|
export declare function warnUnslottedChild(component: string, child: ReactNode, expected: string): void;
|
|
@@ -2,8 +2,8 @@ import { Children, Fragment, isValidElement } from 'react';
|
|
|
2
2
|
import { isDevBuild } from "./dev.js";
|
|
3
3
|
/**
|
|
4
4
|
* Dzieci komponentu ze slotami, z rozwiniętymi fragmentami. `Children.forEach` traktuje
|
|
5
|
-
*
|
|
6
|
-
* `{admin && <><KptTab
|
|
5
|
+
* `<>...</>` jak jedno dziecko, więc slot owinięty we fragment (np. z warunku
|
|
6
|
+
* `{admin && <><KptTab .../><KptTab .../></>}`) był dla komponentu niewidoczny. Rozwijamy fragmenty
|
|
7
7
|
* rekurencyjnie; `null`, `false` i puste napisy odpadają tak jak w `Children.forEach`.
|
|
8
8
|
*/
|
|
9
9
|
export function slotChildren(children) {
|
|
@@ -20,12 +20,12 @@ export function slotChildren(children) {
|
|
|
20
20
|
}
|
|
21
21
|
/**
|
|
22
22
|
* Ostrzeżenie deweloperskie o dziecku, które komponent przyjmujący wyłącznie sloty pominie.
|
|
23
|
-
* Białe znaki między tagami (`"\n "`) nie są pomyłką
|
|
23
|
+
* Białe znaki między tagami (`"\n "`) nie są pomyłką - te przemilczamy.
|
|
24
24
|
*/
|
|
25
25
|
export function warnUnslottedChild(component, child, expected) {
|
|
26
26
|
if (!isDevBuild())
|
|
27
27
|
return;
|
|
28
28
|
if (typeof child === 'string' && child.trim() === '')
|
|
29
29
|
return;
|
|
30
|
-
console.warn(`[${component}] Pominięto dziecko, które nie jest slotem
|
|
30
|
+
console.warn(`[${component}] Pominięto dziecko, które nie jest slotem - użyj ${expected}.`, child);
|
|
31
31
|
}
|
package/dist/internal/slot.d.ts
CHANGED
|
@@ -3,18 +3,18 @@ type AnyProps = Record<string, unknown>;
|
|
|
3
3
|
/**
|
|
4
4
|
* Scala propsy slotu z propsami dziecka. Zasady, w kolejności ważności:
|
|
5
5
|
* handlery są komponowane (najpierw dziecka, potem slotu), `className` sklejane,
|
|
6
|
-
* `style` nakładane (dziecko wygrywa), `ref` łączony, reszta
|
|
6
|
+
* `style` nakładane (dziecko wygrywa), `ref` łączony, reszta - dziecko nadpisuje slot.
|
|
7
7
|
*/
|
|
8
8
|
export declare function mergeSlotProps(slotProps: AnyProps, childProps: AnyProps): AnyProps;
|
|
9
9
|
/**
|
|
10
10
|
* Renderuje `child` z propsami slotu i podmienioną treścią. Używane przez komponenty,
|
|
11
|
-
* które w trybie `asChild` muszą zachować własne opakowanie treści
|
|
11
|
+
* które w trybie `asChild` muszą zachować własne opakowanie treści - na przykład
|
|
12
12
|
* przycisk owija zawartość w `.kpt-button__content` niezależnie od tego, jakim
|
|
13
13
|
* elementem ostatecznie jest.
|
|
14
14
|
*/
|
|
15
15
|
export declare function renderAsChild(child: ReactElement, slotProps: AnyProps, content: ReactNode): ReactElement;
|
|
16
16
|
export interface SlotProps {
|
|
17
|
-
/** Dokładnie jeden element
|
|
17
|
+
/** Dokładnie jeden element - to on przejmie propsy slotu. */
|
|
18
18
|
children?: ReactNode;
|
|
19
19
|
[prop: string]: unknown;
|
|
20
20
|
}
|
package/dist/internal/slot.js
CHANGED
|
@@ -4,7 +4,7 @@ import { composeRefs } from "./compose-refs.js";
|
|
|
4
4
|
/**
|
|
5
5
|
* Scala propsy slotu z propsami dziecka. Zasady, w kolejności ważności:
|
|
6
6
|
* handlery są komponowane (najpierw dziecka, potem slotu), `className` sklejane,
|
|
7
|
-
* `style` nakładane (dziecko wygrywa), `ref` łączony, reszta
|
|
7
|
+
* `style` nakładane (dziecko wygrywa), `ref` łączony, reszta - dziecko nadpisuje slot.
|
|
8
8
|
*/
|
|
9
9
|
export function mergeSlotProps(slotProps, childProps) {
|
|
10
10
|
const merged = { ...slotProps };
|
|
@@ -33,7 +33,7 @@ export function mergeSlotProps(slotProps, childProps) {
|
|
|
33
33
|
}
|
|
34
34
|
/**
|
|
35
35
|
* Renderuje `child` z propsami slotu i podmienioną treścią. Używane przez komponenty,
|
|
36
|
-
* które w trybie `asChild` muszą zachować własne opakowanie treści
|
|
36
|
+
* które w trybie `asChild` muszą zachować własne opakowanie treści - na przykład
|
|
37
37
|
* przycisk owija zawartość w `.kpt-button__content` niezależnie od tego, jakim
|
|
38
38
|
* elementem ostatecznie jest.
|
|
39
39
|
*/
|
package/dist/internal/step.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** Miejsca po przecinku w zapisie liczby, także wykładniczym (`0.25`
|
|
1
|
+
/** Miejsca po przecinku w zapisie liczby, także wykładniczym (`0.25` -> 2, `1e-7` -> 7). */
|
|
2
2
|
export declare function kptDecimals(n: number): number;
|
|
3
3
|
/**
|
|
4
4
|
* Zaokrągla do precyzji, która nie gubi ani kroku, ani wartości bazowej: `0.1 + 0.2` nie może
|
|
@@ -6,7 +6,7 @@ export declare function kptDecimals(n: number): number;
|
|
|
6
6
|
*/
|
|
7
7
|
export declare function kptRoundTo(n: number, ...sources: number[]): number;
|
|
8
8
|
/**
|
|
9
|
-
* Przyciąga wartość do siatki `min + k
|
|
10
|
-
* nie od zera
|
|
9
|
+
* Przyciąga wartość do siatki `min + k,step` i przycina do zakresu. Siatka zaczyna się od `min`,
|
|
10
|
+
* nie od zera - przy `min=1, step=2` dozwolone są 1, 3, 5..., tak samo myszą jak klawiaturą.
|
|
11
11
|
*/
|
|
12
12
|
export declare function kptSnapToStep(raw: number, min: number, max: number, step: number): number;
|
package/dist/internal/step.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/*
|
|
2
2
|
* Arytmetyka kroku kontrolek liczbowych (`kpt-input-number`, `kpt-knob`).
|
|
3
|
-
* Bliźniak w porcie Angulara (`shared/step.ts`)
|
|
3
|
+
* Bliźniak w porcie Angulara (`shared/step.ts`) - zmiana w obu.
|
|
4
4
|
*/
|
|
5
|
-
/** Miejsca po przecinku w zapisie liczby, także wykładniczym (`0.25`
|
|
5
|
+
/** Miejsca po przecinku w zapisie liczby, także wykładniczym (`0.25` -> 2, `1e-7` -> 7). */
|
|
6
6
|
export function kptDecimals(n) {
|
|
7
7
|
if (!Number.isFinite(n))
|
|
8
8
|
return 0;
|
|
@@ -18,8 +18,8 @@ export function kptRoundTo(n, ...sources) {
|
|
|
18
18
|
return Number(n.toFixed(decimals));
|
|
19
19
|
}
|
|
20
20
|
/**
|
|
21
|
-
* Przyciąga wartość do siatki `min + k
|
|
22
|
-
* nie od zera
|
|
21
|
+
* Przyciąga wartość do siatki `min + k,step` i przycina do zakresu. Siatka zaczyna się od `min`,
|
|
22
|
+
* nie od zera - przy `min=1, step=2` dozwolone są 1, 3, 5..., tak samo myszą jak klawiaturą.
|
|
23
23
|
*/
|
|
24
24
|
export function kptSnapToStep(raw, min, max, step) {
|
|
25
25
|
if (!(step > 0))
|
package/dist/internal/tween.d.ts
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Płynne dojście liczby do celu
|
|
2
|
+
* Płynne dojście liczby do celu - dla kontrolek, które pokazują wartość rysunkiem (łuk pokrętła)
|
|
3
3
|
* i licznikiem. Pure TS bez frameworka; bliźniak portu Angulara: `shared/tween.ts`.
|
|
4
4
|
*
|
|
5
5
|
* Bez animacji, gdy użytkownik prosi o ograniczenie ruchu (`prefers-reduced-motion`) albo gdy nie
|
|
6
|
-
* ma `requestAnimationFrame` (render po stronie serwera)
|
|
6
|
+
* ma `requestAnimationFrame` (render po stronie serwera) - wtedy cel ustawia się od razu.
|
|
7
7
|
*/
|
|
8
|
-
/** Czy animować
|
|
8
|
+
/** Czy animować - reguła wspólna dla wszystkich kontrolek, żeby "mniej ruchu" działało wszędzie. */
|
|
9
9
|
export declare function kptMotionAllowed(): boolean;
|
|
10
10
|
/**
|
|
11
11
|
* Animuje od `from` do `to` przez `duration` ms, wołając `onFrame` z wartością pośrednią.
|
|
12
|
-
* Zwraca funkcję przerwania
|
|
12
|
+
* Zwraca funkcję przerwania - kolejny skok przerywa poprzedni i rusza z miejsca, w którym ten był,
|
|
13
13
|
* więc szybkie stuknięcia strzałką nie cofają łuku do startu.
|
|
14
14
|
*/
|
|
15
15
|
export declare function kptTween(from: number, to: number, duration: number, onFrame: (value: number) => void): () => void;
|
|
16
|
-
/** Liczba miejsc po przecinku kroku (`0.25`
|
|
16
|
+
/** Liczba miejsc po przecinku kroku (`0.25` -> 2) - licznik w trakcie animacji nie pokazuje szumu. */
|
|
17
17
|
export declare function kptStepDecimals(step: number): number;
|
package/dist/internal/tween.js
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Płynne dojście liczby do celu
|
|
2
|
+
* Płynne dojście liczby do celu - dla kontrolek, które pokazują wartość rysunkiem (łuk pokrętła)
|
|
3
3
|
* i licznikiem. Pure TS bez frameworka; bliźniak portu Angulara: `shared/tween.ts`.
|
|
4
4
|
*
|
|
5
5
|
* Bez animacji, gdy użytkownik prosi o ograniczenie ruchu (`prefers-reduced-motion`) albo gdy nie
|
|
6
|
-
* ma `requestAnimationFrame` (render po stronie serwera)
|
|
6
|
+
* ma `requestAnimationFrame` (render po stronie serwera) - wtedy cel ustawia się od razu.
|
|
7
7
|
*/
|
|
8
8
|
import { kptDecimals } from "./step.js";
|
|
9
9
|
/** Zwolnienie pod koniec (ease-out cubic): ruch rusza od razu i dojeżdża miękko. */
|
|
10
10
|
const easeOut = (t) => 1 - (1 - t) ** 3;
|
|
11
|
-
/** Czy animować
|
|
11
|
+
/** Czy animować - reguła wspólna dla wszystkich kontrolek, żeby "mniej ruchu" działało wszędzie. */
|
|
12
12
|
export function kptMotionAllowed() {
|
|
13
13
|
if (typeof requestAnimationFrame === 'undefined')
|
|
14
14
|
return false;
|
|
@@ -16,7 +16,7 @@ export function kptMotionAllowed() {
|
|
|
16
16
|
}
|
|
17
17
|
/**
|
|
18
18
|
* Animuje od `from` do `to` przez `duration` ms, wołając `onFrame` z wartością pośrednią.
|
|
19
|
-
* Zwraca funkcję przerwania
|
|
19
|
+
* Zwraca funkcję przerwania - kolejny skok przerywa poprzedni i rusza z miejsca, w którym ten był,
|
|
20
20
|
* więc szybkie stuknięcia strzałką nie cofają łuku do startu.
|
|
21
21
|
*/
|
|
22
22
|
export function kptTween(from, to, duration, onFrame) {
|
|
@@ -33,7 +33,7 @@ export function kptTween(from, to, duration, onFrame) {
|
|
|
33
33
|
});
|
|
34
34
|
return () => cancelAnimationFrame(frame);
|
|
35
35
|
}
|
|
36
|
-
/** Liczba miejsc po przecinku kroku (`0.25`
|
|
36
|
+
/** Liczba miejsc po przecinku kroku (`0.25` -> 2) - licznik w trakcie animacji nie pokazuje szumu. */
|
|
37
37
|
export function kptStepDecimals(step) {
|
|
38
38
|
return kptDecimals(step);
|
|
39
39
|
}
|
package/dist/internal/types.d.ts
CHANGED
|
@@ -3,12 +3,12 @@ import type { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';
|
|
|
3
3
|
* Propsy wrappera hosta. Port odtwarza dwupoziomowy DOM Angulara
|
|
4
4
|
* (`<kpt-button class="kpt-button-host">` wokół `<button class="kpt-button">`),
|
|
5
5
|
* bo host niesie własne style. `className` i `ref` komponentu trafiają na element
|
|
6
|
-
* wewnętrzny
|
|
6
|
+
* wewnętrzny - wrapper konfiguruje się właśnie tym propem.
|
|
7
7
|
*/
|
|
8
8
|
export type KptHostProps<E extends ElementType = 'span'> = Omit<ComponentPropsWithoutRef<E>, 'children'> & {
|
|
9
9
|
/**
|
|
10
10
|
* Atrybuty `data-*` hosta. JSX przepuszcza je na elementach wbudowanych sam z siebie,
|
|
11
|
-
* ale ten typ opisuje zwykły obiekt
|
|
11
|
+
* ale ten typ opisuje zwykły obiekt - bez tego wpisu stan wariantu, który w Angularze
|
|
12
12
|
* siedzi na hoście (`[attr.data-on]`), nie miałby jak tam trafić.
|
|
13
13
|
*/
|
|
14
14
|
[key: `data-${string}`]: string | number | boolean | undefined;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/** Nazwa breakpointa z tokenów `--kpt-breakpoint-*` (mobile-first). */
|
|
2
2
|
export type KptBreakpoint = 'sm' | 'md' | 'lg' | 'xl' | '2xl';
|
|
3
3
|
/**
|
|
4
|
-
* Progi breakpointów w pikselach
|
|
4
|
+
* Progi breakpointów w pikselach - czytane wprost z `@konce-pt/tokens`, więc nie da się
|
|
5
5
|
* ich rozjechać z `@media` biblioteki ani z portem Angulara (tam ta sama tabela powstaje
|
|
6
6
|
* w kroku generowania).
|
|
7
7
|
*/
|
|
@@ -11,7 +11,7 @@ export declare function useKptMediaQuery(query: string): boolean;
|
|
|
11
11
|
/**
|
|
12
12
|
* Czy viewport ma szerokość co najmniej danego breakpointa (mobile-first).
|
|
13
13
|
*
|
|
14
|
-
* O UKŁADZIE komponentów decyduje wyłącznie CSS
|
|
14
|
+
* O UKŁADZIE komponentów decyduje wyłącznie CSS - ten hook odpowiada tylko za zachowania,
|
|
15
15
|
* których CSS nie wyrazi (np. w którą stronę ma zadziałać przycisk). Dzięki temu nic nie
|
|
16
16
|
* migocze przed hydracją.
|
|
17
17
|
*/
|
|
@@ -2,7 +2,7 @@ import { useSyncExternalStore } from 'react';
|
|
|
2
2
|
import { KPT_BREAKPOINT_2XL, KPT_BREAKPOINT_LG, KPT_BREAKPOINT_MD, KPT_BREAKPOINT_SM, KPT_BREAKPOINT_XL, } from '@konce-pt/tokens';
|
|
3
3
|
const toPx = (value) => Number.parseFloat(value);
|
|
4
4
|
/**
|
|
5
|
-
* Progi breakpointów w pikselach
|
|
5
|
+
* Progi breakpointów w pikselach - czytane wprost z `@konce-pt/tokens`, więc nie da się
|
|
6
6
|
* ich rozjechać z `@media` biblioteki ani z portem Angulara (tam ta sama tabela powstaje
|
|
7
7
|
* w kroku generowania).
|
|
8
8
|
*/
|
|
@@ -15,7 +15,7 @@ export const KPT_BREAKPOINTS = {
|
|
|
15
15
|
};
|
|
16
16
|
/**
|
|
17
17
|
* Jeden `MediaQueryList` i jeden nasłuch na zapytanie, współdzielone przez wszystkie
|
|
18
|
-
* komponenty
|
|
18
|
+
* komponenty - tak samo jak memoizacja w `KptBreakpointObserver` po stronie Angulara.
|
|
19
19
|
*/
|
|
20
20
|
const stores = new Map();
|
|
21
21
|
/**
|
|
@@ -27,7 +27,7 @@ function storeFor(query) {
|
|
|
27
27
|
const cached = stores.get(query);
|
|
28
28
|
if (cached)
|
|
29
29
|
return cached;
|
|
30
|
-
// Sam brak `window` nie wystarcza: jsdom go dostarcza, ale bez `matchMedia`
|
|
30
|
+
// Sam brak `window` nie wystarcza: jsdom go dostarcza, ale bez `matchMedia` - bez sprawdzenia
|
|
31
31
|
// metody każdy test dotykający `KptAppShell` wywala się na TypeError. Wyniku nie zapisujemy
|
|
32
32
|
// w cache'u, żeby stub podstawiony później (typowy `setup` testów) został podchwycony.
|
|
33
33
|
if (typeof window === 'undefined' || typeof window.matchMedia !== 'function')
|
|
@@ -51,7 +51,7 @@ export function useKptMediaQuery(query) {
|
|
|
51
51
|
/**
|
|
52
52
|
* Czy viewport ma szerokość co najmniej danego breakpointa (mobile-first).
|
|
53
53
|
*
|
|
54
|
-
* O UKŁADZIE komponentów decyduje wyłącznie CSS
|
|
54
|
+
* O UKŁADZIE komponentów decyduje wyłącznie CSS - ten hook odpowiada tylko za zachowania,
|
|
55
55
|
* których CSS nie wyrazi (np. w którą stronę ma zadziałać przycisk). Dzięki temu nic nie
|
|
56
56
|
* migocze przed hydracją.
|
|
57
57
|
*/
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*
|
|
7
7
|
* `setValue` ma stałą tożsamość: rodzic przekazujący `onChange` jako funkcję inline nie restartuje
|
|
8
8
|
* efektów, które mają `setValue` w zależnościach. Przejście między trybami (`value` raz podane,
|
|
9
|
-
* raz `undefined`) działa jak w Reakcie
|
|
9
|
+
* raz `undefined`) działa jak w Reakcie - po cichu przełącza źródło - ale w buildzie deweloperskim
|
|
10
10
|
* ostrzega, tak jak React robi to dla `<input>`.
|
|
11
11
|
*/
|
|
12
12
|
export declare function useControllableState<T>(options: {
|
|
@@ -8,14 +8,14 @@ import { isDevBuild } from "./dev.js";
|
|
|
8
8
|
*
|
|
9
9
|
* `setValue` ma stałą tożsamość: rodzic przekazujący `onChange` jako funkcję inline nie restartuje
|
|
10
10
|
* efektów, które mają `setValue` w zależnościach. Przejście między trybami (`value` raz podane,
|
|
11
|
-
* raz `undefined`) działa jak w Reakcie
|
|
11
|
+
* raz `undefined`) działa jak w Reakcie - po cichu przełącza źródło - ale w buildzie deweloperskim
|
|
12
12
|
* ostrzega, tak jak React robi to dla `<input>`.
|
|
13
13
|
*/
|
|
14
14
|
export function useControllableState(options) {
|
|
15
15
|
const { value, defaultValue, onChange } = options;
|
|
16
16
|
const isControlled = value !== undefined;
|
|
17
17
|
const [uncontrolled, setUncontrolled] = useState(defaultValue);
|
|
18
|
-
// Najświeższy tryb i callback dla stabilnego `setValue`
|
|
18
|
+
// Najświeższy tryb i callback dla stabilnego `setValue` - odświeżane po zatwierdzeniu renderu.
|
|
19
19
|
const latest = useRef({ isControlled, onChange });
|
|
20
20
|
useLayoutEffect(() => {
|
|
21
21
|
latest.current = { isControlled, onChange };
|
|
@@ -33,7 +33,7 @@ export function useControllableState(options) {
|
|
|
33
33
|
warned.current = true;
|
|
34
34
|
console.warn(isControlled
|
|
35
35
|
? '[koncept-ui] Komponent przeszedł z trybu niekontrolowanego w kontrolowany (`value` było undefined). Wybierz jeden tryb na całe życie komponentu.'
|
|
36
|
-
: '[koncept-ui] Komponent przeszedł z trybu kontrolowanego w niekontrolowany (`value` stało się undefined). Do
|
|
36
|
+
: '[koncept-ui] Komponent przeszedł z trybu kontrolowanego w niekontrolowany (`value` stało się undefined). Do "braku wartości" użyj null, nie undefined.');
|
|
37
37
|
}, [isControlled, initiallyControlled]);
|
|
38
38
|
return [isControlled ? value : uncontrolled, setValue];
|
|
39
39
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Stabilny identyfikator elementu w konwencji Angulara (`kpt-input
|
|
2
|
+
* Stabilny identyfikator elementu w konwencji Angulara (`kpt-input-...`), z tą samą
|
|
3
3
|
* zasadą pierwszeństwa: własne `id` przekazane przez propsy wygrywa.
|
|
4
4
|
*
|
|
5
5
|
* `useId()` z Reacta zwraca wartość ze znakami spoza [A-Za-z0-9] (React 19 używa
|
|
6
|
-
*
|
|
6
|
+
* `"r0"`), która jest poprawna w atrybucie `id`, ale nie w selektorze CSS -
|
|
7
7
|
* dlatego zostawiamy z niej tylko część alfanumeryczną.
|
|
8
8
|
*/
|
|
9
9
|
export declare function useKptId(provided: string | undefined, prefix: string): string;
|
package/dist/internal/use-id.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { useId } from 'react';
|
|
2
2
|
/**
|
|
3
|
-
* Stabilny identyfikator elementu w konwencji Angulara (`kpt-input
|
|
3
|
+
* Stabilny identyfikator elementu w konwencji Angulara (`kpt-input-...`), z tą samą
|
|
4
4
|
* zasadą pierwszeństwa: własne `id` przekazane przez propsy wygrywa.
|
|
5
5
|
*
|
|
6
6
|
* `useId()` z Reacta zwraca wartość ze znakami spoza [A-Za-z0-9] (React 19 używa
|
|
7
|
-
*
|
|
7
|
+
* `"r0"`), która jest poprawna w atrybucie `id`, ale nie w selektorze CSS -
|
|
8
8
|
* dlatego zostawiamy z niej tylko część alfanumeryczną.
|
|
9
9
|
*/
|
|
10
10
|
export function useKptId(provided, prefix) {
|
|
@@ -6,6 +6,6 @@ import { type RefObject } from 'react';
|
|
|
6
6
|
* Bez tego `aria-modal="true"` obiecywał czytnikowi okno, z którego Tab po cichu wychodził.
|
|
7
7
|
* Otwarty panel blokuje też przewijanie strony pod spodem (wspólny licznik z `KptDialog`).
|
|
8
8
|
*
|
|
9
|
-
* Port Angulara robi to samo na pułapce CDK (`shared/modal-focus.ts`)
|
|
9
|
+
* Port Angulara robi to samo na pułapce CDK (`shared/modal-focus.ts`) - zmiana zachowania w obu.
|
|
10
10
|
*/
|
|
11
11
|
export declare function useModalFocus(open: boolean, panelRef: RefObject<HTMLElement | null>): void;
|
|
@@ -2,10 +2,10 @@ import { useEffect } from 'react';
|
|
|
2
2
|
import { kptLockScroll } from "./scroll-lock.js";
|
|
3
3
|
/**
|
|
4
4
|
* Stos otwartych paneli modalnych. Pułapki słuchają `keydown` na dokumencie, więc przy dwóch
|
|
5
|
-
* otwartych naraz (szuflada
|
|
5
|
+
* otwartych naraz (szuflada -> dialog) walczyłyby o ten sam Tab - klawisz obsługuje tylko najwyższa.
|
|
6
6
|
*/
|
|
7
7
|
const stack = [];
|
|
8
|
-
/** Elementy z kolejki Tab
|
|
8
|
+
/** Elementy z kolejki Tab - na nich zawija się pułapka. */
|
|
9
9
|
const TABBABLE = 'a[href], button:not(:disabled), input:not(:disabled), select:not(:disabled), textarea:not(:disabled), [tabindex]:not([tabindex="-1"])';
|
|
10
10
|
function tabbables(panel) {
|
|
11
11
|
return [...panel.querySelectorAll(TABBABLE)].filter((el) => !el.closest('[hidden], [inert]'));
|
|
@@ -17,7 +17,7 @@ function tabbables(panel) {
|
|
|
17
17
|
* Bez tego `aria-modal="true"` obiecywał czytnikowi okno, z którego Tab po cichu wychodził.
|
|
18
18
|
* Otwarty panel blokuje też przewijanie strony pod spodem (wspólny licznik z `KptDialog`).
|
|
19
19
|
*
|
|
20
|
-
* Port Angulara robi to samo na pułapce CDK (`shared/modal-focus.ts`)
|
|
20
|
+
* Port Angulara robi to samo na pułapce CDK (`shared/modal-focus.ts`) - zmiana zachowania w obu.
|
|
21
21
|
*/
|
|
22
22
|
export function useModalFocus(open, panelRef) {
|
|
23
23
|
useEffect(() => {
|