@primer/view-components 0.35.0-rc.300b5a03 → 0.35.0-rc.5665bbca

Sign up to get free protection for your applications and to get access to all the features.
Files changed (65) hide show
  1. package/app/assets/javascripts/{app/components → components}/primer/primer.d.ts +3 -3
  2. package/app/assets/javascripts/primer_view_components.js +1 -1
  3. package/app/assets/javascripts/primer_view_components.js.map +1 -1
  4. package/app/assets/styles/primer_view_components.css +1 -1
  5. package/app/assets/styles/primer_view_components.css.map +1 -1
  6. package/app/components/primer/alpha/select_panel_element.js +7 -1
  7. package/app/components/primer/alpha/text_field.css +1 -1
  8. package/app/components/primer/primer.js +3 -3
  9. package/package.json +2 -2
  10. package/static/arguments.json +20 -2
  11. package/static/constants.json +5 -0
  12. package/static/info_arch.json +57 -3
  13. package/static/previews.json +26 -0
  14. package/app/components/primer/alpha/action_bar_element.d.ts +0 -17
  15. package/app/components/primer/alpha/action_list.d.ts +0 -16
  16. package/app/components/primer/alpha/action_menu/action_menu_element.d.ts +0 -42
  17. package/app/components/primer/alpha/dropdown/menu.d.ts +0 -1
  18. package/app/components/primer/alpha/dropdown.d.ts +0 -1
  19. package/app/components/primer/alpha/image_crop.d.ts +0 -1
  20. package/app/components/primer/alpha/modal_dialog.d.ts +0 -18
  21. package/app/components/primer/alpha/segmented_control.d.ts +0 -12
  22. package/app/components/primer/alpha/select_panel_element.d.ts +0 -63
  23. package/app/components/primer/alpha/tab_container.d.ts +0 -1
  24. package/app/components/primer/alpha/toggle_switch.d.ts +0 -34
  25. package/app/components/primer/alpha/tool_tip.d.ts +0 -27
  26. package/app/components/primer/alpha/x_banner.d.ts +0 -18
  27. package/app/components/primer/anchored_position.d.ts +0 -27
  28. package/app/components/primer/aria_live.d.ts +0 -8
  29. package/app/components/primer/beta/auto_complete/auto_complete.d.ts +0 -1
  30. package/app/components/primer/beta/clipboard_copy.d.ts +0 -1
  31. package/app/components/primer/beta/nav_list.d.ts +0 -20
  32. package/app/components/primer/beta/nav_list_group_element.d.ts +0 -19
  33. package/app/components/primer/beta/relative_time.d.ts +0 -1
  34. package/app/components/primer/dialog_helper.d.ts +0 -15
  35. package/app/components/primer/focus_group.d.ts +0 -19
  36. package/app/components/primer/primer.d.ts +0 -28
  37. package/app/components/primer/scrollable_region.d.ts +0 -13
  38. package/app/components/primer/shared_events.d.ts +0 -11
  39. package/lib/primer/forms/primer_multi_input.js +0 -44
  40. package/lib/primer/forms/primer_text_field.js +0 -119
  41. package/lib/primer/forms/toggle_switch_input.js +0 -34
  42. /package/app/assets/javascripts/{app/components → components}/primer/alpha/action_bar_element.d.ts +0 -0
  43. /package/app/assets/javascripts/{app/components → components}/primer/alpha/action_list.d.ts +0 -0
  44. /package/app/assets/javascripts/{app/components → components}/primer/alpha/action_menu/action_menu_element.d.ts +0 -0
  45. /package/app/assets/javascripts/{app/components → components}/primer/alpha/dropdown/menu.d.ts +0 -0
  46. /package/app/assets/javascripts/{app/components → components}/primer/alpha/dropdown.d.ts +0 -0
  47. /package/app/assets/javascripts/{app/components → components}/primer/alpha/image_crop.d.ts +0 -0
  48. /package/app/assets/javascripts/{app/components → components}/primer/alpha/modal_dialog.d.ts +0 -0
  49. /package/app/assets/javascripts/{app/components → components}/primer/alpha/segmented_control.d.ts +0 -0
  50. /package/app/assets/javascripts/{app/components → components}/primer/alpha/select_panel_element.d.ts +0 -0
  51. /package/app/assets/javascripts/{app/components → components}/primer/alpha/tab_container.d.ts +0 -0
  52. /package/app/assets/javascripts/{app/components → components}/primer/alpha/toggle_switch.d.ts +0 -0
  53. /package/app/assets/javascripts/{app/components → components}/primer/alpha/tool_tip.d.ts +0 -0
  54. /package/app/assets/javascripts/{app/components → components}/primer/alpha/x_banner.d.ts +0 -0
  55. /package/app/assets/javascripts/{app/components → components}/primer/anchored_position.d.ts +0 -0
  56. /package/app/assets/javascripts/{app/components → components}/primer/aria_live.d.ts +0 -0
  57. /package/app/assets/javascripts/{app/components → components}/primer/beta/auto_complete/auto_complete.d.ts +0 -0
  58. /package/app/assets/javascripts/{app/components → components}/primer/beta/clipboard_copy.d.ts +0 -0
  59. /package/app/assets/javascripts/{app/components → components}/primer/beta/nav_list.d.ts +0 -0
  60. /package/app/assets/javascripts/{app/components → components}/primer/beta/nav_list_group_element.d.ts +0 -0
  61. /package/app/assets/javascripts/{app/components → components}/primer/beta/relative_time.d.ts +0 -0
  62. /package/app/assets/javascripts/{app/components → components}/primer/dialog_helper.d.ts +0 -0
  63. /package/app/assets/javascripts/{app/components → components}/primer/focus_group.d.ts +0 -0
  64. /package/app/assets/javascripts/{app/components → components}/primer/scrollable_region.d.ts +0 -0
  65. /package/app/assets/javascripts/{app/components → components}/primer/shared_events.d.ts +0 -0
@@ -1,18 +0,0 @@
1
- declare global {
2
- interface HTMLElementEventMap {
3
- 'banner:dismiss': CustomEvent<void>;
4
- }
5
- }
6
- declare class XBannerElement extends HTMLElement {
7
- #private;
8
- titleText: HTMLElement;
9
- dismiss(): void;
10
- show(): void;
11
- hide(): void;
12
- }
13
- declare global {
14
- interface Window {
15
- XBannerElement: typeof XBannerElement;
16
- }
17
- }
18
- export {};
@@ -1,27 +0,0 @@
1
- import type { AnchorAlignment, AnchorSide, PositionSettings } from '@primer/behaviors';
2
- export default class AnchoredPositionElement extends HTMLElement implements PositionSettings {
3
- #private;
4
- get align(): AnchorAlignment;
5
- set align(value: AnchorAlignment);
6
- get side(): AnchorSide;
7
- set side(value: AnchorSide);
8
- get anchorOffset(): number;
9
- set anchorOffset(value: number | 'normal' | 'spacious');
10
- get anchor(): string;
11
- set anchor(value: string);
12
- get anchorElement(): HTMLElement | null;
13
- set anchorElement(value: HTMLElement | null);
14
- get alignmentOffset(): number;
15
- set alignmentOffset(value: number);
16
- get allowOutOfBounds(): boolean;
17
- set allowOutOfBounds(value: boolean);
18
- connectedCallback(): void;
19
- static observedAttributes: string[];
20
- attributeChangedCallback(): void;
21
- update(): void;
22
- }
23
- declare global {
24
- interface Window {
25
- AnchoredPositionElement: typeof AnchoredPositionElement;
26
- }
27
- }
@@ -1,8 +0,0 @@
1
- export declare function announceFromElement(el: HTMLElement, options?: {
2
- assertive?: boolean;
3
- element?: HTMLElement;
4
- }): void;
5
- export declare function announce(message: string, options?: {
6
- assertive?: boolean;
7
- element?: HTMLElement;
8
- }): void;
@@ -1 +0,0 @@
1
- import '@github/auto-complete-element';
@@ -1 +0,0 @@
1
- import '@github/clipboard-copy-element';
@@ -1,20 +0,0 @@
1
- export declare class NavListElement extends HTMLElement {
2
- #private;
3
- items: HTMLElement[];
4
- topLevelList: HTMLElement;
5
- connectedCallback(): void;
6
- disconnectedCallback(): void;
7
- selectItemById(itemId: string | null): boolean;
8
- selectItemByHref(href: string | null): boolean;
9
- selectItemByCurrentLocation(): boolean;
10
- expandItem(item: HTMLElement): void;
11
- collapseItem(item: HTMLElement): void;
12
- itemIsExpanded(item: HTMLElement | null): boolean;
13
- handleItemWithSubItemClick(e: Event): void;
14
- handleItemWithSubItemKeydown(e: KeyboardEvent): void;
15
- }
16
- declare global {
17
- interface Window {
18
- NavListElement: typeof NavListElement;
19
- }
20
- }
@@ -1,19 +0,0 @@
1
- export declare class NavListGroupElement extends HTMLElement {
2
- #private;
3
- showMoreItem: HTMLElement;
4
- focusMarkers: HTMLElement[];
5
- connectedCallback(): void;
6
- get showMoreDisabled(): boolean;
7
- set showMoreDisabled(value: boolean);
8
- set currentPage(value: number);
9
- get currentPage(): number;
10
- get totalPages(): number;
11
- get paginationSrc(): string;
12
- private showMore;
13
- private setShowMoreItemState;
14
- }
15
- declare global {
16
- interface Window {
17
- NavListGroupElement: typeof NavListGroupElement;
18
- }
19
- }
@@ -1 +0,0 @@
1
- import '@github/relative-time-element';
@@ -1,15 +0,0 @@
1
- export declare class DialogHelperElement extends HTMLElement {
2
- #private;
3
- get dialog(): HTMLDialogElement | null;
4
- connectedCallback(): void;
5
- disconnectedCallback(): void;
6
- handleEvent(event: MouseEvent): void;
7
- }
8
- declare global {
9
- interface Window {
10
- DialogHelperElement: typeof DialogHelperElement;
11
- }
12
- interface HTMLElementTagNameMap {
13
- 'dialog-helper': DialogHelperElement;
14
- }
15
- }
@@ -1,19 +0,0 @@
1
- import '@oddbird/popover-polyfill';
2
- export default class FocusGroupElement extends HTMLElement {
3
- #private;
4
- get nowrap(): boolean;
5
- set nowrap(value: boolean);
6
- get direction(): 'horizontal' | 'vertical' | 'both';
7
- set direction(value: 'horizontal' | 'vertical' | 'both');
8
- get retain(): boolean;
9
- set retain(value: boolean);
10
- get mnemonics(): boolean;
11
- connectedCallback(): void;
12
- disconnectedCallback(): void;
13
- handleEvent(event: Event): void;
14
- }
15
- declare global {
16
- interface Window {
17
- FocusGroupElement: typeof FocusGroupElement;
18
- }
19
- }
@@ -1,28 +0,0 @@
1
- import '@github/include-fragment-element';
2
- import '@github/remote-input-element';
3
- import './alpha/action_list';
4
- import './alpha/action_bar_element';
5
- import './alpha/dropdown';
6
- import './anchored_position';
7
- import './dialog_helper';
8
- import './focus_group';
9
- import './scrollable_region';
10
- import './aria_live';
11
- import './shared_events';
12
- import './alpha/image_crop';
13
- import './alpha/modal_dialog';
14
- import './beta/nav_list';
15
- import './beta/nav_list_group_element';
16
- import './alpha/segmented_control';
17
- import './alpha/toggle_switch';
18
- import './alpha/tool_tip';
19
- import './alpha/x_banner';
20
- import './beta/auto_complete/auto_complete';
21
- import './beta/clipboard_copy';
22
- import './beta/relative_time';
23
- import './alpha/tab_container';
24
- import '../../../lib/primer/forms/primer_multi_input';
25
- import '../../../lib/primer/forms/primer_text_field';
26
- import '../../../lib/primer/forms/toggle_switch_input';
27
- import './alpha/action_menu/action_menu_element';
28
- import './alpha/select_panel_element';
@@ -1,13 +0,0 @@
1
- export declare class ScrollableRegionElement extends HTMLElement {
2
- hasOverflow: boolean;
3
- labelledBy: string;
4
- observer: ResizeObserver;
5
- connectedCallback(): void;
6
- disconnectedCallback(): void;
7
- attributeChangedCallback(name: string): void;
8
- }
9
- declare global {
10
- interface Window {
11
- ScrollableRegionElement: typeof ScrollableRegionElement;
12
- }
13
- }
@@ -1,11 +0,0 @@
1
- export type ItemActivatedEvent = {
2
- item: Element;
3
- checked: boolean;
4
- value: string | null;
5
- };
6
- declare global {
7
- interface HTMLElementEventMap {
8
- itemActivated: CustomEvent<ItemActivatedEvent>;
9
- beforeItemActivated: CustomEvent<ItemActivatedEvent>;
10
- }
11
- }
@@ -1,44 +0,0 @@
1
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
- return c > 3 && r && Object.defineProperty(target, key, r), r;
6
- };
7
- /* eslint-disable custom-elements/expose-class-on-global */
8
- import { controller, targets } from '@github/catalyst';
9
- let PrimerMultiInputElement = class PrimerMultiInputElement extends HTMLElement {
10
- activateField(name) {
11
- const fieldWithName = this.findField(name);
12
- if (!fieldWithName)
13
- return;
14
- for (const field of this.fields) {
15
- if (field === fieldWithName)
16
- continue;
17
- field.setAttribute('disabled', 'disabled');
18
- field.setAttribute('hidden', 'hidden');
19
- field.parentElement?.setAttribute('hidden', 'hidden');
20
- }
21
- fieldWithName.removeAttribute('disabled');
22
- fieldWithName.removeAttribute('hidden');
23
- fieldWithName.parentElement?.removeAttribute('hidden');
24
- }
25
- findField(name) {
26
- for (const field of this.fields) {
27
- if (field.getAttribute('data-name') === name) {
28
- return field;
29
- }
30
- }
31
- return null;
32
- }
33
- };
34
- __decorate([
35
- targets
36
- ], PrimerMultiInputElement.prototype, "fields", void 0);
37
- PrimerMultiInputElement = __decorate([
38
- controller
39
- ], PrimerMultiInputElement);
40
- export { PrimerMultiInputElement };
41
- if (!window.customElements.get('primer-multi-input')) {
42
- Object.assign(window, { PrimerMultiInputElement });
43
- window.customElements.define('primer-multi-input', PrimerMultiInputElement);
44
- }
@@ -1,119 +0,0 @@
1
- /* eslint-disable custom-elements/expose-class-on-global */
2
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
3
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
4
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
5
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
6
- return c > 3 && r && Object.defineProperty(target, key, r), r;
7
- };
8
- var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
9
- if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
10
- if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
11
- return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
12
- };
13
- var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
14
- if (kind === "m") throw new TypeError("Private method is not writable");
15
- if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
16
- if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
17
- return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
18
- };
19
- var _PrimerTextFieldElement_abortController;
20
- import '@github/auto-check-element';
21
- import { controller, target } from '@github/catalyst';
22
- let PrimerTextFieldElement = class PrimerTextFieldElement extends HTMLElement {
23
- constructor() {
24
- super(...arguments);
25
- _PrimerTextFieldElement_abortController.set(this, void 0);
26
- }
27
- connectedCallback() {
28
- __classPrivateFieldGet(this, _PrimerTextFieldElement_abortController, "f")?.abort();
29
- const { signal } = (__classPrivateFieldSet(this, _PrimerTextFieldElement_abortController, new AbortController(), "f"));
30
- this.addEventListener('auto-check-success', async (event) => {
31
- const message = await event.detail.response.text();
32
- if (message && message.length > 0) {
33
- this.setSuccess(message);
34
- }
35
- else {
36
- this.clearError();
37
- }
38
- }, { signal });
39
- this.addEventListener('auto-check-error', async (event) => {
40
- const errorMessage = await event.detail.response.text();
41
- this.setError(errorMessage);
42
- }, { signal });
43
- }
44
- disconnectedCallback() {
45
- __classPrivateFieldGet(this, _PrimerTextFieldElement_abortController, "f")?.abort();
46
- }
47
- clearContents() {
48
- this.inputElement.value = '';
49
- this.inputElement.focus();
50
- this.inputElement.dispatchEvent(new Event('input', { bubbles: true, cancelable: false }));
51
- }
52
- clearError() {
53
- this.inputElement.removeAttribute('invalid');
54
- this.validationElement.hidden = true;
55
- this.validationMessageElement.replaceChildren();
56
- }
57
- setValidationMessage(message) {
58
- const template = document.createElement('template');
59
- // eslint-disable-next-line github/no-inner-html
60
- template.innerHTML = message;
61
- const fragment = document.importNode(template.content, true);
62
- this.validationMessageElement.replaceChildren(fragment);
63
- }
64
- toggleValidationStyling(isError) {
65
- if (isError) {
66
- this.validationElement.classList.remove('FormControl-inlineValidation--success');
67
- }
68
- else {
69
- this.validationElement.classList.add('FormControl-inlineValidation--success');
70
- }
71
- this.validationSuccessIcon.hidden = isError;
72
- this.validationErrorIcon.hidden = !isError;
73
- this.inputElement.setAttribute('invalid', isError ? 'true' : 'false');
74
- }
75
- setSuccess(message) {
76
- this.toggleValidationStyling(false);
77
- this.setValidationMessage(message);
78
- this.validationElement.hidden = false;
79
- }
80
- setError(message) {
81
- this.toggleValidationStyling(true);
82
- this.setValidationMessage(message);
83
- this.validationElement.hidden = false;
84
- }
85
- showLeadingSpinner() {
86
- this.leadingSpinner?.removeAttribute('hidden');
87
- this.leadingVisual?.setAttribute('hidden', '');
88
- }
89
- hideLeadingSpinner() {
90
- this.leadingSpinner?.setAttribute('hidden', '');
91
- this.leadingVisual?.removeAttribute('hidden');
92
- }
93
- };
94
- _PrimerTextFieldElement_abortController = new WeakMap();
95
- __decorate([
96
- target
97
- ], PrimerTextFieldElement.prototype, "inputElement", void 0);
98
- __decorate([
99
- target
100
- ], PrimerTextFieldElement.prototype, "validationElement", void 0);
101
- __decorate([
102
- target
103
- ], PrimerTextFieldElement.prototype, "validationMessageElement", void 0);
104
- __decorate([
105
- target
106
- ], PrimerTextFieldElement.prototype, "validationSuccessIcon", void 0);
107
- __decorate([
108
- target
109
- ], PrimerTextFieldElement.prototype, "validationErrorIcon", void 0);
110
- __decorate([
111
- target
112
- ], PrimerTextFieldElement.prototype, "leadingVisual", void 0);
113
- __decorate([
114
- target
115
- ], PrimerTextFieldElement.prototype, "leadingSpinner", void 0);
116
- PrimerTextFieldElement = __decorate([
117
- controller
118
- ], PrimerTextFieldElement);
119
- export { PrimerTextFieldElement };
@@ -1,34 +0,0 @@
1
- /* eslint-disable custom-elements/expose-class-on-global */
2
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
3
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
4
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
5
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
6
- return c > 3 && r && Object.defineProperty(target, key, r), r;
7
- };
8
- import { controller, target } from '@github/catalyst';
9
- let ToggleSwitchInputElement = class ToggleSwitchInputElement extends HTMLElement {
10
- connectedCallback() {
11
- this.addEventListener('toggleSwitchError', (event) => {
12
- this.validationMessageElement.textContent = event.detail;
13
- this.validationElement.removeAttribute('hidden');
14
- });
15
- this.addEventListener('toggleSwitchSuccess', () => {
16
- this.validationMessageElement.textContent = '';
17
- this.validationElement.setAttribute('hidden', 'hidden');
18
- });
19
- this.addEventListener('toggleSwitchLoading', () => {
20
- this.validationMessageElement.textContent = '';
21
- this.validationElement.setAttribute('hidden', 'hidden');
22
- });
23
- }
24
- };
25
- __decorate([
26
- target
27
- ], ToggleSwitchInputElement.prototype, "validationElement", void 0);
28
- __decorate([
29
- target
30
- ], ToggleSwitchInputElement.prototype, "validationMessageElement", void 0);
31
- ToggleSwitchInputElement = __decorate([
32
- controller
33
- ], ToggleSwitchInputElement);
34
- export { ToggleSwitchInputElement };