@primer/view-components 0.43.6 → 0.44.0-rc.dd789cab

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.
Files changed (36) hide show
  1. package/app/assets/javascripts/components/primer/alpha/tree_view/tree_view.d.ts +39 -0
  2. package/app/assets/javascripts/components/primer/alpha/tree_view/tree_view_icon_pair_element.d.ts +15 -0
  3. package/app/assets/javascripts/components/primer/alpha/tree_view/tree_view_include_fragment_element.d.ts +9 -0
  4. package/app/assets/javascripts/components/primer/alpha/tree_view/tree_view_roving_tab_index.d.ts +3 -0
  5. package/app/assets/javascripts/components/primer/alpha/tree_view/tree_view_sub_tree_node_element.d.ts +42 -0
  6. package/app/assets/javascripts/components/primer/primer.d.ts +4 -0
  7. package/app/assets/javascripts/components/primer/shared_events.d.ts +15 -0
  8. package/app/assets/javascripts/primer_view_components.js +1 -1
  9. package/app/assets/javascripts/primer_view_components.js.map +1 -1
  10. package/app/assets/styles/primer_view_components.css +1 -1
  11. package/app/assets/styles/primer_view_components.css.map +1 -1
  12. package/app/components/primer/alpha/skeleton_box.css +1 -0
  13. package/app/components/primer/alpha/skeleton_box.css.json +6 -0
  14. package/app/components/primer/alpha/tree_view/tree_view.d.ts +39 -0
  15. package/app/components/primer/alpha/tree_view/tree_view.js +363 -0
  16. package/app/components/primer/alpha/tree_view/tree_view_icon_pair_element.d.ts +15 -0
  17. package/app/components/primer/alpha/tree_view/tree_view_icon_pair_element.js +62 -0
  18. package/app/components/primer/alpha/tree_view/tree_view_include_fragment_element.d.ts +9 -0
  19. package/app/components/primer/alpha/tree_view/tree_view_include_fragment_element.js +28 -0
  20. package/app/components/primer/alpha/tree_view/tree_view_roving_tab_index.d.ts +3 -0
  21. package/app/components/primer/alpha/tree_view/tree_view_roving_tab_index.js +130 -0
  22. package/app/components/primer/alpha/tree_view/tree_view_sub_tree_node_element.d.ts +42 -0
  23. package/app/components/primer/alpha/tree_view/tree_view_sub_tree_node_element.js +418 -0
  24. package/app/components/primer/alpha/tree_view.css +1 -0
  25. package/app/components/primer/alpha/tree_view.css.json +52 -0
  26. package/app/components/primer/primer.d.ts +4 -0
  27. package/app/components/primer/primer.js +4 -0
  28. package/app/components/primer/shared_events.d.ts +15 -0
  29. package/package.json +1 -1
  30. package/static/arguments.json +450 -0
  31. package/static/audited_at.json +17 -0
  32. package/static/classes.json +15 -0
  33. package/static/constants.json +101 -0
  34. package/static/info_arch.json +1348 -0
  35. package/static/previews.json +232 -0
  36. package/static/statuses.json +17 -0
@@ -0,0 +1,39 @@
1
+ import { TreeViewSubTreeNodeElement } from './tree_view_sub_tree_node_element';
2
+ import type { TreeViewNodeType, TreeViewCheckedValue, TreeViewNodeInfo } from '../../shared_events';
3
+ export declare class TreeViewElement extends HTMLElement {
4
+ #private;
5
+ formInputContainer: HTMLElement;
6
+ formInputPrototype: HTMLInputElement;
7
+ connectedCallback(): void;
8
+ disconnectedCallback(): void;
9
+ handleEvent(event: Event): void;
10
+ getFormInputValueForNode(node: Element): string | null;
11
+ getNodePath(node: Element): string[];
12
+ getNodeType(node: Element): TreeViewNodeType | null;
13
+ markCurrentAtPath(path: string[]): void;
14
+ get currentNode(): HTMLLIElement | null;
15
+ expandAtPath(path: string[]): void;
16
+ collapseAtPath(path: string[]): void;
17
+ toggleAtPath(path: string[]): void;
18
+ checkAtPath(path: string[]): void;
19
+ uncheckAtPath(path: string[]): void;
20
+ toggleCheckedAtPath(path: string[]): void;
21
+ checkedValueAtPath(path: string[]): TreeViewCheckedValue;
22
+ disabledValueAtPath(path: string[]): boolean;
23
+ nodeAtPath(path: string[], selector?: string): Element | null;
24
+ subTreeAtPath(path: string[]): TreeViewSubTreeNodeElement | null;
25
+ leafAtPath(path: string[]): HTMLLIElement | null;
26
+ setNodeCheckedValue(node: Element, value: TreeViewCheckedValue): void;
27
+ getNodeCheckedValue(node: Element): TreeViewCheckedValue;
28
+ getNodeDisabledValue(node: Element): boolean;
29
+ setNodeDisabledValue(node: Element, disabled: boolean): void;
30
+ nodeHasCheckBox(node: Element): boolean;
31
+ nodeHasNativeAction(node: Element): boolean;
32
+ expandAncestorsForNode(node: HTMLElement): void;
33
+ infoFromNode(node: Element, newCheckedValue?: TreeViewCheckedValue): TreeViewNodeInfo | null;
34
+ }
35
+ declare global {
36
+ interface Window {
37
+ TreeViewElement: typeof TreeViewElement;
38
+ }
39
+ }
@@ -0,0 +1,15 @@
1
+ export declare class TreeViewIconPairElement extends HTMLElement {
2
+ #private;
3
+ expandedIcon: HTMLElement;
4
+ collapsedIcon: HTMLElement;
5
+ expanded: boolean;
6
+ connectedCallback(): void;
7
+ showExpanded(): void;
8
+ showCollapsed(): void;
9
+ toggle(): void;
10
+ }
11
+ declare global {
12
+ interface Window {
13
+ TreeViewIconPairElement: typeof TreeViewIconPairElement;
14
+ }
15
+ }
@@ -0,0 +1,9 @@
1
+ import { IncludeFragmentElement } from '@github/include-fragment-element';
2
+ export declare class TreeViewIncludeFragmentElement extends IncludeFragmentElement {
3
+ request(): Request;
4
+ }
5
+ declare global {
6
+ interface Window {
7
+ TreeViewIncludeFragmentElement: typeof TreeViewIncludeFragmentElement;
8
+ }
9
+ }
@@ -0,0 +1,3 @@
1
+ import { TreeViewElement } from './tree_view';
2
+ export declare function useRovingTabIndex(containerEl: TreeViewElement): void;
3
+ export declare function getElementState(element: HTMLElement): 'open' | 'closed' | 'end';
@@ -0,0 +1,42 @@
1
+ import { TreeViewIconPairElement } from './tree_view_icon_pair_element';
2
+ import { TreeViewIncludeFragmentElement } from './tree_view_include_fragment_element';
3
+ import { TreeViewElement } from './tree_view';
4
+ type LoadingState = 'loading' | 'error' | 'success';
5
+ export type SelectStrategy = 'self' | 'descendants' | 'mixed_descendants';
6
+ export declare class TreeViewSubTreeNodeElement extends HTMLElement {
7
+ #private;
8
+ node: HTMLElement;
9
+ subTree: HTMLElement;
10
+ iconPair: TreeViewIconPairElement;
11
+ toggleButton: HTMLElement;
12
+ expandedToggleIcon: HTMLElement;
13
+ collapsedToggleIcon: HTMLElement;
14
+ includeFragment: TreeViewIncludeFragmentElement;
15
+ loadingIndicator: HTMLElement;
16
+ loadingFailureMessage: HTMLElement;
17
+ retryButton: HTMLButtonElement;
18
+ connectedCallback(): void;
19
+ get expanded(): boolean;
20
+ set expanded(newValue: boolean);
21
+ get loadingState(): LoadingState;
22
+ set loadingState(newState: LoadingState);
23
+ get selectStrategy(): SelectStrategy;
24
+ disconnectedCallback(): void;
25
+ handleEvent(event: Event): void;
26
+ expand(): void;
27
+ collapse(): void;
28
+ toggle(): void;
29
+ get nodes(): NodeListOf<Element>;
30
+ eachDirectDescendantNode(): Generator<Element>;
31
+ eachDescendantNode(): Generator<Element>;
32
+ eachAncestorSubTreeNode(): Generator<TreeViewSubTreeNodeElement>;
33
+ get isEmpty(): boolean;
34
+ get treeView(): TreeViewElement | null;
35
+ toggleChecked(): void;
36
+ }
37
+ declare global {
38
+ interface Window {
39
+ TreeViewSubTreeNodeElement: typeof TreeViewSubTreeNodeElement;
40
+ }
41
+ }
42
+ export {};
@@ -26,3 +26,7 @@ import '../../lib/primer/forms/toggle_switch_input';
26
26
  import './alpha/action_menu/action_menu_element';
27
27
  import './alpha/select_panel_element';
28
28
  import './beta/details_toggle_element';
29
+ import './alpha/tree_view/tree_view';
30
+ import './alpha/tree_view/tree_view_icon_pair_element';
31
+ import './alpha/tree_view/tree_view_sub_tree_node_element';
32
+ import './alpha/tree_view/tree_view_include_fragment_element';
@@ -3,9 +3,24 @@ export type ItemActivatedEvent = {
3
3
  checked: boolean;
4
4
  value: string | null;
5
5
  };
6
+ export type TreeViewNodeType = 'leaf' | 'sub-tree';
7
+ export type TreeViewCheckedValue = 'true' | 'false' | 'mixed';
8
+ export type TreeViewNodeInfo = {
9
+ node: Element;
10
+ type: TreeViewNodeType;
11
+ path: string[];
12
+ checkedValue: TreeViewCheckedValue;
13
+ previousCheckedValue: TreeViewCheckedValue;
14
+ };
6
15
  declare global {
7
16
  interface HTMLElementEventMap {
8
17
  itemActivated: CustomEvent<ItemActivatedEvent>;
9
18
  beforeItemActivated: CustomEvent<ItemActivatedEvent>;
19
+ treeViewNodeActivated: CustomEvent<TreeViewNodeInfo>;
20
+ treeViewBeforeNodeActivated: CustomEvent<TreeViewNodeInfo>;
21
+ treeViewNodeExpanded: CustomEvent<TreeViewNodeInfo>;
22
+ treeViewNodeCollapsed: CustomEvent<TreeViewNodeInfo>;
23
+ treeViewNodeChecked: CustomEvent<TreeViewNodeInfo[]>;
24
+ treeViewBeforeNodeChecked: CustomEvent<TreeViewNodeInfo[]>;
10
25
  }
11
26
  }