@pitchfork-ui/elements 0.1.0 → 0.2.1
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/dist/cjs/control-label-C0eK8bPh.js +36 -0
- package/dist/cjs/control-label-C0eK8bPh.js.map +1 -0
- package/dist/cjs/index-CIskGKk1.js +4 -4
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/pf-checkbox.cjs.entry.js +3 -1
- package/dist/cjs/pf-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-combobox.cjs.entry.js +4 -3
- package/dist/cjs/pf-combobox.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-date-picker.cjs.entry.js +3 -2
- package/dist/cjs/pf-date-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-date-range-picker.cjs.entry.js +6 -5
- package/dist/cjs/pf-date-range-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-header-navigation.cjs.entry.js +15 -3
- package/dist/cjs/pf-header-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-input.cjs.entry.js +3 -1
- package/dist/cjs/pf-input.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-modal.cjs.entry.js +89 -1
- package/dist/cjs/pf-modal.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-multi-select.cjs.entry.js +4 -3
- package/dist/cjs/pf-multi-select.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-nav-item.cjs.entry.js +29 -4
- package/dist/cjs/pf-nav-item.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-number-input.cjs.entry.js +2 -1
- package/dist/cjs/pf-number-input.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-select.cjs.entry.js +4 -3
- package/dist/cjs/pf-select.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-sidebar-navigation.cjs.entry.js +11 -8
- package/dist/cjs/pf-sidebar-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-slider.cjs.entry.js +4 -2
- package/dist/cjs/pf-slider.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-switch.cjs.entry.js +3 -1
- package/dist/cjs/pf-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-tag-input.cjs.entry.js +3 -2
- package/dist/cjs/pf-tag-input.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-textarea.cjs.entry.js +2 -1
- package/dist/cjs/pf-textarea.cjs.entry.js.map +1 -1
- package/dist/cjs/pf-time-picker.cjs.entry.js +3 -2
- package/dist/cjs/pf-time-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/pitchfork.cjs.js +1 -1
- package/dist/collection/components/pf-accordion/pf-accordion.js +2 -2
- package/dist/collection/components/pf-alert/pf-alert.js +1 -1
- package/dist/collection/components/pf-avatar/pf-avatar.js +2 -2
- package/dist/collection/components/pf-badge/pf-badge.js +1 -1
- package/dist/collection/components/pf-badge-group/pf-badge-group.js +3 -3
- package/dist/collection/components/pf-button/pf-button.js +3 -3
- package/dist/collection/components/pf-checkbox/pf-checkbox.js +4 -1
- package/dist/collection/components/pf-checkbox/pf-checkbox.js.map +1 -1
- package/dist/collection/components/pf-combobox/pf-combobox.js +4 -3
- package/dist/collection/components/pf-combobox/pf-combobox.js.map +1 -1
- package/dist/collection/components/pf-content-divider/pf-content-divider.js +1 -1
- package/dist/collection/components/pf-credit-card/pf-credit-card.js +1 -1
- package/dist/collection/components/pf-date-picker/pf-date-picker.js +3 -2
- package/dist/collection/components/pf-date-picker/pf-date-picker.js.map +1 -1
- package/dist/collection/components/pf-date-range-picker/pf-date-range-picker.js +6 -5
- package/dist/collection/components/pf-date-range-picker/pf-date-range-picker.js.map +1 -1
- package/dist/collection/components/pf-empty-state/pf-empty-state.js +1 -1
- package/dist/collection/components/pf-header-navigation/pf-header-navigation.js +25 -4
- package/dist/collection/components/pf-header-navigation/pf-header-navigation.js.map +1 -1
- package/dist/collection/components/pf-inline-cta/pf-inline-cta.js +1 -1
- package/dist/collection/components/pf-input/pf-input.js +5 -2
- package/dist/collection/components/pf-input/pf-input.js.map +1 -1
- package/dist/collection/components/pf-kbd/pf-kbd.js +1 -1
- package/dist/collection/components/pf-line-chart/pf-line-chart.js +1 -1
- package/dist/collection/components/pf-loading-dots/pf-loading-dots.js +1 -1
- package/dist/collection/components/pf-metric-card/pf-metric-card.js +1 -1
- package/dist/collection/components/pf-modal/pf-modal.js +77 -6
- package/dist/collection/components/pf-modal/pf-modal.js.map +1 -1
- package/dist/collection/components/pf-multi-select/pf-multi-select.js +4 -3
- package/dist/collection/components/pf-multi-select/pf-multi-select.js.map +1 -1
- package/dist/collection/components/pf-nav-item/pf-nav-item.js +50 -5
- package/dist/collection/components/pf-nav-item/pf-nav-item.js.map +1 -1
- package/dist/collection/components/pf-notification/pf-notification.js +1 -1
- package/dist/collection/components/pf-number-input/pf-number-input.js +2 -1
- package/dist/collection/components/pf-number-input/pf-number-input.js.map +1 -1
- package/dist/collection/components/pf-progress-steps/pf-progress-steps.js +1 -1
- package/dist/collection/components/pf-radio-group/pf-radio-group.js +1 -1
- package/dist/collection/components/pf-rating-badge/pf-rating-badge.js +1 -1
- package/dist/collection/components/pf-scroll-area/pf-scroll-area.js +1 -1
- package/dist/collection/components/pf-section-header/pf-section-header.js +1 -1
- package/dist/collection/components/pf-select/pf-select.js +4 -3
- package/dist/collection/components/pf-select/pf-select.js.map +1 -1
- package/dist/collection/components/pf-sidebar-navigation/pf-sidebar-navigation.js +12 -9
- package/dist/collection/components/pf-sidebar-navigation/pf-sidebar-navigation.js.map +1 -1
- package/dist/collection/components/pf-slideout-menu/pf-slideout-menu.js +2 -2
- package/dist/collection/components/pf-slider/pf-slider.js +5 -2
- package/dist/collection/components/pf-slider/pf-slider.js.map +1 -1
- package/dist/collection/components/pf-switch/pf-switch.js +4 -1
- package/dist/collection/components/pf-switch/pf-switch.js.map +1 -1
- package/dist/collection/components/pf-tab/pf-tab.js +2 -2
- package/dist/collection/components/pf-table-cell/pf-table-cell.js +1 -1
- package/dist/collection/components/pf-tabs/pf-tabs.js +2 -2
- package/dist/collection/components/pf-tag/pf-tag.js +1 -1
- package/dist/collection/components/pf-tag-input/pf-tag-input.js +3 -2
- package/dist/collection/components/pf-tag-input/pf-tag-input.js.map +1 -1
- package/dist/collection/components/pf-textarea/pf-textarea.js +2 -1
- package/dist/collection/components/pf-textarea/pf-textarea.js.map +1 -1
- package/dist/collection/components/pf-time-picker/pf-time-picker.js +3 -2
- package/dist/collection/components/pf-time-picker/pf-time-picker.js.map +1 -1
- package/dist/collection/components/pf-timeline-item/pf-timeline-item.js +1 -1
- package/dist/collection/components/pf-toaster/pf-toaster.js +2 -2
- package/dist/collection/components/pf-toolbar/pf-toolbar.js +1 -1
- package/dist/collection/components/pf-toolbar-separator/pf-toolbar-separator.js +1 -1
- package/dist/collection/components/pf-utility-button/pf-utility-button.js +2 -2
- package/dist/collection/components/pf-video-player/pf-video-player.js +2 -2
- package/dist/collection/control-label.js +30 -0
- package/dist/collection/control-label.js.map +1 -0
- package/dist/components/p-Cy_kHPeC.js +2 -0
- package/dist/components/p-Cy_kHPeC.js.map +1 -0
- package/dist/components/pf-checkbox.js +1 -1
- package/dist/components/pf-checkbox.js.map +1 -1
- package/dist/components/pf-combobox.js +1 -1
- package/dist/components/pf-combobox.js.map +1 -1
- package/dist/components/pf-date-picker.js +1 -1
- package/dist/components/pf-date-picker.js.map +1 -1
- package/dist/components/pf-date-range-picker.js +1 -1
- package/dist/components/pf-date-range-picker.js.map +1 -1
- package/dist/components/pf-header-navigation.js +1 -1
- package/dist/components/pf-header-navigation.js.map +1 -1
- package/dist/components/pf-input.js +1 -1
- package/dist/components/pf-input.js.map +1 -1
- package/dist/components/pf-modal.js +1 -1
- package/dist/components/pf-modal.js.map +1 -1
- package/dist/components/pf-multi-select.js +1 -1
- package/dist/components/pf-multi-select.js.map +1 -1
- package/dist/components/pf-nav-item.js +1 -1
- package/dist/components/pf-nav-item.js.map +1 -1
- package/dist/components/pf-number-input.js +1 -1
- package/dist/components/pf-number-input.js.map +1 -1
- package/dist/components/pf-select.js +1 -1
- package/dist/components/pf-select.js.map +1 -1
- package/dist/components/pf-sidebar-navigation.js +1 -1
- package/dist/components/pf-sidebar-navigation.js.map +1 -1
- package/dist/components/pf-slider.js +1 -1
- package/dist/components/pf-slider.js.map +1 -1
- package/dist/components/pf-switch.js +1 -1
- package/dist/components/pf-switch.js.map +1 -1
- package/dist/components/pf-tag-input.js +1 -1
- package/dist/components/pf-tag-input.js.map +1 -1
- package/dist/components/pf-textarea.js +1 -1
- package/dist/components/pf-textarea.js.map +1 -1
- package/dist/components/pf-time-picker.js +1 -1
- package/dist/components/pf-time-picker.js.map +1 -1
- package/dist/docs.json +73 -52
- package/dist/elements.json +100 -10
- package/dist/esm/control-label-Cy_kHPeC.js +34 -0
- package/dist/esm/control-label-Cy_kHPeC.js.map +1 -0
- package/dist/esm/index-Bm6UxEit.js +4 -4
- package/dist/esm/loader.js +1 -1
- package/dist/esm/pf-checkbox.entry.js +4 -2
- package/dist/esm/pf-checkbox.entry.js.map +1 -1
- package/dist/esm/pf-combobox.entry.js +4 -3
- package/dist/esm/pf-combobox.entry.js.map +1 -1
- package/dist/esm/pf-date-picker.entry.js +3 -2
- package/dist/esm/pf-date-picker.entry.js.map +1 -1
- package/dist/esm/pf-date-range-picker.entry.js +6 -5
- package/dist/esm/pf-date-range-picker.entry.js.map +1 -1
- package/dist/esm/pf-header-navigation.entry.js +15 -3
- package/dist/esm/pf-header-navigation.entry.js.map +1 -1
- package/dist/esm/pf-input.entry.js +4 -2
- package/dist/esm/pf-input.entry.js.map +1 -1
- package/dist/esm/pf-modal.entry.js +89 -1
- package/dist/esm/pf-modal.entry.js.map +1 -1
- package/dist/esm/pf-multi-select.entry.js +4 -3
- package/dist/esm/pf-multi-select.entry.js.map +1 -1
- package/dist/esm/pf-nav-item.entry.js +30 -5
- package/dist/esm/pf-nav-item.entry.js.map +1 -1
- package/dist/esm/pf-number-input.entry.js +2 -1
- package/dist/esm/pf-number-input.entry.js.map +1 -1
- package/dist/esm/pf-select.entry.js +4 -3
- package/dist/esm/pf-select.entry.js.map +1 -1
- package/dist/esm/pf-sidebar-navigation.entry.js +11 -8
- package/dist/esm/pf-sidebar-navigation.entry.js.map +1 -1
- package/dist/esm/pf-slider.entry.js +5 -3
- package/dist/esm/pf-slider.entry.js.map +1 -1
- package/dist/esm/pf-switch.entry.js +4 -2
- package/dist/esm/pf-switch.entry.js.map +1 -1
- package/dist/esm/pf-tag-input.entry.js +3 -2
- package/dist/esm/pf-tag-input.entry.js.map +1 -1
- package/dist/esm/pf-textarea.entry.js +2 -1
- package/dist/esm/pf-textarea.entry.js.map +1 -1
- package/dist/esm/pf-time-picker.entry.js +3 -2
- package/dist/esm/pf-time-picker.entry.js.map +1 -1
- package/dist/esm/pitchfork.js +1 -1
- package/dist/pitchfork/p-01ed0d56.entry.js +2 -0
- package/dist/pitchfork/p-01ed0d56.entry.js.map +1 -0
- package/dist/pitchfork/p-02e28338.entry.js +2 -0
- package/dist/pitchfork/p-02e28338.entry.js.map +1 -0
- package/dist/pitchfork/p-19c0145c.entry.js +2 -0
- package/dist/pitchfork/p-19c0145c.entry.js.map +1 -0
- package/dist/pitchfork/p-22d8c69d.entry.js +2 -0
- package/dist/pitchfork/p-22d8c69d.entry.js.map +1 -0
- package/dist/pitchfork/p-2add2e98.entry.js +2 -0
- package/dist/pitchfork/p-2add2e98.entry.js.map +1 -0
- package/dist/pitchfork/p-45039de3.entry.js +2 -0
- package/dist/pitchfork/p-45039de3.entry.js.map +1 -0
- package/dist/pitchfork/p-4dfe7e8a.entry.js +2 -0
- package/dist/pitchfork/p-4dfe7e8a.entry.js.map +1 -0
- package/dist/pitchfork/p-51353d53.entry.js +2 -0
- package/dist/pitchfork/p-51353d53.entry.js.map +1 -0
- package/dist/pitchfork/p-5b98848c.entry.js +2 -0
- package/dist/pitchfork/{p-fd5a5ea1.entry.js.map → p-5b98848c.entry.js.map} +1 -1
- package/dist/pitchfork/p-7197ef71.entry.js +2 -0
- package/dist/pitchfork/p-7197ef71.entry.js.map +1 -0
- package/dist/pitchfork/p-Cy_kHPeC.js +2 -0
- package/dist/pitchfork/p-Cy_kHPeC.js.map +1 -0
- package/dist/pitchfork/p-ab6c09e7.entry.js +2 -0
- package/dist/pitchfork/p-ab6c09e7.entry.js.map +1 -0
- package/dist/pitchfork/p-d7ca4026.entry.js +2 -0
- package/dist/pitchfork/p-d7ca4026.entry.js.map +1 -0
- package/dist/pitchfork/p-dd48d94d.entry.js +2 -0
- package/dist/pitchfork/p-dd48d94d.entry.js.map +1 -0
- package/dist/pitchfork/p-ec8df806.entry.js +2 -0
- package/dist/pitchfork/p-ec8df806.entry.js.map +1 -0
- package/dist/pitchfork/p-f5df568f.entry.js +2 -0
- package/dist/pitchfork/p-f5df568f.entry.js.map +1 -0
- package/dist/pitchfork/p-f713c62d.entry.js +2 -0
- package/dist/pitchfork/p-f713c62d.entry.js.map +1 -0
- package/dist/pitchfork/p-fd802631.entry.js +2 -0
- package/dist/pitchfork/p-fd802631.entry.js.map +1 -0
- package/dist/pitchfork/pitchfork.esm.js +1 -1
- package/dist/types/components/pf-checkbox/pf-checkbox.d.ts +1 -0
- package/dist/types/components/pf-header-navigation/pf-header-navigation.d.ts +11 -2
- package/dist/types/components/pf-input/pf-input.d.ts +1 -0
- package/dist/types/components/pf-modal/pf-modal.d.ts +56 -3
- package/dist/types/components/pf-nav-item/pf-nav-item.d.ts +21 -1
- package/dist/types/components/pf-sidebar-navigation/pf-sidebar-navigation.d.ts +10 -7
- package/dist/types/components/pf-slider/pf-slider.d.ts +1 -0
- package/dist/types/components/pf-switch/pf-switch.d.ts +1 -0
- package/dist/types/components.d.ts +57 -18
- package/dist/types/control-label.d.ts +24 -0
- package/package.json +4 -4
- package/dist/pitchfork/p-1dbea97f.entry.js +0 -2
- package/dist/pitchfork/p-1dbea97f.entry.js.map +0 -1
- package/dist/pitchfork/p-23b1be9b.entry.js +0 -2
- package/dist/pitchfork/p-23b1be9b.entry.js.map +0 -1
- package/dist/pitchfork/p-33857f80.entry.js +0 -2
- package/dist/pitchfork/p-33857f80.entry.js.map +0 -1
- package/dist/pitchfork/p-47cabc33.entry.js +0 -2
- package/dist/pitchfork/p-47cabc33.entry.js.map +0 -1
- package/dist/pitchfork/p-48b2d3f7.entry.js +0 -2
- package/dist/pitchfork/p-48b2d3f7.entry.js.map +0 -1
- package/dist/pitchfork/p-5064d2dd.entry.js +0 -2
- package/dist/pitchfork/p-5064d2dd.entry.js.map +0 -1
- package/dist/pitchfork/p-52eef7eb.entry.js +0 -2
- package/dist/pitchfork/p-52eef7eb.entry.js.map +0 -1
- package/dist/pitchfork/p-845c5252.entry.js +0 -2
- package/dist/pitchfork/p-845c5252.entry.js.map +0 -1
- package/dist/pitchfork/p-a24bf2bd.entry.js +0 -2
- package/dist/pitchfork/p-a24bf2bd.entry.js.map +0 -1
- package/dist/pitchfork/p-a9b77dbb.entry.js +0 -2
- package/dist/pitchfork/p-a9b77dbb.entry.js.map +0 -1
- package/dist/pitchfork/p-c6bdd9cd.entry.js +0 -2
- package/dist/pitchfork/p-c6bdd9cd.entry.js.map +0 -1
- package/dist/pitchfork/p-d0d2070b.entry.js +0 -2
- package/dist/pitchfork/p-d0d2070b.entry.js.map +0 -1
- package/dist/pitchfork/p-d248b027.entry.js +0 -2
- package/dist/pitchfork/p-d248b027.entry.js.map +0 -1
- package/dist/pitchfork/p-d6425298.entry.js +0 -2
- package/dist/pitchfork/p-d6425298.entry.js.map +0 -1
- package/dist/pitchfork/p-d7eb6335.entry.js +0 -2
- package/dist/pitchfork/p-d7eb6335.entry.js.map +0 -1
- package/dist/pitchfork/p-e944f504.entry.js +0 -2
- package/dist/pitchfork/p-e944f504.entry.js.map +0 -1
- package/dist/pitchfork/p-fd5a5ea1.entry.js +0 -2
|
@@ -91,7 +91,7 @@ export class PfAlert {
|
|
|
91
91
|
"references": {
|
|
92
92
|
"PfAlertVariant": {
|
|
93
93
|
"location": "local",
|
|
94
|
-
"path": "/
|
|
94
|
+
"path": "/home/runner/work/pitchfork-ui/pitchfork-ui/packages/elements/src/components/pf-alert/pf-alert.tsx",
|
|
95
95
|
"id": "src/components/pf-alert/pf-alert.tsx::PfAlertVariant"
|
|
96
96
|
}
|
|
97
97
|
}
|
|
@@ -104,7 +104,7 @@ export class PfAvatar {
|
|
|
104
104
|
"references": {
|
|
105
105
|
"PfAvatarSize": {
|
|
106
106
|
"location": "local",
|
|
107
|
-
"path": "/
|
|
107
|
+
"path": "/home/runner/work/pitchfork-ui/pitchfork-ui/packages/elements/src/components/pf-avatar/pf-avatar.tsx",
|
|
108
108
|
"id": "src/components/pf-avatar/pf-avatar.tsx::PfAvatarSize"
|
|
109
109
|
}
|
|
110
110
|
}
|
|
@@ -130,7 +130,7 @@ export class PfAvatar {
|
|
|
130
130
|
"references": {
|
|
131
131
|
"PfAvatarStatus": {
|
|
132
132
|
"location": "local",
|
|
133
|
-
"path": "/
|
|
133
|
+
"path": "/home/runner/work/pitchfork-ui/pitchfork-ui/packages/elements/src/components/pf-avatar/pf-avatar.tsx",
|
|
134
134
|
"id": "src/components/pf-avatar/pf-avatar.tsx::PfAvatarStatus"
|
|
135
135
|
}
|
|
136
136
|
}
|
|
@@ -36,7 +36,7 @@ export class PfBadge {
|
|
|
36
36
|
"references": {
|
|
37
37
|
"PfBadgeVariant": {
|
|
38
38
|
"location": "local",
|
|
39
|
-
"path": "/
|
|
39
|
+
"path": "/home/runner/work/pitchfork-ui/pitchfork-ui/packages/elements/src/components/pf-badge/pf-badge.tsx",
|
|
40
40
|
"id": "src/components/pf-badge/pf-badge.tsx::PfBadgeVariant"
|
|
41
41
|
}
|
|
42
42
|
}
|
|
@@ -89,7 +89,7 @@ export class PfBadgeGroup {
|
|
|
89
89
|
"references": {
|
|
90
90
|
"PfBadgeGroupColor": {
|
|
91
91
|
"location": "local",
|
|
92
|
-
"path": "/
|
|
92
|
+
"path": "/home/runner/work/pitchfork-ui/pitchfork-ui/packages/elements/src/components/pf-badge-group/pf-badge-group.tsx",
|
|
93
93
|
"id": "src/components/pf-badge-group/pf-badge-group.tsx::PfBadgeGroupColor"
|
|
94
94
|
}
|
|
95
95
|
}
|
|
@@ -115,7 +115,7 @@ export class PfBadgeGroup {
|
|
|
115
115
|
"references": {
|
|
116
116
|
"PfBadgeGroupAppearance": {
|
|
117
117
|
"location": "local",
|
|
118
|
-
"path": "/
|
|
118
|
+
"path": "/home/runner/work/pitchfork-ui/pitchfork-ui/packages/elements/src/components/pf-badge-group/pf-badge-group.tsx",
|
|
119
119
|
"id": "src/components/pf-badge-group/pf-badge-group.tsx::PfBadgeGroupAppearance"
|
|
120
120
|
}
|
|
121
121
|
}
|
|
@@ -141,7 +141,7 @@ export class PfBadgeGroup {
|
|
|
141
141
|
"references": {
|
|
142
142
|
"PfBadgeGroupBadgePosition": {
|
|
143
143
|
"location": "local",
|
|
144
|
-
"path": "/
|
|
144
|
+
"path": "/home/runner/work/pitchfork-ui/pitchfork-ui/packages/elements/src/components/pf-badge-group/pf-badge-group.tsx",
|
|
145
145
|
"id": "src/components/pf-badge-group/pf-badge-group.tsx::PfBadgeGroupBadgePosition"
|
|
146
146
|
}
|
|
147
147
|
}
|
|
@@ -62,7 +62,7 @@ export class PfButton {
|
|
|
62
62
|
"references": {
|
|
63
63
|
"PfButtonVariant": {
|
|
64
64
|
"location": "local",
|
|
65
|
-
"path": "/
|
|
65
|
+
"path": "/home/runner/work/pitchfork-ui/pitchfork-ui/packages/elements/src/components/pf-button/pf-button.tsx",
|
|
66
66
|
"id": "src/components/pf-button/pf-button.tsx::PfButtonVariant"
|
|
67
67
|
}
|
|
68
68
|
}
|
|
@@ -88,7 +88,7 @@ export class PfButton {
|
|
|
88
88
|
"references": {
|
|
89
89
|
"PfButtonSize": {
|
|
90
90
|
"location": "local",
|
|
91
|
-
"path": "/
|
|
91
|
+
"path": "/home/runner/work/pitchfork-ui/pitchfork-ui/packages/elements/src/components/pf-button/pf-button.tsx",
|
|
92
92
|
"id": "src/components/pf-button/pf-button.tsx::PfButtonSize"
|
|
93
93
|
}
|
|
94
94
|
}
|
|
@@ -174,7 +174,7 @@ export class PfButton {
|
|
|
174
174
|
"references": {
|
|
175
175
|
"PfButtonType": {
|
|
176
176
|
"location": "local",
|
|
177
|
-
"path": "/
|
|
177
|
+
"path": "/home/runner/work/pitchfork-ui/pitchfork-ui/packages/elements/src/components/pf-button/pf-button.tsx",
|
|
178
178
|
"id": "src/components/pf-button/pf-button.tsx::PfButtonType"
|
|
179
179
|
}
|
|
180
180
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { h, Host, } from "@stencil/core";
|
|
2
2
|
import { applyControlValidity } from "../../form-validity";
|
|
3
|
+
import { controlAriaLabel } from "../../control-label";
|
|
3
4
|
/**
|
|
4
5
|
* A form-associated checkbox.
|
|
5
6
|
*
|
|
@@ -8,6 +9,7 @@ import { applyControlValidity } from "../../form-validity";
|
|
|
8
9
|
* @part label - the label element.
|
|
9
10
|
*/
|
|
10
11
|
export class PfCheckbox {
|
|
12
|
+
el;
|
|
11
13
|
internals;
|
|
12
14
|
/**
|
|
13
15
|
* Submitted under this name.
|
|
@@ -74,7 +76,7 @@ export class PfCheckbox {
|
|
|
74
76
|
this.pfChange.emit({ checked: this.checked, value: this.value });
|
|
75
77
|
};
|
|
76
78
|
render() {
|
|
77
|
-
return (h(Host, { key: '
|
|
79
|
+
return (h(Host, { key: 'f0888c00b688aef2c90deb60a7496971c2e52ac3' }, h("div", { key: '25dbafc87f7c597cc055ade975033bab23ed67d9', class: "field", part: "field" }, h("input", { key: '2d6f97d80d2686ad13ddac12bf70d12828611ad8', id: "input", "aria-label": controlAriaLabel(this.el, this.label), part: "input", class: "input", type: "checkbox", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, "aria-invalid": this.error ? 'true' : null, "aria-describedby": this.error ? 'error' : null, onChange: this.onChange }), this.label && (h("label", { key: '0c6427fb3168226dd5c69e06e5769efab4cc0d5e', class: "label", part: "label", htmlFor: "input" }, this.label))), this.error && (h("p", { key: '401852018ce3b0c0a856e669d96c33d185a5b730', class: "error", part: "error", id: "error" }, this.error))));
|
|
78
80
|
}
|
|
79
81
|
static get is() { return "pf-checkbox"; }
|
|
80
82
|
static get encapsulation() { return "shadow"; }
|
|
@@ -304,6 +306,7 @@ export class PfCheckbox {
|
|
|
304
306
|
}
|
|
305
307
|
};
|
|
306
308
|
}
|
|
309
|
+
static get elementRef() { return "el"; }
|
|
307
310
|
static get watchers() {
|
|
308
311
|
return [{
|
|
309
312
|
"propName": "checked",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pf-checkbox.js","sourceRoot":"","sources":["../../../src/components/pf-checkbox/pf-checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EACf,SAAS,EACT,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,KAAK,GACN,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;
|
|
1
|
+
{"version":3,"file":"pf-checkbox.js","sourceRoot":"","sources":["../../../src/components/pf-checkbox/pf-checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\n\nimport { applyControlValidity } from '../../form-validity';\nimport { controlAriaLabel } from '../../control-label';\n\n/**\n * A form-associated checkbox.\n *\n * @part field - the wrapper around control and label.\n * @part input - the native checkbox.\n * @part label - the label element.\n */\n@Component({\n tag: 'pf-checkbox',\n styleUrl: 'pf-checkbox.css',\n formAssociated: true,\n shadow: { delegatesFocus: true },\n})\nexport class PfCheckbox {\n @Element() el!: HTMLElement;\n\n @AttachInternals() internals!: ElementInternals;\n\n /**\n * Submitted under this name.\n *\n * Reflected, because a form-associated custom element takes its submission\n * name from the `name` *content attribute* -- not from this property. A\n * framework wrapper that sets properties rather than attributes (the\n * generated React bindings do) would otherwise leave the control nameless\n * and absent from the submission, with every other sign of working.\n */\n @Prop({ reflect: true }) name?: string;\n\n /** Whether the box is ticked. Reflected so the stylesheet can select on it. */\n @Prop({ mutable: true, reflect: true }) checked = false;\n\n /**\n * What is submitted when ticked. Mirrors the native attribute, whose default\n * is also `on` — a checkbox with no value still submits something.\n */\n @Prop() value = 'on';\n\n /** Visible label, rendered in the same root so `for` actually associates. */\n @Prop() label?: string;\n\n /** Error message. Its presence is what marks the control invalid. */\n @Prop() error?: string;\n\n @Prop({ reflect: true }) required = false;\n\n @Prop({ reflect: true }) disabled = false;\n\n /** Fires when the user ticks or unticks the box. */\n @Event() pfChange!: EventEmitter<{ checked: boolean; value: string }>;\n\n /** The state a form reset restores, which is the initial attribute. */\n private initialChecked = false;\n\n componentWillLoad() {\n this.initialChecked = this.checked;\n this.syncFormState();\n }\n\n @Watch('checked')\n @Watch('error')\n @Watch('required')\n @Watch('value')\n syncFormState() {\n /*\n * `null`, not an empty string, when unticked: an unchecked checkbox is\n * absent from the submission entirely, rather than present and empty.\n * That is what a server distinguishing \"unticked\" from \"not sent\" relies\n * on, and it is what a native checkbox does.\n */\n this.internals.setFormValue(this.checked ? this.value : null);\n applyControlValidity(this.internals, this.checked, this.required, this.error);\n }\n\n /** A form-associated custom element does not inherit this. */\n @Method()\n async checkValidity(): Promise<boolean> {\n return this.internals.checkValidity();\n }\n\n /** As `checkValidity`, but also shows the browser's validation message. */\n @Method()\n async reportValidity(): Promise<boolean> {\n return this.internals.reportValidity();\n }\n\n /** The message explaining why the control is invalid, or an empty string. */\n @Method()\n async getValidationMessage(): Promise<string> {\n return this.internals.validationMessage;\n }\n\n /**\n * A reset restores the initial state, not `false` — a native\n * `<input type=checkbox checked>` comes back ticked.\n */\n formResetCallback() {\n this.checked = this.initialChecked;\n }\n\n private onChange = (event: Event) => {\n this.checked = (event.target as HTMLInputElement).checked;\n this.pfChange.emit({ checked: this.checked, value: this.value });\n };\n\n render() {\n return (\n <Host>\n <div class=\"field\" part=\"field\">\n <input\n id=\"input\"\n aria-label={controlAriaLabel(this.el, this.label)}\n part=\"input\"\n class=\"input\"\n type=\"checkbox\"\n name={this.name}\n value={this.value}\n checked={this.checked}\n required={this.required}\n disabled={this.disabled}\n aria-invalid={this.error ? 'true' : null}\n aria-describedby={this.error ? 'error' : null}\n onChange={this.onChange}\n />\n {this.label && (\n <label class=\"label\" part=\"label\" htmlFor=\"input\">\n {this.label}\n </label>\n )}\n </div>\n {this.error && (\n <p class=\"error\" part=\"error\" id=\"error\">\n {this.error}\n </p>\n )}\n </Host>\n );\n }\n}\n"]}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { composeDescribedBy, getEnabledIndexes, Keys, matchesCommandQuery, observeAnchoredPosition, queryIsEchoedSelection, resolveListMove, } from "@pitchfork-ui/core";
|
|
2
2
|
import { applyControlValidity } from "../../form-validity";
|
|
3
|
+
import { controlAriaLabel } from "../../control-label";
|
|
3
4
|
import { placePopover } from "../../place-popover";
|
|
4
5
|
import { h, Host, } from "@stencil/core";
|
|
5
6
|
const MOVES = {
|
|
@@ -315,12 +316,12 @@ export class PfCombobox {
|
|
|
315
316
|
render() {
|
|
316
317
|
const describedBy = composeDescribedBy(this.description && 'description', this.error && 'error');
|
|
317
318
|
const showClear = this.clearable && !this.disabled && (this.query !== '' || this.value !== '');
|
|
318
|
-
return (h(Host, { key: '
|
|
319
|
+
return (h(Host, { key: '4a948db9316e8174c9c7592afb9912deb59eecdd' }, h("div", { key: 'ac5e469f9c00ec843fdb7a485cb3cbe9ddc08573', class: "field", part: "field" }, this.label && (h("label", { key: 'eb610c213cfe510c229f5ffa81e9761bf7303476', class: "label", part: "label", htmlFor: "input" }, this.label, this.required && (h("span", { key: 'd942137e81be6007aafe2e1dfc43e97e2ab8af59', class: "required", "aria-hidden": "true" }, "*")))), h("div", { key: 'b9f4806e7882e5dc2c64abe87f48bb925173d7dc', class: { control: true, 'control--invalid': Boolean(this.error) }, part: "control" }, h("input", { key: '9a10cc81ff212f3e279cfcc311886756d7ca76f1', id: "input", "aria-label": controlAriaLabel(this.el, this.label), part: "input", class: "input", type: "text", role: "combobox", autocomplete: "off", disabled: this.disabled, required: this.required, placeholder: this.placeholder, value: this.query, "aria-autocomplete": "list", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": "listbox", "aria-invalid": this.error ? 'true' : null, "aria-describedby": describedBy, onInput: this.onInput, onKeyDown: this.onKeyDown, onClick: () => {
|
|
319
320
|
if (!this.disabled)
|
|
320
321
|
this.open = true;
|
|
321
|
-
} }), showClear && (h("button", { key: '
|
|
322
|
+
} }), showClear && (h("button", { key: 'bc9f8df667df57cbede3aa00a4119f6591faeb7d', class: "clear", part: "clear", type: "button", "aria-label": this.clearLabel,
|
|
322
323
|
/* Out of the tab order, so it never interrupts the keyboard flow. */
|
|
323
|
-
tabindex: -1, onMouseDown: (event) => event.preventDefault(), onClick: this.clear }, h("pf-icon", { key: '
|
|
324
|
+
tabindex: -1, onMouseDown: (event) => event.preventDefault(), onClick: this.clear }, h("pf-icon", { key: '580dab29c2631f79b7a611f7dd95a81fc5cffda2', name: "circle-xmark" }))), h("span", { key: '06d06d1fcbae5937632cf2451ab97d42d1410c91', class: "chevron", "aria-hidden": "true" }, h("pf-icon", { key: 'd30dd0a5d008cec99c1ec8fd25acc7fdfbdd68db', name: "chevron-down" }))), this.description && (h("p", { key: '09873008049536bb2eab61825ae95a2d92e3952a', class: "description", part: "description", id: "description" }, this.description)), this.error && (h("p", { key: 'ee43b1e024ff0e6e052054278680e04651b55421', class: "error", part: "error", id: "error" }, this.error))), h("div", { key: '5b221c6566bc6dd29dc3a5d9ee5268ec65fa296e', id: "listbox", part: "listbox", class: "listbox", popover: "auto", role: "listbox", "aria-label": this.label ?? this.placeholder, onToggle: this.onToggle }, h("slot", { key: '645c56c8dd776ddd013be68c2bfc544f35c05b35', onSlotchange: this.onSlotChange }), this.matchCount === 0 && (h("p", { key: '9a3aac572c41177b41be06f9986d0718756c7de3', class: "empty", part: "empty" }, this.emptyMessage)))));
|
|
324
325
|
}
|
|
325
326
|
static get is() { return "pf-combobox"; }
|
|
326
327
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pf-combobox.js","sourceRoot":"","sources":["../../../src/components/pf-combobox/pf-combobox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n composeDescribedBy,\n getEnabledIndexes,\n Keys,\n matchesCommandQuery,\n observeAnchoredPosition,\n queryIsEchoedSelection,\n resolveListMove,\n type ListNavigationAction,\n} from '@pitchfork-ui/core';\n\nimport { applyControlValidity } from '../../form-validity';\nimport { placePopover } from '../../place-popover';\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\n\nconst MOVES: Record<string, ListNavigationAction> = {\n [Keys.ArrowDown]: 'next',\n [Keys.ArrowUp]: 'previous',\n [Keys.Home]: 'first',\n [Keys.End]: 'last',\n};\n\n/**\n * A form-associated combobox: an editable field that filters `pf-option`\n * children.\n *\n * It shares `pf-option` with `pf-select`, which is why the option reads a\n * generic `--pf-option-*` set that each container maps to its own family —\n * the same arrangement as `pf-menu-item` between the two menus.\n *\n * Filtering is core's `matchesCommandQuery`, and so is the rule that a query\n * which is only the chosen label echoed back does not filter: without it,\n * reopening the list to change your mind would show the one answer you already\n * had. Both shared with the React component, which is now rewired to them.\n *\n * Two things the React `Combobox` does not do, both gaps rather than choices:\n * Home and End, and arrows that wrap rather than stop at the ends — which is\n * what `pf-select` does, and one design system should not have two arrow\n * behaviours in neighbouring controls.\n *\n * @slot - the `pf-option` children.\n * @part field - the wrapper around label, control and messages.\n * @part label - the label element.\n * @part control - the box holding the input, clear button and chevron.\n * @part input - the editable field.\n * @part clear - the clear button.\n * @part listbox - the floating listbox the options are slotted into.\n * @part empty - the message shown when nothing matches.\n * @part description - the hint text below the control.\n * @part error - the error message below the control.\n */\n@Component({\n tag: 'pf-combobox',\n styleUrl: 'pf-combobox.css',\n formAssociated: true,\n shadow: true,\n})\nexport class PfCombobox {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /** Submitted under this name. Reflected; the submission reads the attribute. */\n @Prop({ reflect: true }) name?: string;\n\n /** The chosen option's value, or empty. */\n @Prop({ mutable: true, reflect: true }) value = '';\n\n /** Whether the listbox is showing. Reflected for the stylesheet. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n @Prop() label?: string;\n\n @Prop() description?: string;\n\n @Prop() error?: string;\n\n @Prop() placeholder = 'Search…';\n\n /** Shown when the query matches nothing. */\n @Prop() emptyMessage = 'No matches';\n\n @Prop({ reflect: true }) required = false;\n\n @Prop({ reflect: true }) disabled = false;\n\n /** Offer a button that empties the field. */\n @Prop() clearable = true;\n\n /** Accessible name for that button. */\n @Prop() clearLabel = 'Clear';\n\n /** Fires when the chosen value changes. */\n @Event() pfChange!: EventEmitter<{ value: string }>;\n\n /** Fires whenever the listbox opens or closes, whoever caused it. */\n @Event() pfOpenChange!: EventEmitter<{ open: boolean }>;\n\n /** What the field holds, which is not the value until an option is chosen. */\n @State() query = '';\n\n @State() matchCount = 0;\n\n private initialValue = '';\n private stopObserving?: () => void;\n private activeOption: HTMLElement | null = null;\n\n componentWillLoad() {\n this.initialValue = this.value ?? '';\n this.syncFormState();\n this.query = this.selectedLabel();\n this.applyQuery();\n }\n\n componentDidRender() {\n this.syncActiveDescendant();\n }\n\n disconnectedCallback() {\n this.stopObserving?.();\n }\n\n @Watch('value')\n @Watch('error')\n @Watch('required')\n syncFormState() {\n this.internals.setFormValue(this.value || null);\n applyControlValidity(this.internals, Boolean(this.value), this.required, this.error);\n }\n\n /** A value set from outside puts its label in the field and marks the option. */\n @Watch('value')\n syncSelection() {\n for (const option of this.options()) {\n (option as HTMLElement & { selected: boolean }).selected =\n this.optionValue(option) === this.value && this.value !== '';\n }\n this.query = this.selectedLabel();\n this.applyQuery();\n }\n\n @Watch('open')\n syncOpen(next: boolean, previous: boolean) {\n if (next) this.showListbox();\n else this.hideListbox();\n if (next !== previous) this.pfOpenChange.emit({ open: next });\n }\n\n @Method()\n async show(): Promise<void> {\n if (!this.disabled) this.open = true;\n }\n\n @Method()\n async hide(): Promise<void> {\n this.open = false;\n }\n\n @Method()\n async checkValidity(): Promise<boolean> {\n return this.internals.checkValidity();\n }\n\n @Method()\n async reportValidity(): Promise<boolean> {\n return this.internals.reportValidity();\n }\n\n @Method()\n async getValidationMessage(): Promise<string> {\n return this.internals.validationMessage;\n }\n\n formResetCallback() {\n this.value = this.initialValue;\n this.query = this.selectedLabel();\n this.applyQuery();\n }\n\n /** Re-reads the options, for a label edited in place (no `slotchange` fires). */\n @Method()\n async refresh(): Promise<void> {\n this.syncSelection();\n }\n\n private onSlotChange = () => {\n this.syncSelection();\n };\n\n private options(): HTMLElement[] {\n return Array.from(this.el.querySelectorAll<HTMLElement>('pf-option'));\n }\n\n private visible(): HTMLElement[] {\n return this.options().filter((option) => !option.hasAttribute('hidden'));\n }\n\n /** The property, never the attribute: a binding may only have set the former. */\n private optionValue(option: HTMLElement): string {\n return (option as HTMLElement & { value?: string }).value ?? option.getAttribute('value') ?? '';\n }\n\n private selectedLabel(): string {\n const chosen = this.options().find((option) => this.optionValue(option) === this.value);\n return this.value && chosen ? (chosen.textContent?.trim() ?? '') : '';\n }\n\n private get listbox() {\n return this.el.shadowRoot?.querySelector<HTMLElement>('[part=\"listbox\"]') ?? null;\n }\n\n private get input() {\n return this.el.shadowRoot?.querySelector<HTMLInputElement>('[part=\"input\"]') ?? null;\n }\n\n private get control() {\n return this.el.shadowRoot?.querySelector<HTMLElement>('[part=\"control\"]') ?? null;\n }\n\n /**\n * Hides the options the query excludes.\n *\n * `hidden` plus `:host([hidden]) { display: none }` on the option, because\n * the attribute alone loses to the option's own `display: block`.\n */\n private applyQuery() {\n const echoed = queryIsEchoedSelection(this.query, this.selectedLabel());\n const options = this.options();\n\n for (const option of options) {\n const matches =\n echoed || matchesCommandQuery({ label: option.textContent?.trim() ?? '' }, this.query);\n if (matches) option.removeAttribute('hidden');\n else option.setAttribute('hidden', '');\n }\n\n const visible = this.visible();\n this.matchCount = visible.length;\n\n // A new query starts at the top of what is left.\n const first = visible.find((option) => !option.hasAttribute('disabled')) ?? null;\n if (!this.activeOption || this.activeOption.hasAttribute('hidden')) this.setActive(first);\n }\n\n private showListbox() {\n const panel = this.listbox;\n if (this.disabled || !panel || panel.matches(':popover-open')) return;\n\n panel.showPopover();\n this.stopObserving?.();\n this.stopObserving = observeAnchoredPosition({\n getAnchor: () => this.control,\n getFloating: () => panel,\n matchAnchorWidth: true,\n flip: true,\n onChange: ({ left, top, width, minWidth }) => {\n placePopover(panel, left, top);\n if (width !== undefined) panel.style.width = `${width}px`;\n if (minWidth !== undefined) panel.style.minWidth = `${minWidth}px`;\n },\n });\n\n this.applyQuery();\n }\n\n private hideListbox() {\n this.stopObserving?.();\n this.stopObserving = undefined;\n const panel = this.listbox;\n if (panel?.matches(':popover-open')) panel.hidePopover();\n }\n\n /**\n * A browser-driven close — light dismiss or Escape — reverts the field to\n * the chosen label, so a half-typed query never lingers over a different\n * value. Focus goes back to the input rather than the trigger, because here\n * the input *is* the control.\n */\n private onToggle = (event: ToggleEvent) => {\n const nowOpen = event.newState === 'open';\n if (this.open !== nowOpen) this.open = nowOpen;\n if (!nowOpen) {\n this.query = this.selectedLabel();\n this.applyQuery();\n this.input?.focus();\n }\n };\n\n private setActive(option: HTMLElement | null) {\n for (const other of this.options()) {\n if (other !== option) (other as HTMLElement & { active: boolean }).active = false;\n }\n if (option) (option as HTMLElement & { active: boolean }).active = true;\n\n this.activeOption = option;\n this.syncActiveDescendant();\n if (option && typeof option.scrollIntoView === 'function') {\n option.scrollIntoView({ block: 'nearest' });\n }\n }\n\n /**\n * Set as an element, not an IDREF: the input is in this shadow root and the\n * options are slotted light DOM, and a cross-root IDREF is absent from the\n * accessibility tree — measured. Feature-detected, because where element\n * reflection is missing there is no cross-root equivalent.\n */\n private syncActiveDescendant() {\n const input = this.input;\n if (!input || !('ariaActiveDescendantElement' in input)) return;\n (\n input as unknown as { ariaActiveDescendantElement: Element | null }\n ).ariaActiveDescendantElement = this.open ? this.activeOption : null;\n }\n\n private commit(option: HTMLElement) {\n if (option.hasAttribute('disabled')) return;\n\n const next = this.optionValue(option);\n this.open = false;\n\n if (next !== this.value) {\n this.value = next;\n this.pfChange.emit({ value: next });\n }\n\n // Set after the value, so it is the chosen label rather than the query.\n this.query = this.selectedLabel();\n this.applyQuery();\n this.input?.focus();\n }\n\n @Listen('pfOptionSelect')\n handleOptionSelect(event: CustomEvent<{ value: string }>) {\n event.stopPropagation();\n if (this.disabled) return;\n\n const option = this.options().find(\n (candidate) => this.optionValue(candidate) === event.detail.value,\n );\n if (option) this.commit(option);\n }\n\n private move(action: ListNavigationAction) {\n const visible = this.visible();\n const enabledIndexes = getEnabledIndexes(visible, (option) => option.hasAttribute('disabled'));\n const current = this.activeOption ? visible.indexOf(this.activeOption) : -1;\n const next = resolveListMove(action, enabledIndexes, current);\n if (next !== -1) this.setActive(visible[next] ?? null);\n }\n\n private onInput = (event: Event) => {\n this.query = (event.target as HTMLInputElement).value;\n this.applyQuery();\n if (!this.open) this.open = true;\n };\n\n private clear = () => {\n this.query = '';\n if (this.value !== '') {\n this.value = '';\n this.pfChange.emit({ value: '' });\n }\n this.applyQuery();\n this.open = true;\n this.input?.focus();\n };\n\n private onKeyDown = (event: KeyboardEvent) => {\n if (this.disabled) return;\n\n const move = MOVES[event.key];\n if (move) {\n event.preventDefault();\n if (!this.open) this.open = true;\n else this.move(move);\n return;\n }\n\n /*\n * Enter only commits while the listbox is open. Closed, it is left alone\n * so a combobox inside a form still submits it.\n */\n if (event.key === Keys.Enter && this.open && this.activeOption) {\n event.preventDefault();\n this.commit(this.activeOption);\n }\n\n // Escape is the browser's: `popover=\"auto\"` closes, and `onToggle` reverts.\n };\n\n render() {\n const describedBy = composeDescribedBy(\n this.description && 'description',\n this.error && 'error',\n );\n const showClear = this.clearable && !this.disabled && (this.query !== '' || this.value !== '');\n\n return (\n <Host>\n <div class=\"field\" part=\"field\">\n {this.label && (\n <label class=\"label\" part=\"label\" htmlFor=\"input\">\n {this.label}\n {this.required && (\n <span class=\"required\" aria-hidden=\"true\">\n *\n </span>\n )}\n </label>\n )}\n\n <div class={{ control: true, 'control--invalid': Boolean(this.error) }} part=\"control\">\n <input\n id=\"input\"\n part=\"input\"\n class=\"input\"\n type=\"text\"\n role=\"combobox\"\n autocomplete=\"off\"\n disabled={this.disabled}\n required={this.required}\n placeholder={this.placeholder}\n value={this.query}\n aria-autocomplete=\"list\"\n aria-expanded={this.open ? 'true' : 'false'}\n /* Same shadow root as the listbox, so this IDREF resolves. */\n aria-controls=\"listbox\"\n aria-invalid={this.error ? 'true' : null}\n aria-describedby={describedBy}\n onInput={this.onInput}\n onKeyDown={this.onKeyDown}\n onClick={() => {\n if (!this.disabled) this.open = true;\n }}\n />\n\n {showClear && (\n <button\n class=\"clear\"\n part=\"clear\"\n type=\"button\"\n aria-label={this.clearLabel}\n /* Out of the tab order, so it never interrupts the keyboard flow. */\n tabindex={-1}\n onMouseDown={(event) => event.preventDefault()}\n onClick={this.clear}\n >\n <pf-icon name=\"circle-xmark\"></pf-icon>\n </button>\n )}\n\n <span class=\"chevron\" aria-hidden=\"true\">\n <pf-icon name=\"chevron-down\"></pf-icon>\n </span>\n </div>\n\n {this.description && (\n <p class=\"description\" part=\"description\" id=\"description\">\n {this.description}\n </p>\n )}\n {this.error && (\n <p class=\"error\" part=\"error\" id=\"error\">\n {this.error}\n </p>\n )}\n </div>\n\n <div\n id=\"listbox\"\n part=\"listbox\"\n class=\"listbox\"\n popover=\"auto\"\n role=\"listbox\"\n aria-label={this.label ?? this.placeholder}\n onToggle={this.onToggle}\n >\n <slot onSlotchange={this.onSlotChange} />\n {this.matchCount === 0 && (\n <p class=\"empty\" part=\"empty\">\n {this.emptyMessage}\n </p>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"pf-combobox.js","sourceRoot":"","sources":["../../../src/components/pf-combobox/pf-combobox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n composeDescribedBy,\n getEnabledIndexes,\n Keys,\n matchesCommandQuery,\n observeAnchoredPosition,\n queryIsEchoedSelection,\n resolveListMove,\n type ListNavigationAction,\n} from '@pitchfork-ui/core';\n\nimport { applyControlValidity } from '../../form-validity';\nimport { controlAriaLabel } from '../../control-label';\nimport { placePopover } from '../../place-popover';\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\n\nconst MOVES: Record<string, ListNavigationAction> = {\n [Keys.ArrowDown]: 'next',\n [Keys.ArrowUp]: 'previous',\n [Keys.Home]: 'first',\n [Keys.End]: 'last',\n};\n\n/**\n * A form-associated combobox: an editable field that filters `pf-option`\n * children.\n *\n * It shares `pf-option` with `pf-select`, which is why the option reads a\n * generic `--pf-option-*` set that each container maps to its own family —\n * the same arrangement as `pf-menu-item` between the two menus.\n *\n * Filtering is core's `matchesCommandQuery`, and so is the rule that a query\n * which is only the chosen label echoed back does not filter: without it,\n * reopening the list to change your mind would show the one answer you already\n * had. Both shared with the React component, which is now rewired to them.\n *\n * Two things the React `Combobox` does not do, both gaps rather than choices:\n * Home and End, and arrows that wrap rather than stop at the ends — which is\n * what `pf-select` does, and one design system should not have two arrow\n * behaviours in neighbouring controls.\n *\n * @slot - the `pf-option` children.\n * @part field - the wrapper around label, control and messages.\n * @part label - the label element.\n * @part control - the box holding the input, clear button and chevron.\n * @part input - the editable field.\n * @part clear - the clear button.\n * @part listbox - the floating listbox the options are slotted into.\n * @part empty - the message shown when nothing matches.\n * @part description - the hint text below the control.\n * @part error - the error message below the control.\n */\n@Component({\n tag: 'pf-combobox',\n styleUrl: 'pf-combobox.css',\n formAssociated: true,\n shadow: true,\n})\nexport class PfCombobox {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /** Submitted under this name. Reflected; the submission reads the attribute. */\n @Prop({ reflect: true }) name?: string;\n\n /** The chosen option's value, or empty. */\n @Prop({ mutable: true, reflect: true }) value = '';\n\n /** Whether the listbox is showing. Reflected for the stylesheet. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n @Prop() label?: string;\n\n @Prop() description?: string;\n\n @Prop() error?: string;\n\n @Prop() placeholder = 'Search…';\n\n /** Shown when the query matches nothing. */\n @Prop() emptyMessage = 'No matches';\n\n @Prop({ reflect: true }) required = false;\n\n @Prop({ reflect: true }) disabled = false;\n\n /** Offer a button that empties the field. */\n @Prop() clearable = true;\n\n /** Accessible name for that button. */\n @Prop() clearLabel = 'Clear';\n\n /** Fires when the chosen value changes. */\n @Event() pfChange!: EventEmitter<{ value: string }>;\n\n /** Fires whenever the listbox opens or closes, whoever caused it. */\n @Event() pfOpenChange!: EventEmitter<{ open: boolean }>;\n\n /** What the field holds, which is not the value until an option is chosen. */\n @State() query = '';\n\n @State() matchCount = 0;\n\n private initialValue = '';\n private stopObserving?: () => void;\n private activeOption: HTMLElement | null = null;\n\n componentWillLoad() {\n this.initialValue = this.value ?? '';\n this.syncFormState();\n this.query = this.selectedLabel();\n this.applyQuery();\n }\n\n componentDidRender() {\n this.syncActiveDescendant();\n }\n\n disconnectedCallback() {\n this.stopObserving?.();\n }\n\n @Watch('value')\n @Watch('error')\n @Watch('required')\n syncFormState() {\n this.internals.setFormValue(this.value || null);\n applyControlValidity(this.internals, Boolean(this.value), this.required, this.error);\n }\n\n /** A value set from outside puts its label in the field and marks the option. */\n @Watch('value')\n syncSelection() {\n for (const option of this.options()) {\n (option as HTMLElement & { selected: boolean }).selected =\n this.optionValue(option) === this.value && this.value !== '';\n }\n this.query = this.selectedLabel();\n this.applyQuery();\n }\n\n @Watch('open')\n syncOpen(next: boolean, previous: boolean) {\n if (next) this.showListbox();\n else this.hideListbox();\n if (next !== previous) this.pfOpenChange.emit({ open: next });\n }\n\n @Method()\n async show(): Promise<void> {\n if (!this.disabled) this.open = true;\n }\n\n @Method()\n async hide(): Promise<void> {\n this.open = false;\n }\n\n @Method()\n async checkValidity(): Promise<boolean> {\n return this.internals.checkValidity();\n }\n\n @Method()\n async reportValidity(): Promise<boolean> {\n return this.internals.reportValidity();\n }\n\n @Method()\n async getValidationMessage(): Promise<string> {\n return this.internals.validationMessage;\n }\n\n formResetCallback() {\n this.value = this.initialValue;\n this.query = this.selectedLabel();\n this.applyQuery();\n }\n\n /** Re-reads the options, for a label edited in place (no `slotchange` fires). */\n @Method()\n async refresh(): Promise<void> {\n this.syncSelection();\n }\n\n private onSlotChange = () => {\n this.syncSelection();\n };\n\n private options(): HTMLElement[] {\n return Array.from(this.el.querySelectorAll<HTMLElement>('pf-option'));\n }\n\n private visible(): HTMLElement[] {\n return this.options().filter((option) => !option.hasAttribute('hidden'));\n }\n\n /** The property, never the attribute: a binding may only have set the former. */\n private optionValue(option: HTMLElement): string {\n return (option as HTMLElement & { value?: string }).value ?? option.getAttribute('value') ?? '';\n }\n\n private selectedLabel(): string {\n const chosen = this.options().find((option) => this.optionValue(option) === this.value);\n return this.value && chosen ? (chosen.textContent?.trim() ?? '') : '';\n }\n\n private get listbox() {\n return this.el.shadowRoot?.querySelector<HTMLElement>('[part=\"listbox\"]') ?? null;\n }\n\n private get input() {\n return this.el.shadowRoot?.querySelector<HTMLInputElement>('[part=\"input\"]') ?? null;\n }\n\n private get control() {\n return this.el.shadowRoot?.querySelector<HTMLElement>('[part=\"control\"]') ?? null;\n }\n\n /**\n * Hides the options the query excludes.\n *\n * `hidden` plus `:host([hidden]) { display: none }` on the option, because\n * the attribute alone loses to the option's own `display: block`.\n */\n private applyQuery() {\n const echoed = queryIsEchoedSelection(this.query, this.selectedLabel());\n const options = this.options();\n\n for (const option of options) {\n const matches =\n echoed || matchesCommandQuery({ label: option.textContent?.trim() ?? '' }, this.query);\n if (matches) option.removeAttribute('hidden');\n else option.setAttribute('hidden', '');\n }\n\n const visible = this.visible();\n this.matchCount = visible.length;\n\n // A new query starts at the top of what is left.\n const first = visible.find((option) => !option.hasAttribute('disabled')) ?? null;\n if (!this.activeOption || this.activeOption.hasAttribute('hidden')) this.setActive(first);\n }\n\n private showListbox() {\n const panel = this.listbox;\n if (this.disabled || !panel || panel.matches(':popover-open')) return;\n\n panel.showPopover();\n this.stopObserving?.();\n this.stopObserving = observeAnchoredPosition({\n getAnchor: () => this.control,\n getFloating: () => panel,\n matchAnchorWidth: true,\n flip: true,\n onChange: ({ left, top, width, minWidth }) => {\n placePopover(panel, left, top);\n if (width !== undefined) panel.style.width = `${width}px`;\n if (minWidth !== undefined) panel.style.minWidth = `${minWidth}px`;\n },\n });\n\n this.applyQuery();\n }\n\n private hideListbox() {\n this.stopObserving?.();\n this.stopObserving = undefined;\n const panel = this.listbox;\n if (panel?.matches(':popover-open')) panel.hidePopover();\n }\n\n /**\n * A browser-driven close — light dismiss or Escape — reverts the field to\n * the chosen label, so a half-typed query never lingers over a different\n * value. Focus goes back to the input rather than the trigger, because here\n * the input *is* the control.\n */\n private onToggle = (event: ToggleEvent) => {\n const nowOpen = event.newState === 'open';\n if (this.open !== nowOpen) this.open = nowOpen;\n if (!nowOpen) {\n this.query = this.selectedLabel();\n this.applyQuery();\n this.input?.focus();\n }\n };\n\n private setActive(option: HTMLElement | null) {\n for (const other of this.options()) {\n if (other !== option) (other as HTMLElement & { active: boolean }).active = false;\n }\n if (option) (option as HTMLElement & { active: boolean }).active = true;\n\n this.activeOption = option;\n this.syncActiveDescendant();\n if (option && typeof option.scrollIntoView === 'function') {\n option.scrollIntoView({ block: 'nearest' });\n }\n }\n\n /**\n * Set as an element, not an IDREF: the input is in this shadow root and the\n * options are slotted light DOM, and a cross-root IDREF is absent from the\n * accessibility tree — measured. Feature-detected, because where element\n * reflection is missing there is no cross-root equivalent.\n */\n private syncActiveDescendant() {\n const input = this.input;\n if (!input || !('ariaActiveDescendantElement' in input)) return;\n (\n input as unknown as { ariaActiveDescendantElement: Element | null }\n ).ariaActiveDescendantElement = this.open ? this.activeOption : null;\n }\n\n private commit(option: HTMLElement) {\n if (option.hasAttribute('disabled')) return;\n\n const next = this.optionValue(option);\n this.open = false;\n\n if (next !== this.value) {\n this.value = next;\n this.pfChange.emit({ value: next });\n }\n\n // Set after the value, so it is the chosen label rather than the query.\n this.query = this.selectedLabel();\n this.applyQuery();\n this.input?.focus();\n }\n\n @Listen('pfOptionSelect')\n handleOptionSelect(event: CustomEvent<{ value: string }>) {\n event.stopPropagation();\n if (this.disabled) return;\n\n const option = this.options().find(\n (candidate) => this.optionValue(candidate) === event.detail.value,\n );\n if (option) this.commit(option);\n }\n\n private move(action: ListNavigationAction) {\n const visible = this.visible();\n const enabledIndexes = getEnabledIndexes(visible, (option) => option.hasAttribute('disabled'));\n const current = this.activeOption ? visible.indexOf(this.activeOption) : -1;\n const next = resolveListMove(action, enabledIndexes, current);\n if (next !== -1) this.setActive(visible[next] ?? null);\n }\n\n private onInput = (event: Event) => {\n this.query = (event.target as HTMLInputElement).value;\n this.applyQuery();\n if (!this.open) this.open = true;\n };\n\n private clear = () => {\n this.query = '';\n if (this.value !== '') {\n this.value = '';\n this.pfChange.emit({ value: '' });\n }\n this.applyQuery();\n this.open = true;\n this.input?.focus();\n };\n\n private onKeyDown = (event: KeyboardEvent) => {\n if (this.disabled) return;\n\n const move = MOVES[event.key];\n if (move) {\n event.preventDefault();\n if (!this.open) this.open = true;\n else this.move(move);\n return;\n }\n\n /*\n * Enter only commits while the listbox is open. Closed, it is left alone\n * so a combobox inside a form still submits it.\n */\n if (event.key === Keys.Enter && this.open && this.activeOption) {\n event.preventDefault();\n this.commit(this.activeOption);\n }\n\n // Escape is the browser's: `popover=\"auto\"` closes, and `onToggle` reverts.\n };\n\n render() {\n const describedBy = composeDescribedBy(\n this.description && 'description',\n this.error && 'error',\n );\n const showClear = this.clearable && !this.disabled && (this.query !== '' || this.value !== '');\n\n return (\n <Host>\n <div class=\"field\" part=\"field\">\n {this.label && (\n <label class=\"label\" part=\"label\" htmlFor=\"input\">\n {this.label}\n {this.required && (\n <span class=\"required\" aria-hidden=\"true\">\n *\n </span>\n )}\n </label>\n )}\n\n <div class={{ control: true, 'control--invalid': Boolean(this.error) }} part=\"control\">\n <input\n id=\"input\"\n aria-label={controlAriaLabel(this.el, this.label)}\n part=\"input\"\n class=\"input\"\n type=\"text\"\n role=\"combobox\"\n autocomplete=\"off\"\n disabled={this.disabled}\n required={this.required}\n placeholder={this.placeholder}\n value={this.query}\n aria-autocomplete=\"list\"\n aria-expanded={this.open ? 'true' : 'false'}\n /* Same shadow root as the listbox, so this IDREF resolves. */\n aria-controls=\"listbox\"\n aria-invalid={this.error ? 'true' : null}\n aria-describedby={describedBy}\n onInput={this.onInput}\n onKeyDown={this.onKeyDown}\n onClick={() => {\n if (!this.disabled) this.open = true;\n }}\n />\n\n {showClear && (\n <button\n class=\"clear\"\n part=\"clear\"\n type=\"button\"\n aria-label={this.clearLabel}\n /* Out of the tab order, so it never interrupts the keyboard flow. */\n tabindex={-1}\n onMouseDown={(event) => event.preventDefault()}\n onClick={this.clear}\n >\n <pf-icon name=\"circle-xmark\"></pf-icon>\n </button>\n )}\n\n <span class=\"chevron\" aria-hidden=\"true\">\n <pf-icon name=\"chevron-down\"></pf-icon>\n </span>\n </div>\n\n {this.description && (\n <p class=\"description\" part=\"description\" id=\"description\">\n {this.description}\n </p>\n )}\n {this.error && (\n <p class=\"error\" part=\"error\" id=\"error\">\n {this.error}\n </p>\n )}\n </div>\n\n <div\n id=\"listbox\"\n part=\"listbox\"\n class=\"listbox\"\n popover=\"auto\"\n role=\"listbox\"\n aria-label={this.label ?? this.placeholder}\n onToggle={this.onToggle}\n >\n <slot onSlotchange={this.onSlotChange} />\n {this.matchCount === 0 && (\n <p class=\"empty\" part=\"empty\">\n {this.emptyMessage}\n </p>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -72,7 +72,7 @@ export class PfContentDivider {
|
|
|
72
72
|
"references": {
|
|
73
73
|
"PfContentDividerOrientation": {
|
|
74
74
|
"location": "local",
|
|
75
|
-
"path": "/
|
|
75
|
+
"path": "/home/runner/work/pitchfork-ui/pitchfork-ui/packages/elements/src/components/pf-content-divider/pf-content-divider.tsx",
|
|
76
76
|
"id": "src/components/pf-content-divider/pf-content-divider.tsx::PfContentDividerOrientation"
|
|
77
77
|
}
|
|
78
78
|
}
|
|
@@ -58,7 +58,7 @@ export class PfCreditCard {
|
|
|
58
58
|
"references": {
|
|
59
59
|
"PfCreditCardBrand": {
|
|
60
60
|
"location": "local",
|
|
61
|
-
"path": "/
|
|
61
|
+
"path": "/home/runner/work/pitchfork-ui/pitchfork-ui/packages/elements/src/components/pf-credit-card/pf-credit-card.tsx",
|
|
62
62
|
"id": "src/components/pf-credit-card/pf-credit-card.tsx::PfCreditCardBrand"
|
|
63
63
|
}
|
|
64
64
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { composeDescribedBy, Keys, observeAnchoredPosition, parseISODate, } from "@pitchfork-ui/core";
|
|
2
2
|
import { applyControlValidity } from "../../form-validity";
|
|
3
|
+
import { controlAriaLabel } from "../../control-label";
|
|
3
4
|
import { placePopover } from "../../place-popover";
|
|
4
5
|
import { h, Host, } from "@stencil/core";
|
|
5
6
|
/**
|
|
@@ -217,10 +218,10 @@ export class PfDatePicker {
|
|
|
217
218
|
render() {
|
|
218
219
|
const describedBy = composeDescribedBy(this.description && 'description', this.error && 'error');
|
|
219
220
|
const text = this.formatted();
|
|
220
|
-
return (h(Host, { key: '
|
|
221
|
+
return (h(Host, { key: 'e12dc3b1467bfa1b6b47ad6ecde5ff3740f84191' }, h("div", { key: 'da81455cc8034d76ee9a5632bf3d7bba8a59ca36', class: "field", part: "field" }, this.label && (h("label", { key: '7d5e93bbb12ebaec62e541e1e7ff7051ffd1d9ba', class: "label", part: "label", htmlFor: "trigger" }, this.label, this.required && (h("span", { key: '96da5bb4885737801b0934459809761016eff84b', class: "required", "aria-hidden": "true" }, "*")))), h("div", { key: '7d4bb358df9ec3477847a7456aea8aaede3c6bd1', class: "row" }, h("button", { key: '6f0c8095438a87284f339c58cf2bd37ac6d6e8c3', id: "trigger", "aria-label": controlAriaLabel(this.el, this.label), part: "trigger", class: { trigger: true, 'trigger--invalid': Boolean(this.error) }, type: "button", disabled: this.disabled, "aria-haspopup": "dialog", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": "panel", "aria-invalid": this.error ? 'true' : null, "aria-required": this.required ? 'true' : null, "aria-describedby": describedBy, onClick: () => {
|
|
221
222
|
if (!this.disabled)
|
|
222
223
|
this.open = !this.open;
|
|
223
|
-
}, onKeyDown: this.onTriggerKeyDown }, h("span", { key: '
|
|
224
|
+
}, onKeyDown: this.onTriggerKeyDown }, h("span", { key: '7d163538c024cb22bf62556ac45fe2c6412df31b', class: { value: true, 'value--placeholder': !text } }, text || this.placeholder), h("pf-icon", { key: '0453fc920b7ae38e155a09e355b7a3d574604d14', name: "calendar" })), this.allowClear && this.value && (h("button", { key: '2e933393553ad120ee949673477b7106e94915cb', class: "clear", part: "clear", type: "button", "aria-label": "Clear selected date", disabled: this.disabled, onClick: this.clear }, h("pf-icon", { key: 'dc784a97f467297a6cb0cb691c52006fa1e32c24', name: "circle-xmark" })))), this.description && (h("p", { key: '087d6e84fc1a653b8e5b92a2bf4c8148f4d16f39', class: "description", part: "description", id: "description" }, this.description)), this.error && (h("p", { key: '292095f16e9328828a7f821b42d47827ce0d5335', class: "error", part: "error", id: "error" }, this.error))), h("div", { key: 'a3f5435249a41d602f160e195a8a551d7f40e23a', id: "panel", part: "panel", class: "panel", popover: "auto", role: "dialog", "aria-label": "Choose a date", onToggle: this.onToggle }, h("pf-calendar", { key: '8db356ae8180b9eaae81df8c560a0f8db68664f8', ref: this.bindCalendar, part: "calendar", value: this.value || undefined, min: this.min, max: this.max, startYear: this.startYear, endYear: this.endYear, showOutsideDays: this.showOutsideDays, isDateDisabled: this.isDateDisabled }))));
|
|
224
225
|
}
|
|
225
226
|
static get is() { return "pf-date-picker"; }
|
|
226
227
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pf-date-picker.js","sourceRoot":"","sources":["../../../src/components/pf-date-picker/pf-date-picker.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n composeDescribedBy,\n Keys,\n observeAnchoredPosition,\n parseISODate,\n} from '@pitchfork-ui/core';\n\nimport { applyControlValidity } from '../../form-validity';\nimport { placePopover } from '../../place-popover';\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\n\n/**\n * A form-associated date field: a trigger that opens `pf-calendar` in a\n * popover.\n *\n * Form-associated, which the React `DatePicker` is not — it is a button and a\n * portal, so its value reaches a surrounding `<form>` only if the consumer\n * wires it there themselves. Here the value is submitted as `YYYY-MM-DD`,\n * constraint validation works, and Angular's generated accessor has something\n * to bind to.\n *\n * The panel is a `popover`, so light dismiss and Escape are the browser's.\n * Unlike `pf-dropdown`, the trigger and the panel are both in *this* shadow\n * root, so `aria-controls` resolves and is worth setting — a same-root IDREF\n * is the one case that works, measured.\n *\n * @part field - the wrapper around label, control and messages.\n * @part label - the label element.\n * @part trigger - the button that opens the calendar.\n * @part clear - the clear button.\n * @part panel - the floating panel holding the calendar.\n * @part calendar - the calendar itself.\n * @part description - the hint text below the control.\n * @part error - the error message below the control.\n */\n@Component({\n tag: 'pf-date-picker',\n styleUrl: 'pf-date-picker.css',\n formAssociated: true,\n shadow: true,\n})\nexport class PfDatePicker {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /**\n * Submitted under this name. Reflected, because the submission name comes\n * from the content attribute and the generated bindings set properties.\n */\n @Prop({ reflect: true }) name?: string;\n\n /** The selected date as `YYYY-MM-DD`, or empty. */\n @Prop({ mutable: true }) value = '';\n\n /** Whether the calendar is showing. Reflected for the stylesheet. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n /** Visible label. In the same root as the trigger, so `for` works. */\n @Prop() label?: string;\n\n /** Hint text below the control. */\n @Prop() description?: string;\n\n /** Error message. Its presence is what marks the control invalid. */\n @Prop() error?: string;\n\n @Prop() placeholder = 'Select a date';\n\n @Prop({ reflect: true }) required = false;\n\n @Prop({ reflect: true }) disabled = false;\n\n /** Offer a button that empties the field. */\n @Prop() allowClear = false;\n\n /** Earliest selectable date, as `YYYY-MM-DD`. */\n @Prop() min?: string;\n\n /** Latest selectable date, as `YYYY-MM-DD`. */\n @Prop() max?: string;\n\n @Prop() startYear?: number;\n\n @Prop() endYear?: number;\n\n @Prop() showOutsideDays = true;\n\n /** A predicate for days that cannot be chosen; see `pf-calendar`. */\n @Prop() isDateDisabled?: (date: Date) => boolean;\n\n /** Fires when a date is chosen or cleared. */\n @Event() pfChange!: EventEmitter<{ value: string }>;\n\n /** Fires whenever the calendar opens or closes, whoever caused it. */\n @Event() pfOpenChange!: EventEmitter<{ open: boolean }>;\n\n /** What a form reset restores; `value` has been overwritten by then. */\n private initialValue = '';\n\n private stopObserving?: () => void;\n\n componentWillLoad() {\n this.initialValue = this.value ?? '';\n this.syncFormState();\n }\n\n disconnectedCallback() {\n this.stopObserving?.();\n }\n\n @Watch('value')\n @Watch('error')\n @Watch('required')\n syncFormState() {\n this.internals.setFormValue(this.value || null);\n applyControlValidity(this.internals, Boolean(this.value), this.required, this.error);\n }\n\n /** The one place an open or close is announced, whatever caused it. */\n @Watch('open')\n syncOpen(next: boolean, previous: boolean) {\n if (next) this.showPanel();\n else this.hidePanel();\n if (next !== previous) this.pfOpenChange.emit({ open: next });\n }\n\n /** Opens the calendar. */\n @Method()\n async show(): Promise<void> {\n if (!this.disabled) this.open = true;\n }\n\n /** Closes the calendar. */\n @Method()\n async hide(): Promise<void> {\n this.open = false;\n }\n\n @Method()\n async checkValidity(): Promise<boolean> {\n return this.internals.checkValidity();\n }\n\n @Method()\n async reportValidity(): Promise<boolean> {\n return this.internals.reportValidity();\n }\n\n @Method()\n async getValidationMessage(): Promise<string> {\n return this.internals.validationMessage;\n }\n\n /** A reset restores the value the field started with, not an empty one. */\n formResetCallback() {\n this.value = this.initialValue;\n }\n\n private get panel() {\n return this.el.shadowRoot?.querySelector<HTMLElement>('[part=\"panel\"]') ?? null;\n }\n\n private get trigger() {\n return this.el.shadowRoot?.querySelector<HTMLButtonElement>('[part=\"trigger\"]') ?? null;\n }\n\n private get calendar() {\n return (\n this.el.shadowRoot?.querySelector<HTMLElement & { focusSelectedDay(): Promise<void> }>(\n 'pf-calendar',\n ) ?? null\n );\n }\n\n private showPanel() {\n const panel = this.panel;\n if (this.disabled || !panel || panel.matches(':popover-open')) return;\n\n panel.showPopover();\n this.stopObserving?.();\n this.stopObserving = observeAnchoredPosition({\n getAnchor: () => this.trigger,\n getFloating: () => panel,\n align: 'start',\n matchAnchorWidth: false,\n flip: true,\n onChange: ({ left, top }) => placePopover(panel, left, top),\n });\n\n // Focus the grid, not the panel: the calendar owns its own tab stop, and\n // it asks for focus through a method rather than having it reached for.\n void this.calendar?.focusSelectedDay();\n }\n\n private hidePanel() {\n this.stopObserving?.();\n this.stopObserving = undefined;\n const panel = this.panel;\n if (panel?.matches(':popover-open')) panel.hidePopover();\n }\n\n /**\n * Mirrors a browser-driven close — a light dismiss or Escape — back into\n * `open`, which is what then announces it.\n */\n private onToggle = (event: ToggleEvent) => {\n const nowOpen = event.newState === 'open';\n if (this.open !== nowOpen) this.open = nowOpen;\n if (!nowOpen) this.trigger?.focus();\n };\n\n /**\n * Listens on the calendar element itself, not on the host.\n *\n * Both were tried. A `@Listen('pfChange')` on the host sees the calendar's\n * event *and* this element's own — a Stencil event is composed, so by then\n * both have been retargeted to the host and `event.target` cannot tell them\n * apart. Worse, `stopPropagation()` there does not help: the consumer's\n * listener is on that same node, and stopping propagation never stops\n * same-node listeners, so every pick reported twice. Caught by a test that\n * counted them.\n *\n * On the calendar, the event is stopped before it reaches the host at all,\n * which does not depend on listener registration order the way\n * `stopImmediatePropagation` would.\n */\n private bindCalendar = (element?: HTMLElement) => {\n if (!element || element === this.boundCalendar) return;\n this.boundCalendar = element;\n element.addEventListener('pfChange', this.onCalendarChange as EventListener);\n };\n\n private boundCalendar?: HTMLElement;\n\n private onCalendarChange = (event: CustomEvent<{ value: string }>) => {\n event.stopPropagation();\n\n this.value = event.detail.value;\n this.pfChange.emit({ value: this.value });\n this.open = false;\n this.trigger?.focus();\n };\n\n private clear = (event: MouseEvent) => {\n event.stopPropagation();\n if (!this.value) return;\n this.value = '';\n this.pfChange.emit({ value: '' });\n };\n\n /**\n * Down opens the calendar from a closed trigger, as a popup button should.\n * Escape is the browser's while the panel is open — `popover=\"auto\"` handles\n * it — so there is nothing to do here for it.\n */\n private onTriggerKeyDown = (event: KeyboardEvent) => {\n if (this.open || this.disabled) return;\n if (event.key === Keys.ArrowDown || event.key === Keys.Enter || event.key === Keys.Space) {\n if (event.key === Keys.ArrowDown) {\n event.preventDefault();\n this.open = true;\n }\n }\n };\n\n /** `MMM D, YYYY`, matching the React component's trigger text. */\n private formatted(): string {\n const date = parseISODate(this.value);\n if (!date) return '';\n return new Intl.DateTimeFormat('en-US', {\n month: 'short',\n day: 'numeric',\n year: 'numeric',\n }).format(date);\n }\n\n render() {\n const describedBy = composeDescribedBy(\n this.description && 'description',\n this.error && 'error',\n );\n const text = this.formatted();\n\n return (\n <Host>\n <div class=\"field\" part=\"field\">\n {this.label && (\n <label class=\"label\" part=\"label\" htmlFor=\"trigger\">\n {this.label}\n {this.required && (\n <span class=\"required\" aria-hidden=\"true\">\n *\n </span>\n )}\n </label>\n )}\n\n <div class=\"row\">\n <button\n id=\"trigger\"\n part=\"trigger\"\n class={{ trigger: true, 'trigger--invalid': Boolean(this.error) }}\n type=\"button\"\n disabled={this.disabled}\n aria-haspopup=\"dialog\"\n aria-expanded={this.open ? 'true' : 'false'}\n /* Same shadow root as the panel, so this IDREF resolves. */\n aria-controls=\"panel\"\n aria-invalid={this.error ? 'true' : null}\n aria-required={this.required ? 'true' : null}\n aria-describedby={describedBy}\n onClick={() => {\n if (!this.disabled) this.open = !this.open;\n }}\n onKeyDown={this.onTriggerKeyDown}\n >\n <span class={{ value: true, 'value--placeholder': !text }}>\n {text || this.placeholder}\n </span>\n <pf-icon name=\"calendar\"></pf-icon>\n </button>\n\n {this.allowClear && this.value && (\n <button\n class=\"clear\"\n part=\"clear\"\n type=\"button\"\n aria-label=\"Clear selected date\"\n disabled={this.disabled}\n onClick={this.clear}\n >\n <pf-icon name=\"circle-xmark\"></pf-icon>\n </button>\n )}\n </div>\n\n {this.description && (\n <p class=\"description\" part=\"description\" id=\"description\">\n {this.description}\n </p>\n )}\n {this.error && (\n <p class=\"error\" part=\"error\" id=\"error\">\n {this.error}\n </p>\n )}\n </div>\n\n <div\n id=\"panel\"\n part=\"panel\"\n class=\"panel\"\n popover=\"auto\"\n role=\"dialog\"\n aria-label=\"Choose a date\"\n onToggle={this.onToggle}\n >\n <pf-calendar\n ref={this.bindCalendar}\n part=\"calendar\"\n value={this.value || undefined}\n min={this.min}\n max={this.max}\n startYear={this.startYear}\n endYear={this.endYear}\n showOutsideDays={this.showOutsideDays}\n isDateDisabled={this.isDateDisabled}\n ></pf-calendar>\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"pf-date-picker.js","sourceRoot":"","sources":["../../../src/components/pf-date-picker/pf-date-picker.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n composeDescribedBy,\n Keys,\n observeAnchoredPosition,\n parseISODate,\n} from '@pitchfork-ui/core';\n\nimport { applyControlValidity } from '../../form-validity';\nimport { controlAriaLabel } from '../../control-label';\nimport { placePopover } from '../../place-popover';\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\n\n/**\n * A form-associated date field: a trigger that opens `pf-calendar` in a\n * popover.\n *\n * Form-associated, which the React `DatePicker` is not — it is a button and a\n * portal, so its value reaches a surrounding `<form>` only if the consumer\n * wires it there themselves. Here the value is submitted as `YYYY-MM-DD`,\n * constraint validation works, and Angular's generated accessor has something\n * to bind to.\n *\n * The panel is a `popover`, so light dismiss and Escape are the browser's.\n * Unlike `pf-dropdown`, the trigger and the panel are both in *this* shadow\n * root, so `aria-controls` resolves and is worth setting — a same-root IDREF\n * is the one case that works, measured.\n *\n * @part field - the wrapper around label, control and messages.\n * @part label - the label element.\n * @part trigger - the button that opens the calendar.\n * @part clear - the clear button.\n * @part panel - the floating panel holding the calendar.\n * @part calendar - the calendar itself.\n * @part description - the hint text below the control.\n * @part error - the error message below the control.\n */\n@Component({\n tag: 'pf-date-picker',\n styleUrl: 'pf-date-picker.css',\n formAssociated: true,\n shadow: true,\n})\nexport class PfDatePicker {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /**\n * Submitted under this name. Reflected, because the submission name comes\n * from the content attribute and the generated bindings set properties.\n */\n @Prop({ reflect: true }) name?: string;\n\n /** The selected date as `YYYY-MM-DD`, or empty. */\n @Prop({ mutable: true }) value = '';\n\n /** Whether the calendar is showing. Reflected for the stylesheet. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n /** Visible label. In the same root as the trigger, so `for` works. */\n @Prop() label?: string;\n\n /** Hint text below the control. */\n @Prop() description?: string;\n\n /** Error message. Its presence is what marks the control invalid. */\n @Prop() error?: string;\n\n @Prop() placeholder = 'Select a date';\n\n @Prop({ reflect: true }) required = false;\n\n @Prop({ reflect: true }) disabled = false;\n\n /** Offer a button that empties the field. */\n @Prop() allowClear = false;\n\n /** Earliest selectable date, as `YYYY-MM-DD`. */\n @Prop() min?: string;\n\n /** Latest selectable date, as `YYYY-MM-DD`. */\n @Prop() max?: string;\n\n @Prop() startYear?: number;\n\n @Prop() endYear?: number;\n\n @Prop() showOutsideDays = true;\n\n /** A predicate for days that cannot be chosen; see `pf-calendar`. */\n @Prop() isDateDisabled?: (date: Date) => boolean;\n\n /** Fires when a date is chosen or cleared. */\n @Event() pfChange!: EventEmitter<{ value: string }>;\n\n /** Fires whenever the calendar opens or closes, whoever caused it. */\n @Event() pfOpenChange!: EventEmitter<{ open: boolean }>;\n\n /** What a form reset restores; `value` has been overwritten by then. */\n private initialValue = '';\n\n private stopObserving?: () => void;\n\n componentWillLoad() {\n this.initialValue = this.value ?? '';\n this.syncFormState();\n }\n\n disconnectedCallback() {\n this.stopObserving?.();\n }\n\n @Watch('value')\n @Watch('error')\n @Watch('required')\n syncFormState() {\n this.internals.setFormValue(this.value || null);\n applyControlValidity(this.internals, Boolean(this.value), this.required, this.error);\n }\n\n /** The one place an open or close is announced, whatever caused it. */\n @Watch('open')\n syncOpen(next: boolean, previous: boolean) {\n if (next) this.showPanel();\n else this.hidePanel();\n if (next !== previous) this.pfOpenChange.emit({ open: next });\n }\n\n /** Opens the calendar. */\n @Method()\n async show(): Promise<void> {\n if (!this.disabled) this.open = true;\n }\n\n /** Closes the calendar. */\n @Method()\n async hide(): Promise<void> {\n this.open = false;\n }\n\n @Method()\n async checkValidity(): Promise<boolean> {\n return this.internals.checkValidity();\n }\n\n @Method()\n async reportValidity(): Promise<boolean> {\n return this.internals.reportValidity();\n }\n\n @Method()\n async getValidationMessage(): Promise<string> {\n return this.internals.validationMessage;\n }\n\n /** A reset restores the value the field started with, not an empty one. */\n formResetCallback() {\n this.value = this.initialValue;\n }\n\n private get panel() {\n return this.el.shadowRoot?.querySelector<HTMLElement>('[part=\"panel\"]') ?? null;\n }\n\n private get trigger() {\n return this.el.shadowRoot?.querySelector<HTMLButtonElement>('[part=\"trigger\"]') ?? null;\n }\n\n private get calendar() {\n return (\n this.el.shadowRoot?.querySelector<HTMLElement & { focusSelectedDay(): Promise<void> }>(\n 'pf-calendar',\n ) ?? null\n );\n }\n\n private showPanel() {\n const panel = this.panel;\n if (this.disabled || !panel || panel.matches(':popover-open')) return;\n\n panel.showPopover();\n this.stopObserving?.();\n this.stopObserving = observeAnchoredPosition({\n getAnchor: () => this.trigger,\n getFloating: () => panel,\n align: 'start',\n matchAnchorWidth: false,\n flip: true,\n onChange: ({ left, top }) => placePopover(panel, left, top),\n });\n\n // Focus the grid, not the panel: the calendar owns its own tab stop, and\n // it asks for focus through a method rather than having it reached for.\n void this.calendar?.focusSelectedDay();\n }\n\n private hidePanel() {\n this.stopObserving?.();\n this.stopObserving = undefined;\n const panel = this.panel;\n if (panel?.matches(':popover-open')) panel.hidePopover();\n }\n\n /**\n * Mirrors a browser-driven close — a light dismiss or Escape — back into\n * `open`, which is what then announces it.\n */\n private onToggle = (event: ToggleEvent) => {\n const nowOpen = event.newState === 'open';\n if (this.open !== nowOpen) this.open = nowOpen;\n if (!nowOpen) this.trigger?.focus();\n };\n\n /**\n * Listens on the calendar element itself, not on the host.\n *\n * Both were tried. A `@Listen('pfChange')` on the host sees the calendar's\n * event *and* this element's own — a Stencil event is composed, so by then\n * both have been retargeted to the host and `event.target` cannot tell them\n * apart. Worse, `stopPropagation()` there does not help: the consumer's\n * listener is on that same node, and stopping propagation never stops\n * same-node listeners, so every pick reported twice. Caught by a test that\n * counted them.\n *\n * On the calendar, the event is stopped before it reaches the host at all,\n * which does not depend on listener registration order the way\n * `stopImmediatePropagation` would.\n */\n private bindCalendar = (element?: HTMLElement) => {\n if (!element || element === this.boundCalendar) return;\n this.boundCalendar = element;\n element.addEventListener('pfChange', this.onCalendarChange as EventListener);\n };\n\n private boundCalendar?: HTMLElement;\n\n private onCalendarChange = (event: CustomEvent<{ value: string }>) => {\n event.stopPropagation();\n\n this.value = event.detail.value;\n this.pfChange.emit({ value: this.value });\n this.open = false;\n this.trigger?.focus();\n };\n\n private clear = (event: MouseEvent) => {\n event.stopPropagation();\n if (!this.value) return;\n this.value = '';\n this.pfChange.emit({ value: '' });\n };\n\n /**\n * Down opens the calendar from a closed trigger, as a popup button should.\n * Escape is the browser's while the panel is open — `popover=\"auto\"` handles\n * it — so there is nothing to do here for it.\n */\n private onTriggerKeyDown = (event: KeyboardEvent) => {\n if (this.open || this.disabled) return;\n if (event.key === Keys.ArrowDown || event.key === Keys.Enter || event.key === Keys.Space) {\n if (event.key === Keys.ArrowDown) {\n event.preventDefault();\n this.open = true;\n }\n }\n };\n\n /** `MMM D, YYYY`, matching the React component's trigger text. */\n private formatted(): string {\n const date = parseISODate(this.value);\n if (!date) return '';\n return new Intl.DateTimeFormat('en-US', {\n month: 'short',\n day: 'numeric',\n year: 'numeric',\n }).format(date);\n }\n\n render() {\n const describedBy = composeDescribedBy(\n this.description && 'description',\n this.error && 'error',\n );\n const text = this.formatted();\n\n return (\n <Host>\n <div class=\"field\" part=\"field\">\n {this.label && (\n <label class=\"label\" part=\"label\" htmlFor=\"trigger\">\n {this.label}\n {this.required && (\n <span class=\"required\" aria-hidden=\"true\">\n *\n </span>\n )}\n </label>\n )}\n\n <div class=\"row\">\n <button\n id=\"trigger\"\n aria-label={controlAriaLabel(this.el, this.label)}\n part=\"trigger\"\n class={{ trigger: true, 'trigger--invalid': Boolean(this.error) }}\n type=\"button\"\n disabled={this.disabled}\n aria-haspopup=\"dialog\"\n aria-expanded={this.open ? 'true' : 'false'}\n /* Same shadow root as the panel, so this IDREF resolves. */\n aria-controls=\"panel\"\n aria-invalid={this.error ? 'true' : null}\n aria-required={this.required ? 'true' : null}\n aria-describedby={describedBy}\n onClick={() => {\n if (!this.disabled) this.open = !this.open;\n }}\n onKeyDown={this.onTriggerKeyDown}\n >\n <span class={{ value: true, 'value--placeholder': !text }}>\n {text || this.placeholder}\n </span>\n <pf-icon name=\"calendar\"></pf-icon>\n </button>\n\n {this.allowClear && this.value && (\n <button\n class=\"clear\"\n part=\"clear\"\n type=\"button\"\n aria-label=\"Clear selected date\"\n disabled={this.disabled}\n onClick={this.clear}\n >\n <pf-icon name=\"circle-xmark\"></pf-icon>\n </button>\n )}\n </div>\n\n {this.description && (\n <p class=\"description\" part=\"description\" id=\"description\">\n {this.description}\n </p>\n )}\n {this.error && (\n <p class=\"error\" part=\"error\" id=\"error\">\n {this.error}\n </p>\n )}\n </div>\n\n <div\n id=\"panel\"\n part=\"panel\"\n class=\"panel\"\n popover=\"auto\"\n role=\"dialog\"\n aria-label=\"Choose a date\"\n onToggle={this.onToggle}\n >\n <pf-calendar\n ref={this.bindCalendar}\n part=\"calendar\"\n value={this.value || undefined}\n min={this.min}\n max={this.max}\n startYear={this.startYear}\n endYear={this.endYear}\n showOutsideDays={this.showOutsideDays}\n isDateDisabled={this.isDateDisabled}\n ></pf-calendar>\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { addMonths, buildCalendarDays, CALENDAR_CELL_COUNT, clampMonthToYearRange, composeDescribedBy, formatDateRange, formatISODate, isOutsideDateRange, isSameDay, isSameMonth, Keys, moveCalendarDate, nextDateRangeSelection, observeAnchoredPosition, parseDateRange, parseISODate, rangeDayState, startOfMonth, toMidday, WEEKDAY_LABELS, } from "@pitchfork-ui/core";
|
|
2
2
|
import { applyControlValidity } from "../../form-validity";
|
|
3
|
+
import { controlAriaLabel } from "../../control-label";
|
|
3
4
|
import { placePopover } from "../../place-popover";
|
|
4
5
|
import { h, Host, } from "@stencil/core";
|
|
5
6
|
const MOVES = {
|
|
@@ -354,16 +355,16 @@ export class PfDateRangePicker {
|
|
|
354
355
|
const describedBy = composeDescribedBy(this.description && 'description', this.error && 'error');
|
|
355
356
|
const text = this.formatted();
|
|
356
357
|
const right = addMonths(this.leftMonth, 1);
|
|
357
|
-
return (h(Host, { key: '
|
|
358
|
+
return (h(Host, { key: 'e581ed7c3a2449e96b594a4d650d7d16225c502b' }, h("div", { key: '42af6feb4a669c989f734bf179e0f60c24a47401', class: "field", part: "field" }, this.label && (h("label", { key: '5a6b9ea4e2bcdb7c07801c474a901ae4019d397f', class: "label", part: "label", htmlFor: "trigger" }, this.label, this.required && (h("span", { key: '6e90bc09ed442464ea424d47e60a64951df45eea', class: "required", "aria-hidden": "true" }, "*")))), h("div", { key: 'b0b66d4bf30cc7228e7e2153e9be05d71401ec20', class: "row-controls" }, h("button", { key: '46cfbfeb5e679bb00dd48e7b718350db4530e82e', id: "trigger", "aria-label": controlAriaLabel(this.el, this.label), part: "trigger", class: { trigger: true, 'trigger--invalid': Boolean(this.error) }, type: "button", disabled: this.disabled, "aria-haspopup": "dialog", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": "panel", "aria-invalid": this.error ? 'true' : null, "aria-required": this.required ? 'true' : null, "aria-describedby": describedBy, onClick: () => {
|
|
358
359
|
if (!this.disabled)
|
|
359
360
|
this.open = !this.open;
|
|
360
|
-
} }, h("span", { key: '
|
|
361
|
+
} }, h("span", { key: '4bcf49fdfed1cef4f458c5019315ea833d8575e0', class: { value: true, 'value--placeholder': !text } }, text || this.placeholder), h("pf-icon", { key: 'da03fb4ccb5aef720f042adae79d701148ade479', name: "calendar" })), this.allowClear && (this.value || this.pendingStart) && (h("button", { key: 'f6b36144e765a28a15e7addf3d10d4aff1d25a00', class: "clear", part: "clear", type: "button", "aria-label": "Clear selected dates", disabled: this.disabled, onClick: this.clear }, h("pf-icon", { key: 'f4fb9769008137437b26c14c54d4d73909729da9', name: "circle-xmark" })))), this.description && (h("p", { key: '084a2a397d5277d237310cd9c202dce0028fcf78', class: "description", part: "description", id: "description" }, this.description)), this.error && (h("p", { key: '9fa6a9400ded59e6c0263012ce4d4be1d04c9352', class: "error", part: "error", id: "error" }, this.error))), h("div", { key: 'f8b15d11302ae13a7d9d21fea5ce5db3d0c407cc', id: "panel", part: "panel", class: "panel", popover: "auto", role: "dialog", "aria-label": "Choose a date range", onToggle: this.onToggle, onKeyDown: this.onKeyDown, onMouseLeave: () => {
|
|
361
362
|
this.hovered = null;
|
|
362
|
-
} }, h("div", { key: '
|
|
363
|
+
} }, h("div", { key: '39a29079e9e97d19272ef9d5ec9fa02c2c368f6a', class: "nav" }, h("button", { key: '8e0fb9c8e800e53a88dfa98c928966a919f4dee0', type: "button", class: "step", "aria-label": "Previous month", onClick: () => {
|
|
363
364
|
this.leftMonth = this.clamp(addMonths(this.leftMonth, -1));
|
|
364
|
-
} }, h("pf-icon", { key: '
|
|
365
|
+
} }, h("pf-icon", { key: 'df4f5aa6dfc5b387a9d73c674f25e5f445ad4778', name: "square-caret-left" })), h("button", { key: 'c48a949065acfb0e16fce8b732399f6fa9d8204c', type: "button", class: "step", "aria-label": "Next month", onClick: () => {
|
|
365
366
|
this.leftMonth = this.clamp(addMonths(this.leftMonth, 1));
|
|
366
|
-
} }, h("pf-icon", { key: '
|
|
367
|
+
} }, h("pf-icon", { key: '10ae6ca6d30cbfdbd538d1a5247a6c83b299fd7a', name: "square-caret-right" }))), h("div", { key: '46610cb99d27eda167a28c281a5c1462fd5ab19c', class: "months" }, this.renderGrid(this.leftMonth), this.renderGrid(right)))));
|
|
367
368
|
}
|
|
368
369
|
static get is() { return "pf-date-range-picker"; }
|
|
369
370
|
static get encapsulation() { return "shadow"; }
|