@primer/view-components 0.35.0-rc.5665bbca → 0.35.0-rc.641faa6e
Sign up to get free protection for your applications and to get access to all the features.
- package/app/assets/javascripts/primer_view_components.js.map +1 -1
- package/app/assets/styles/primer_view_components.css +1 -1
- package/app/assets/styles/primer_view_components.css.map +1 -1
- package/app/components/primer/alpha/action_bar_element.d.ts +17 -0
- package/app/components/primer/alpha/action_bar_element.js +0 -3
- package/app/components/primer/alpha/action_list.css +1 -1
- package/app/components/primer/alpha/action_list.d.ts +16 -0
- package/app/components/primer/alpha/action_menu/action_menu_element.d.ts +42 -0
- package/app/components/primer/alpha/auto_complete.css +1 -1
- package/app/components/primer/alpha/banner.css +1 -1
- package/app/components/primer/alpha/dialog.css +1 -1
- package/app/components/primer/alpha/dropdown/menu.d.ts +1 -0
- package/app/components/primer/alpha/dropdown.css +1 -1
- package/app/components/primer/alpha/dropdown.d.ts +1 -0
- package/app/components/primer/alpha/image_crop.d.ts +1 -0
- package/app/components/primer/alpha/modal_dialog.d.ts +18 -0
- package/app/components/primer/alpha/segmented_control.d.ts +12 -0
- package/app/components/primer/alpha/select_panel_element.d.ts +63 -0
- package/app/components/primer/alpha/stack.css +1 -0
- package/app/components/primer/alpha/stack.css.json +90 -0
- package/app/components/primer/alpha/stack_item.css +1 -0
- package/app/components/primer/alpha/stack_item.css.json +12 -0
- package/app/components/primer/alpha/tab_container.d.ts +1 -0
- package/app/components/primer/alpha/tab_nav.css +1 -1
- package/app/components/primer/alpha/text_field.css +1 -1
- package/app/components/primer/alpha/toggle_switch.css +1 -1
- package/app/components/primer/alpha/toggle_switch.d.ts +34 -0
- package/app/components/primer/alpha/tool_tip.d.ts +27 -0
- package/app/components/primer/alpha/underline_nav.css +1 -1
- package/app/components/primer/alpha/x_banner.d.ts +18 -0
- package/app/components/primer/anchored_position.d.ts +27 -0
- package/app/components/primer/aria_live.d.ts +8 -0
- package/app/components/primer/beta/auto_complete/auto_complete.d.ts +1 -0
- package/app/components/primer/beta/avatar.css +1 -1
- package/app/components/primer/beta/avatar_stack.css +1 -1
- package/app/components/primer/beta/blankslate.css +1 -1
- package/app/components/primer/beta/border_box.css +1 -1
- package/app/components/primer/beta/button.css +1 -1
- package/app/components/primer/beta/clipboard_copy.d.ts +1 -0
- package/app/components/primer/beta/counter.css +1 -1
- package/app/components/primer/beta/nav_list.d.ts +20 -0
- package/app/components/primer/beta/nav_list_group_element.d.ts +19 -0
- package/app/components/primer/beta/popover.css +1 -1
- package/app/components/primer/beta/progress_bar.css +1 -1
- package/app/components/primer/beta/relative_time.d.ts +1 -0
- package/app/components/primer/beta/state.css +1 -1
- package/app/components/primer/dialog_helper.d.ts +15 -0
- package/app/components/primer/focus_group.d.ts +19 -0
- package/app/components/primer/primer.d.ts +28 -0
- package/app/components/primer/scrollable_region.d.ts +13 -0
- package/app/components/primer/shared_events.d.ts +11 -0
- package/app/lib/primer/forms/primer_multi_input.js +44 -0
- package/app/lib/primer/forms/primer_text_field.js +119 -0
- package/app/lib/primer/forms/toggle_switch_input.js +34 -0
- package/package.json +7 -8
- package/static/arguments.json +86 -0
- package/static/audited_at.json +2 -0
- package/static/classes.json +6 -0
- package/static/constants.json +24 -0
- package/static/info_arch.json +172 -0
- package/static/previews.json +68 -0
- package/static/statuses.json +2 -0
- /package/{lib → app/lib}/primer/forms/primer_multi_input.d.ts +0 -0
- /package/{lib → app/lib}/primer/forms/primer_text_field.d.ts +0 -0
- /package/{lib → app/lib}/primer/forms/toggle_switch_input.d.ts +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
.ToggleSwitch,.ToggleSwitch.ToggleSwitch{display:inline-flex}.ToggleSwitch{align-items:center;gap:var(--controlStack-medium-gap-condensed)}.ToggleSwitch--checked .ToggleSwitch-statusOn{height:auto;visibility:visible}.ToggleSwitch--checked .ToggleSwitch-statusOff{height:0;visibility:hidden}.ToggleSwitch-track{-webkit-appearance:none;appearance:none;background-color:var(--controlTrack-bgColor-rest);border:var(--borderWidth-thin) solid var(--controlTrack-borderColor-rest);border-radius:var(--borderRadius-medium);cursor:pointer;display:block;height:var(--control-medium-size);overflow:hidden;padding:0;position:relative;-webkit-text-decoration:none;text-decoration:none;transition-duration:80ms;transition-property:background-color,border-color;transition-timing-function:cubic-bezier(.5,1,.89,1);-webkit-user-select:none;user-select:none;width:var(--base-size-64)}.ToggleSwitch-track:focus,.ToggleSwitch-track:focus-visible{outline-offset:1px}.ToggleSwitch-track:hover{background-color:var(--controlTrack-bgColor-hover)}.ToggleSwitch-track:active{background-color:var(--controlTrack-bgColor-active)}@media (pointer:coarse){:is(.ToggleSwitch-track:before){content:"";height:100%;left:50%;min-height:44px;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:100%}}@media (prefers-reduced-motion){.ToggleSwitch-track,.ToggleSwitch-track *{transition:none}}.ToggleSwitch-track[aria-pressed=true][disabled]{background-color:var(--controlTrack-bgColor-disabled);border-color:#0000;color:var(--control-checked-fgColor-disabled)}.ToggleSwitch-track[aria-pressed=true]{background-color:var(--control-checked-bgColor-rest);border-color:var(--borderColor-transparent)}.ToggleSwitch-track[aria-pressed=true]:not([disabled]):hover{background-color:var(--control-checked-bgColor-hover)}.ToggleSwitch-track[aria-pressed=true]:not([disabled]):active{background-color:var(--control-checked-bgColor-active)}.ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-knob{background-color:var(--controlKnob-bgColor-checked);border-color:var(--controlKnob-borderColor-checked);transform:translateX(100%)}.ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-lineIcon{transform:translateX(0)}.ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-circleIcon{transform:translateX(100%)}.ToggleSwitch-track[disabled]{background-color:var(--controlTrack-bgColor-disabled);border-color:#0000;cursor:not-allowed;transition-property:none}.ToggleSwitch-track[disabled] .ToggleSwitch-knob{border-color:var(--borderColor-default);box-shadow:none}.ToggleSwitch-track[disabled] .ToggleSwitch-circleIcon,.ToggleSwitch-track[disabled] .ToggleSwitch-lineIcon{color:var(--controlTrack-fgColor-disabled)}.ToggleSwitch-icons{align-items:center;display:flex;height:100%;overflow:hidden;width:100%}.ToggleSwitch-lineIcon{color:var(--control-checked-fgColor-rest);transform:translateX(-100%)}.ToggleSwitch-circleIcon,.ToggleSwitch-lineIcon{flex:1 0 50%;line-height:0;transition-duration:80ms;transition-property:transform}.ToggleSwitch-circleIcon{color:var(--controlTrack-fgColor-rest);transform:translateX(0)}.ToggleSwitch-knob{background-color:var(--controlKnob-bgColor-rest);border:var(--borderWidth-thin) solid var(--controlKnob-borderColor-rest);border-radius:var(--borderRadius-medium);bottom:0;box-shadow:var(--shadow-resting-medium),var(--button-default-shadow-inset);position:absolute;top:0;transition-duration:80ms;transition-property:transform;transition-timing-function:cubic-bezier(.5,1,.89,1);width:50%;z-index:1}@media (prefers-reduced-motion){.ToggleSwitch-knob{transition:none}}.ToggleSwitch-status{color:var(--fgColor-default);font-size:var(--text-body-size-medium);line-height:
|
|
1
|
+
.ToggleSwitch,.ToggleSwitch.ToggleSwitch{display:inline-flex}.ToggleSwitch{align-items:center;gap:var(--controlStack-medium-gap-condensed)}.ToggleSwitch--checked .ToggleSwitch-statusOn{height:auto;visibility:visible}.ToggleSwitch--checked .ToggleSwitch-statusOff{height:0;visibility:hidden}.ToggleSwitch-track{-webkit-appearance:none;appearance:none;background-color:var(--controlTrack-bgColor-rest);border:var(--borderWidth-thin) solid var(--controlTrack-borderColor-rest);border-radius:var(--borderRadius-medium);cursor:pointer;display:block;height:var(--control-medium-size);overflow:hidden;padding:0;position:relative;-webkit-text-decoration:none;text-decoration:none;transition-duration:80ms;transition-property:background-color,border-color;transition-timing-function:cubic-bezier(.5,1,.89,1);-webkit-user-select:none;user-select:none;width:var(--base-size-64)}.ToggleSwitch-track:focus,.ToggleSwitch-track:focus-visible{outline-offset:1px}.ToggleSwitch-track:hover{background-color:var(--controlTrack-bgColor-hover)}.ToggleSwitch-track:active{background-color:var(--controlTrack-bgColor-active)}@media (pointer:coarse){:is(.ToggleSwitch-track:before){content:"";height:100%;left:50%;min-height:44px;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:100%}}@media (prefers-reduced-motion){.ToggleSwitch-track,.ToggleSwitch-track *{transition:none}}.ToggleSwitch-track[aria-pressed=true][disabled]{background-color:var(--controlTrack-bgColor-disabled);border-color:#0000;color:var(--control-checked-fgColor-disabled)}.ToggleSwitch-track[aria-pressed=true]{background-color:var(--control-checked-bgColor-rest);border-color:var(--borderColor-transparent)}.ToggleSwitch-track[aria-pressed=true]:not([disabled]):hover{background-color:var(--control-checked-bgColor-hover)}.ToggleSwitch-track[aria-pressed=true]:not([disabled]):active{background-color:var(--control-checked-bgColor-active)}.ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-knob{background-color:var(--controlKnob-bgColor-checked);border-color:var(--controlKnob-borderColor-checked);transform:translateX(100%)}.ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-lineIcon{transform:translateX(0)}.ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-circleIcon{transform:translateX(100%)}.ToggleSwitch-track[disabled]{background-color:var(--controlTrack-bgColor-disabled);border-color:#0000;cursor:not-allowed;transition-property:none}.ToggleSwitch-track[disabled] .ToggleSwitch-knob{border-color:var(--borderColor-default);box-shadow:none}.ToggleSwitch-track[disabled] .ToggleSwitch-circleIcon,.ToggleSwitch-track[disabled] .ToggleSwitch-lineIcon{color:var(--controlTrack-fgColor-disabled)}.ToggleSwitch-icons{align-items:center;display:flex;height:100%;overflow:hidden;width:100%}.ToggleSwitch-lineIcon{color:var(--control-checked-fgColor-rest);transform:translateX(-100%)}.ToggleSwitch-circleIcon,.ToggleSwitch-lineIcon{flex:1 0 50%;line-height:0;transition-duration:80ms;transition-property:transform}.ToggleSwitch-circleIcon{color:var(--controlTrack-fgColor-rest);transform:translateX(0)}.ToggleSwitch-knob{background-color:var(--controlKnob-bgColor-rest);border:var(--borderWidth-thin) solid var(--controlKnob-borderColor-rest);border-radius:var(--borderRadius-medium);bottom:0;box-shadow:var(--shadow-resting-medium),var(--button-default-shadow-inset);position:absolute;top:0;transition-duration:80ms;transition-property:transform;transition-timing-function:cubic-bezier(.5,1,.89,1);width:50%;z-index:1}@media (prefers-reduced-motion){.ToggleSwitch-knob{transition:none}}.ToggleSwitch-status{color:var(--fgColor-default);font-size:var(--text-body-size-medium);line-height:var(--text-title-lineHeight-large);position:relative;text-align:right}.ToggleSwitch-statusIcon{display:flex;margin-top:.063rem;width:var(--base-size-16)}.ToggleSwitch--small .ToggleSwitch-status{font-size:var(--text-body-size-small)}.ToggleSwitch--small .ToggleSwitch-track{height:var(--control-xsmall-size);width:var(--base-size-48)}.ToggleSwitch--disabled .ToggleSwitch-status{color:var(--fgColor-muted)}.ToggleSwitch-statusOn{height:0;visibility:hidden}.ToggleSwitch-statusOff{height:auto;visibility:visible}.ToggleSwitch--statusAtEnd{flex-direction:row-reverse}.ToggleSwitch--statusAtEnd .ToggleSwitch-status{text-align:left}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
declare class ToggleSwitchElement extends HTMLElement {
|
|
2
|
+
switch: HTMLElement;
|
|
3
|
+
loadingSpinner: HTMLElement;
|
|
4
|
+
errorIcon: HTMLElement;
|
|
5
|
+
turbo: boolean;
|
|
6
|
+
private toggling;
|
|
7
|
+
get src(): string | null;
|
|
8
|
+
get csrf(): string | null;
|
|
9
|
+
get csrfField(): string;
|
|
10
|
+
isRemote(): boolean;
|
|
11
|
+
toggle(): Promise<void>;
|
|
12
|
+
turnOn(): void;
|
|
13
|
+
turnOff(): void;
|
|
14
|
+
isOn(): boolean;
|
|
15
|
+
isOff(): boolean;
|
|
16
|
+
isDisabled(): boolean;
|
|
17
|
+
disable(): void;
|
|
18
|
+
enable(): void;
|
|
19
|
+
private performToggle;
|
|
20
|
+
private setLoadingState;
|
|
21
|
+
private setSuccessState;
|
|
22
|
+
private setErrorState;
|
|
23
|
+
private setFinishedState;
|
|
24
|
+
private submitForm;
|
|
25
|
+
}
|
|
26
|
+
declare global {
|
|
27
|
+
interface Window {
|
|
28
|
+
ToggleSwitchElement: typeof ToggleSwitchElement;
|
|
29
|
+
Turbo: {
|
|
30
|
+
renderStreamMessage: (message: string) => void;
|
|
31
|
+
};
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
export {};
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import '@oddbird/popover-polyfill';
|
|
2
|
+
type Direction = 'n' | 's' | 'e' | 'w' | 'ne' | 'se' | 'nw' | 'sw';
|
|
3
|
+
declare class ToolTipElement extends HTMLElement {
|
|
4
|
+
#private;
|
|
5
|
+
styles(): string;
|
|
6
|
+
get showReason(): "focus" | "mouse";
|
|
7
|
+
get htmlFor(): string;
|
|
8
|
+
set htmlFor(value: string);
|
|
9
|
+
get type(): 'description' | 'label';
|
|
10
|
+
set type(value: 'description' | 'label');
|
|
11
|
+
get direction(): Direction;
|
|
12
|
+
set direction(value: Direction);
|
|
13
|
+
get control(): HTMLElement | null;
|
|
14
|
+
set hiddenFromView(value: true | false);
|
|
15
|
+
get hiddenFromView(): true | false;
|
|
16
|
+
connectedCallback(): void;
|
|
17
|
+
disconnectedCallback(): void;
|
|
18
|
+
handleEvent(event: Event): Promise<void>;
|
|
19
|
+
static observedAttributes: string[];
|
|
20
|
+
attributeChangedCallback(name: string): void;
|
|
21
|
+
}
|
|
22
|
+
declare global {
|
|
23
|
+
interface Window {
|
|
24
|
+
ToolTipElement: typeof ToolTipElement;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.UnderlineNav{box-shadow:inset 0 -1px 0 var(--borderColor-muted);display:flex;min-height:var(--base-size-48);overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:auto;justify-content:space-between}.UnderlineNav .Counter{background-color:var(--bgColor-neutral-muted,var(--color-neutral-muted));color:var(--fgColor-default);margin-left:var(--control-medium-gap)}.UnderlineNav .Counter--primary{background-color:var(--bgColor-neutral-emphasis);color:var(--fgColor-onEmphasis)}.UnderlineNav-body{align-items:center;display:flex;gap:var(--control-medium-gap);list-style:none}.UnderlineNav-item{align-items:center;background-color:initial;border:0;border-radius:var(--borderRadius-medium);color:var(--fgColor-default);cursor:pointer;display:flex;font-size:var(--text-body-size-medium);line-height:30px;padding:0 var(--control-medium-paddingInline-condensed);position:relative;text-align:center;white-space:nowrap}.UnderlineNav-item:focus,.UnderlineNav-item:focus-visible,.UnderlineNav-item:hover{border-bottom-color:var(--borderColor-neutral-muted);color:var(--fgColor-default);outline-offset:-2px;-webkit-text-decoration:none;text-decoration:none;transition:border-bottom-color .12s ease-out}.UnderlineNav-item [data-content]:before{content:attr(data-content);display:block;font-weight:var(--base-text-weight-semibold);height:0;visibility:hidden}:is(.UnderlineNav-item:before){content:"";height:100%;left:50%;min-height:48px;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:100%}@media (pointer:fine){.UnderlineNav-item:hover{background:var(--control-transparent-bgColor-hover);color:var(--fgColor-default);-webkit-text-decoration:none;text-decoration:none;transition:background .12s ease-out}}.UnderlineNav-item.selected,.UnderlineNav-item[aria-current]:not([aria-current=false]),.UnderlineNav-item[role=tab][aria-selected=true]{border-bottom-color:var(--underlineNav-borderColor-active);color:var(--fgColor-default);font-weight:var(--base-text-weight-semibold)}:is(.UnderlineNav-item.selected,.UnderlineNav-item[role=tab][aria-selected=true],.UnderlineNav-item[aria-current]:not([aria-current=false])):after{background:var(--underlineNav-borderColor-active);border-radius:var(--borderRadius-medium);bottom:calc(50% -
|
|
1
|
+
.UnderlineNav{box-shadow:inset 0 -1px 0 var(--borderColor-muted);display:flex;min-height:var(--base-size-48);overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:auto;justify-content:space-between}.UnderlineNav .Counter{background-color:var(--bgColor-neutral-muted,var(--color-neutral-muted));color:var(--fgColor-default);margin-left:var(--control-medium-gap)}.UnderlineNav .Counter--primary{background-color:var(--bgColor-neutral-emphasis);color:var(--fgColor-onEmphasis)}.UnderlineNav-body{align-items:center;display:flex;gap:var(--control-medium-gap);list-style:none}.UnderlineNav-item{align-items:center;background-color:initial;border:0;border-radius:var(--borderRadius-medium);color:var(--fgColor-default);cursor:pointer;display:flex;font-size:var(--text-body-size-medium);line-height:30px;padding:0 var(--control-medium-paddingInline-condensed);position:relative;text-align:center;white-space:nowrap}.UnderlineNav-item:focus,.UnderlineNav-item:focus-visible,.UnderlineNav-item:hover{border-bottom-color:var(--borderColor-neutral-muted);color:var(--fgColor-default);outline-offset:-2px;-webkit-text-decoration:none;text-decoration:none;transition:border-bottom-color .12s ease-out}.UnderlineNav-item [data-content]:before{content:attr(data-content);display:block;font-weight:var(--base-text-weight-semibold);height:0;visibility:hidden}:is(.UnderlineNav-item:before){content:"";height:100%;left:50%;min-height:48px;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:100%}@media (pointer:fine){.UnderlineNav-item:hover{background:var(--control-transparent-bgColor-hover);color:var(--fgColor-default);-webkit-text-decoration:none;text-decoration:none;transition:background .12s ease-out}}.UnderlineNav-item.selected,.UnderlineNav-item[aria-current]:not([aria-current=false]),.UnderlineNav-item[role=tab][aria-selected=true]{border-bottom-color:var(--underlineNav-borderColor-active);color:var(--fgColor-default);font-weight:var(--base-text-weight-semibold)}:is(.UnderlineNav-item.selected,.UnderlineNav-item[role=tab][aria-selected=true],.UnderlineNav-item[aria-current]:not([aria-current=false])):after{background:var(--underlineNav-borderColor-active);border-radius:var(--borderRadius-medium);bottom:calc(50% - var(--base-size-24));content:"";height:2px;position:absolute;right:50%;transform:translate(50%,-50%);width:100%;z-index:1}.UnderlineNav--right{justify-content:flex-end}.UnderlineNav--right .UnderlineNav-actions{flex:1 1 auto}.UnderlineNav-actions{align-self:center}.UnderlineNav--full{display:block}.UnderlineNav--full .UnderlineNav-body{min-height:var(--base-size-48)}.UnderlineNav-octicon{color:var(--fgColor-muted);display:inline!important;margin-right:var(--control-medium-gap);fill:var(--fgColor-muted)}.UnderlineNav-container{display:flex;justify-content:space-between}
|
|
@@ -0,0 +1,18 @@
|
|
|
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 {};
|
|
@@ -0,0 +1,27 @@
|
|
|
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
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import '@github/auto-complete-element';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.avatar{background-color:var(--avatar-bgColor);border-radius:var(--borderRadius-medium);box-shadow:0 0 0 1px var(--avatar-borderColor);display:inline-block;flex-shrink:0;line-height:1;overflow:hidden;vertical-align:middle}.avatar-link{float:left;line-height:1}.avatar-group-item{display:inline-block;margin-bottom:
|
|
1
|
+
.avatar{background-color:var(--avatar-bgColor);border-radius:var(--borderRadius-medium);box-shadow:0 0 0 1px var(--avatar-borderColor);display:inline-block;flex-shrink:0;line-height:1;overflow:hidden;vertical-align:middle}.avatar-link{float:left;line-height:1}.avatar-group-item{display:inline-block;margin-bottom:var(--base-size-4)}.avatar-1,.avatar-2,.avatar-small{border-radius:var(--borderRadius-small)}.avatar-1{height:var(--base-size-16);width:var(--base-size-16)}.avatar-2{height:var(--base-size-20);width:var(--base-size-20)}.avatar-3{height:var(--base-size-24);width:var(--base-size-24)}.avatar-4{height:var(--base-size-28);width:var(--base-size-28)}.avatar-5{height:var(--base-size-32);width:var(--base-size-32)}.avatar-6{height:var(--base-size-40);width:var(--base-size-40)}.avatar-7{height:var(--base-size-48);width:var(--base-size-48)}.avatar-8{height:var(--base-size-64);width:var(--base-size-64)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.AvatarStack{height:20px;min-width:26px;position:relative}.AvatarStack .AvatarStack-body{position:absolute}.AvatarStack.AvatarStack--two{min-width:36px}.AvatarStack.AvatarStack--three-plus{min-width:46px}.AvatarStack-body{background:var(--bgColor-default);border-radius:100px;display:flex}.AvatarStack-body .avatar{background-color:var(--bgColor-default);border-radius:var(--borderRadius-small);border-right:var(--borderWidth-thin) solid var(--bgColor-default);box-shadow:none;box-sizing:initial;display:flex;height:20px;margin-right:-11px;position:relative;transition:margin .1s ease-in-out;width:20px;z-index:2}:is(.AvatarStack-body .avatar):first-child{z-index:3}:is(.AvatarStack-body .avatar):last-child{border-right:0;z-index:1}:is(.AvatarStack-body .avatar) img{border-radius:var(--borderRadius-small)}:is(.AvatarStack-body .avatar):nth-child(n+4){display:none;opacity:0}.AvatarStack-body:hover .avatar{margin-right:
|
|
1
|
+
.AvatarStack{height:20px;min-width:26px;position:relative}.AvatarStack .AvatarStack-body{position:absolute}.AvatarStack.AvatarStack--two{min-width:36px}.AvatarStack.AvatarStack--three-plus{min-width:46px}.AvatarStack-body{background:var(--bgColor-default);border-radius:100px;display:flex}.AvatarStack-body .avatar{background-color:var(--bgColor-default);border-radius:var(--borderRadius-small);border-right:var(--borderWidth-thin) solid var(--bgColor-default);box-shadow:none;box-sizing:initial;display:flex;height:20px;margin-right:-11px;position:relative;transition:margin .1s ease-in-out;width:20px;z-index:2}:is(.AvatarStack-body .avatar):first-child{z-index:3}:is(.AvatarStack-body .avatar):last-child{border-right:0;z-index:1}:is(.AvatarStack-body .avatar) img{border-radius:var(--borderRadius-small)}:is(.AvatarStack-body .avatar):nth-child(n+4){display:none;opacity:0}.AvatarStack-body:hover .avatar{margin-right:var(--base-size-4)}.AvatarStack-body:hover .avatar:nth-child(n+4){display:flex;opacity:1}.AvatarStack-body:hover .avatar-more{display:none!important}.avatar.avatar-more{background:var(--bgColor-muted);margin-right:0;z-index:1}.avatar.avatar-more:after,.avatar.avatar-more:before{border-radius:2px;content:"";display:block;height:20px;outline:var(--borderWidth-thin) solid var(--bgColor-default);position:absolute}.avatar.avatar-more:before{background:var(--avatarStack-fade-bgColor-muted);width:17px}.avatar.avatar-more:after{background:var(--avatarStack-fade-bgColor-default);width:14px}.AvatarStack--right .AvatarStack-body{flex-direction:row-reverse;right:0}:is(.AvatarStack--right .AvatarStack-body):hover .avatar{margin-left:var(--base-size-4);margin-right:0}:is(.AvatarStack--right .AvatarStack-body) .avatar:not(:last-child){border-left:0}.AvatarStack--right .avatar.avatar-more{background:var(--avatarStack-fade-bgColor-default)}:is(.AvatarStack--right .avatar.avatar-more):before{width:5px}:is(.AvatarStack--right .avatar.avatar-more):after{background:var(--bgColor-muted);width:2px}.AvatarStack--right .avatar{border-left:var(--borderWidth-thin) solid var(--bgColor-default);border-right:0;margin-left:-11px;margin-right:0}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.blankslate-container{container-type:inline-size;width:100%}.blankslate{--blankslate-outer-padding-block:var(--base-size-32);--blankslate-outer-padding-inline:var(--base-size-32);padding:var(--blankslate-outer-padding-block) var(--blankslate-outer-padding-inline);position:relative;text-align:center}.blankslate p{color:var(--fgColor-muted);font-size:var(--text-body-size-large)}.blankslate code{background:var(--bgColor-default);border:var(--borderWidth-thin) solid var(--borderColor-muted);border-radius:var(--borderRadius-medium);font-size:var(--text-body-size-medium);padding:
|
|
1
|
+
.blankslate-container{container-type:inline-size;width:100%}.blankslate{--blankslate-outer-padding-block:var(--base-size-32);--blankslate-outer-padding-inline:var(--base-size-32);padding:var(--blankslate-outer-padding-block) var(--blankslate-outer-padding-inline);position:relative;text-align:center}.blankslate p{color:var(--fgColor-muted);font-size:var(--text-body-size-large)}.blankslate code{background:var(--bgColor-default);border:var(--borderWidth-thin) solid var(--borderColor-muted);border-radius:var(--borderRadius-medium);font-size:var(--text-body-size-medium);padding:var(--base-size-2) var(--base-size-4) var(--base-size-4)}.blankslate img{height:56px;width:56px}.blankslate-icon{color:var(--fgColor-muted);margin-bottom:var(--stack-gap-condensed);margin-left:var(--control-small-gap);margin-right:var(--control-small-gap)}.blankslate-image{margin-bottom:var(--stack-gap-normal)}.blankslate-heading{font-size:var(--text-title-size-medium);font-weight:var(--text-title-weight-medium);margin-bottom:var(--base-size-4)}.blankslate-action{margin-top:var(--stack-gap-normal)}.blankslate-action:first-of-type{margin-top:var(--stack-gap-spacious)}.blankslate-action:last-of-type{margin-bottom:var(--stack-gap-condensed)}.blankslate-capped{border-radius:0 0 var(--borderRadius-medium) var(--borderRadius-medium)}.blankslate-spacious{--blankslate-outer-padding-block:var(--base-size-80);--blankslate-outer-padding-inline:var(--base-size-40)}.blankslate-narrow{margin:0 auto;max-width:485px}.blankslate-large img{height:80px;width:80px}.blankslate-large h3{font-size:24px;margin:var(--stack-gap-normal) 0}.blankslate-large p{font-size:var(--text-body-size-large)}.blankslate-clean-background{border:0}@container (max-width: 34rem){.blankslate{--blankslate-outer-padding-block:var(--base-size-20);--blankslate-outer-padding-inline:var(--base-size-20)}.blankslate-spacious{--blankslate-outer-padding-block:var(--base-size-44);--blankslate-outer-padding-inline:var(--base-size-28)}.blankslate-icon{margin-bottom:var(--stack-gap-condensed)}.blankslate-heading{font-size:var(--text-title-size-small)}.blankslate p{font-size:var(--text-body-size-medium)}.blankslate-action{margin-top:var(--stack-gap-condensed)}.blankslate-action:first-of-type{margin-top:var(--stack-gap-normal)}.blankslate-action:last-of-type{margin-bottom:calc(var(--stack-gap-condensed)/2)}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.Box{background-color:var(--bgColor-default);border-color:var(--borderColor-default);border-radius:var(--borderRadius-medium);border-style:solid;border-width:var(--borderWidth-thin)}.Box--condensed{line-height:1.25}.Box--condensed .Box-body,.Box--condensed .Box-footer,.Box--condensed .Box-header{padding:var(--stack-padding-condensed) var(--stack-padding-normal)}.btn-octicon:is(.Box--condensed .Box-btn-octicon){line-height:1.25;margin:calc(var(--controlStack-medium-gap-condensed)*-1) calc(var(--controlStack-small-gap-spacious)*-1);padding:var(--control-medium-paddingInline-condensed) var(--control-medium-paddingInline-spacious)}.Box--condensed .Box-row{padding:var(--stack-padding-condensed) var(--stack-padding-normal)}.Box--spacious .Box-header{line-height:1.25;padding:var(--stack-padding-spacious)}.Box--spacious .Box-title{font-size:var(--text-title-size-medium)}.Box--spacious .Box-body,.Box--spacious .Box-footer{padding:var(--stack-padding-spacious)}.btn-octicon:is(.Box--spacious .Box-btn-octicon){margin:calc(var(--stack-gap-spacious)*-1)
|
|
1
|
+
.Box{background-color:var(--bgColor-default);border-color:var(--borderColor-default);border-radius:var(--borderRadius-medium);border-style:solid;border-width:var(--borderWidth-thin)}.Box--condensed{line-height:1.25}.Box--condensed .Box-body,.Box--condensed .Box-footer,.Box--condensed .Box-header{padding:var(--stack-padding-condensed) var(--stack-padding-normal)}.btn-octicon:is(.Box--condensed .Box-btn-octicon){line-height:1.25;margin:calc(var(--controlStack-medium-gap-condensed)*-1) calc(var(--controlStack-small-gap-spacious)*-1);padding:var(--control-medium-paddingInline-condensed) var(--control-medium-paddingInline-spacious)}.Box--condensed .Box-row{padding:var(--stack-padding-condensed) var(--stack-padding-normal)}.Box--spacious .Box-header{line-height:1.25;padding:var(--stack-padding-spacious)}.Box--spacious .Box-title{font-size:var(--text-title-size-medium)}.Box--spacious .Box-body,.Box--spacious .Box-footer{padding:var(--stack-padding-spacious)}.btn-octicon:is(.Box--spacious .Box-btn-octicon){margin:calc(var(--stack-gap-spacious)*-1);padding:var(--stack-padding-spacious)}.Box--spacious .Box-row{padding:var(--stack-padding-spacious)}.Box-header{background-color:var(--bgColor-muted);border-color:var(--borderColor-default);border-style:solid;border-top-left-radius:var(--borderRadius-medium);border-top-right-radius:var(--borderRadius-medium);border-width:var(--borderWidth-thin);margin:calc(var(--borderWidth-thin)*-1) calc(var(--borderWidth-thin)*-1) 0;padding:var(--stack-padding-normal)}.Box-title{font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-semibold)}.Box-body{border-bottom:var(--borderWidth-thin) solid var(--borderColor-default);padding:var(--stack-padding-normal)}.Box-body:last-of-type{border-bottom-left-radius:var(--borderRadius-medium);border-bottom-right-radius:var(--borderRadius-medium);margin-bottom:calc(var(--borderWidth-thin)*-1)}.Box-row{border-top:var(--borderWidth-thin) solid var(--borderColor-muted);list-style-type:none;margin-top:calc(var(--borderWidth-thin)*-1);padding:var(--stack-padding-normal)}.Box-row:first-of-type{border-top-left-radius:var(--borderRadius-medium);border-top-right-radius:var(--borderRadius-medium)}.Box-row:last-of-type{border-bottom-left-radius:var(--borderRadius-medium);border-bottom-right-radius:var(--borderRadius-medium)}.Box-row.Box-row--unread,.Box-row.unread{box-shadow:inset 2px 0 0 var(--borderColor-accent-emphasis)}.Box-row.navigation-focus .Box-row--drag-button{color:var(--fgColor-accent);cursor:grab;opacity:1}.Box-row.navigation-focus.is-dragging .Box-row--drag-button{cursor:grabbing}.Box-row.navigation-focus.sortable-chosen,.Box-row.navigation-focus.sortable-ghost{background-color:var(--bgColor-muted)}.Box-row.navigation-focus.sortable-ghost .Box-row--drag-hide{opacity:0}.Box-row--focus-gray.navigation-focus{background-color:var(--bgColor-muted)}.Box-row--focus-blue.navigation-focus{background-color:var(--bgColor-accent-muted)}.Box-row--hover-gray:hover{background-color:var(--bgColor-muted)}.Box-row--hover-blue:hover{background-color:var(--bgColor-accent-muted)}@media (min-width:768px){.Box-row-link{color:var(--fgColor-default)}.Box-row-link,.Box-row-link:hover{-webkit-text-decoration:none;text-decoration:none}.Box-row-link:hover{color:var(--fgColor-accent)}}.Box-row--drag-button{opacity:0}.Box-footer{border-radius:0 0 var(--borderRadius-medium) var(--borderRadius-medium);border-top:var(--borderWidth-thin) solid var(--borderColor-default);margin-top:calc(var(--borderWidth-thin)*-1);padding:var(--stack-padding-normal)}.Box--scrollable{max-height:324px;overflow:scroll}.Box--blue,.Box--blue .Box-header{border-color:var(--borderColor-accent-muted)}.Box--blue .Box-header{background-color:var(--bgColor-accent-muted)}.Box--blue .Box-body,.Box--blue .Box-footer,.Box--blue .Box-row{border-color:var(--borderColor-accent-muted)}.Box--danger,:is(.Box--danger .Box-body):last-of-type,:is(.Box--danger .Box-row):first-of-type{border-color:var(--borderColor-danger-emphasis)}.Box-header--blue{background-color:var(--bgColor-accent-muted);border-color:var(--borderColor-accent-muted)}.Box-row--yellow{background-color:var(--bgColor-attention-muted)}.Box-row--blue{background-color:var(--bgColor-accent-muted)}.Box-row--gray{background-color:var(--bgColor-muted)}.Box-btn-octicon.btn-octicon{line-height:var(--text-title-lineHeight-large);margin:calc(var(--controlStack-small-gap-spacious)*-1);padding:var(--control-medium-paddingInline-spacious)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--duration-fast:80ms;--easing-easeInOut:cubic-bezier(0.65,0,0.35,1)}.Button{align-items:center;background-color:initial;border:var(--borderWidth-thin) solid;border-color:#0000;border-radius:var(--borderRadius-medium);color:var(--button-default-fgColor-rest);cursor:pointer;display:inline-flex;flex-direction:row;font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-medium);gap:var(--base-size-4);height:var(--control-medium-size);justify-content:space-between;min-width:max-content;padding:0 var(--control-medium-paddingInline-normal);position:relative;text-align:center;transition:var(--duration-fast) var(--easing-easeInOut);transition-property:color,fill,background-color,border-color;-webkit-user-select:none;user-select:none}@media (pointer:coarse){:is(.Button:before){content:"";height:100%;left:50%;min-height:48px;min-width:48px;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:100%}}.Button:hover{transition-duration:var(--duration-fast)}.Button:active{transition:none}.Button:disabled,.Button[aria-disabled=true]{box-shadow:none;cursor:not-allowed}.Button.Button--iconOnly{color:var(--fgColor-muted)}:is(a.Button,summary.Button):hover{-webkit-text-decoration:none;text-decoration:none}.Button-content{align-items:center;display:grid;flex:1 0 auto;grid-template-areas:"leadingVisual text trailingVisual";grid-template-columns:min-content minmax(0,auto) min-content;place-content:center}.Button-content>:not(:last-child){margin-right:var(--control-medium-gap)}.Button-content--alignStart{justify-content:start}.Button-visual{display:flex;pointer-events:none}.Button-visual .Counter{background-color:var(--buttonCounter-default-bgColor-rest);color:inherit}.Button-label{grid-area:text;line-height:var(--text-body-lineHeight-medium);white-space:nowrap}.Button-leadingVisual{grid-area:leadingVisual}.Button-leadingVisual svg{fill:currentcolor}.Button-trailingVisual{grid-area:trailingVisual}.Button-trailingAction{margin-right:calc(var(--base-size-4)*-1)}.Button--small{font-size:var(--text-body-size-small);gap:var(--control-small-gap);height:var(--control-small-size);min-width:var(--control-small-size);padding:0 var(--control-small-paddingInline-condensed)}.Button--small .Button-label{line-height:var(--text-body-lineHeight-small)}:is(.Button--small .Button-content)>:not(:last-child){margin-right:var(--control-small-gap)}.Button--large{gap:var(--control-large-gap);height:var(--control-large-size);padding:0 var(--control-large-paddingInline-spacious)}.Button--large .Button-label{line-height:var(--text-body-lineHeight-large)}:is(.Button--large .Button-content)>:not(:last-child){margin-right:var(--control-large-gap)}.Button--fullWidth{width:100%}.Button--labelWrap{height:unset;min-height:var(--control-medium-size);min-width:-moz-fit-content;min-width:fit-content}.Button--labelWrap .Button-content{align-self:stretch;flex:1 1 auto;padding-block:calc(var(--control-medium-paddingBlock) -
|
|
1
|
+
:root{--duration-fast:80ms;--easing-easeInOut:cubic-bezier(0.65,0,0.35,1)}.Button{align-items:center;background-color:initial;border:var(--borderWidth-thin) solid;border-color:#0000;border-radius:var(--borderRadius-medium);color:var(--button-default-fgColor-rest);cursor:pointer;display:inline-flex;flex-direction:row;font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-medium);gap:var(--base-size-4);height:var(--control-medium-size);justify-content:space-between;min-width:max-content;padding:0 var(--control-medium-paddingInline-normal);position:relative;text-align:center;transition:var(--duration-fast) var(--easing-easeInOut);transition-property:color,fill,background-color,border-color;-webkit-user-select:none;user-select:none}@media (pointer:coarse){:is(.Button:before){content:"";height:100%;left:50%;min-height:48px;min-width:48px;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:100%}}.Button:hover{transition-duration:var(--duration-fast)}.Button:active{transition:none}.Button:disabled,.Button[aria-disabled=true]{box-shadow:none;cursor:not-allowed}.Button.Button--iconOnly{color:var(--fgColor-muted)}:is(a.Button,summary.Button):hover{-webkit-text-decoration:none;text-decoration:none}.Button-content{align-items:center;display:grid;flex:1 0 auto;grid-template-areas:"leadingVisual text trailingVisual";grid-template-columns:min-content minmax(0,auto) min-content;place-content:center}.Button-content>:not(:last-child){margin-right:var(--control-medium-gap)}.Button-content--alignStart{justify-content:start}.Button-visual{display:flex;pointer-events:none}.Button-visual .Counter{background-color:var(--buttonCounter-default-bgColor-rest);color:inherit}.Button-label{grid-area:text;line-height:var(--text-body-lineHeight-medium);white-space:nowrap}.Button-leadingVisual{grid-area:leadingVisual}.Button-leadingVisual svg{fill:currentcolor}.Button-trailingVisual{grid-area:trailingVisual}.Button-trailingAction{margin-right:calc(var(--base-size-4)*-1)}.Button--small{font-size:var(--text-body-size-small);gap:var(--control-small-gap);height:var(--control-small-size);min-width:var(--control-small-size);padding:0 var(--control-small-paddingInline-condensed)}.Button--small .Button-label{line-height:var(--text-body-lineHeight-small)}:is(.Button--small .Button-content)>:not(:last-child){margin-right:var(--control-small-gap)}.Button--large{gap:var(--control-large-gap);height:var(--control-large-size);padding:0 var(--control-large-paddingInline-spacious)}.Button--large .Button-label{line-height:var(--text-body-lineHeight-large)}:is(.Button--large .Button-content)>:not(:last-child){margin-right:var(--control-large-gap)}.Button--fullWidth{width:100%}.Button--labelWrap{height:unset;min-height:var(--control-medium-size);min-width:-moz-fit-content;min-width:fit-content}.Button--labelWrap .Button-content{align-self:stretch;flex:1 1 auto;padding-block:calc(var(--control-medium-paddingBlock) - var(--base-size-2))}.Button--labelWrap .Button-label{white-space:unset}.Button--labelWrap.Button--small{height:unset;min-height:var(--control-small-size)}.Button--labelWrap.Button--small .Button-content{padding-block:calc(var(--control-small-paddingBlock) - var(--base-size-2))}.Button--labelWrap.Button--large{height:unset;min-height:var(--control-large-size);padding-inline:var(--control-large-paddingInline-spacious)}.Button--labelWrap.Button--large .Button-content{padding-block:calc(var(--control-large-paddingBlock) - var(--base-size-2))}.Button--primary{color:var(--button-primary-fgColor-rest);fill:var(--button-primary-iconColor-rest);background-color:var(--button-primary-bgColor-rest);border-color:var(--button-primary-borderColor-rest);box-shadow:var(--shadow-resting-small,var(--color-btn-primary-shadow))}.Button--primary.Button--iconOnly{color:var(--button-primary-iconColor-rest)}.Button--primary:hover:not(:disabled,.Button--inactive){background-color:var(--button-primary-bgColor-hover);border-color:var(--button-primary-borderColor-hover)}.Button--primary:focus{box-shadow:inset 0 0 0 3px var(--fgColor-onEmphasis);outline:2px solid var(--focus-outlineColor);outline-offset:-2px}.Button--primary:focus:not(:focus-visible){box-shadow:none;outline:1px solid #0000}.Button--primary:focus-visible{box-shadow:inset 0 0 0 3px var(--fgColor-onEmphasis);outline:2px solid var(--focus-outlineColor);outline-offset:-2px}.Button--primary:active:not(:disabled),.Button--primary[aria-pressed=true]{background-color:var(--button-primary-bgColor-active);box-shadow:var(--button-primary-shadow-selected)}.Button--primary:disabled,.Button--primary[aria-disabled=true]{color:var(--button-primary-fgColor-disabled);fill:var(--button-primary-fgColor-disabled);background-color:var(--button-primary-bgColor-disabled);border-color:var(--button-primary-borderColor-disabled)}.Button--primary .Counter{background-color:var(--buttonCounter-primary-bgColor-rest);color:inherit}.Button--secondary{color:var(--button-default-fgColor-rest);fill:var(--fgColor-muted);background-color:var(--button-default-bgColor-rest);border-color:var(--button-default-borderColor-rest);box-shadow:var(--button-default-shadow-resting),var(--button-default-shadow-inset)}.Button--secondary:hover:not(:disabled,.Button--inactive){background-color:var(--button-default-bgColor-hover);border-color:var(--button-default-borderColor-hover)}.Button--secondary:active:not(:disabled){background-color:var(--button-default-bgColor-active);border-color:var(--button-default-borderColor-active)}.Button--secondary[aria-pressed=true]{background-color:var(--button-default-bgColor-selected);box-shadow:var(--shadow-inset)}.Button--secondary:disabled,.Button--secondary[aria-disabled=true]{color:var(--control-fgColor-disabled);fill:var(--control-fgColor-disabled);background-color:var(--button-default-bgColor-disabled);border-color:var(--button-default-borderColor-disabled)}.Button--invisible{color:var(--button-invisible-fgColor-rest)}.Button--invisible.Button--iconOnly{color:var(--button-invisible-iconColor-rest,var(--color-fg-muted))}.Button--invisible:hover:not(:disabled,.Button--inactive){background-color:var(--control-transparent-bgColor-hover,var(--color-action-list-item-default-hover-bg))}.Button--invisible:active:not(:disabled),.Button--invisible[aria-pressed=true]{background-color:var(--button-invisible-bgColor-active)}.Button--invisible:disabled,.Button--invisible[aria-disabled=true]{color:var(--button-invisible-fgColor-disabled);fill:var(--button-invisible-fgColor-disabled);background-color:var(--button-invisible-bgColor-disabled);border-color:var(--button-invisible-borderColor-disabled)}.Button--invisible.Button--invisible-noVisuals .Button-label{color:var(--button-invisible-fgColor-rest)}.Button--invisible .Button-visual{color:var(--button-invisible-iconColor-rest,var(--color-fg-muted))}:is(.Button--invisible .Button-visual) .Counter{color:var(--fgColor-default)}.Button--link{color:var(--fgColor-link);display:inline-block;font-size:inherit;height:unset;min-width:-moz-fit-content;min-width:fit-content;padding:0;fill:var(--fgColor-link);border:none}.Button--link:hover:not(:disabled,.Button--inactive){-webkit-text-decoration:underline;text-decoration:underline}.Button--link:focus,.Button--link:focus-visible{outline-offset:2px}.Button--link:disabled,.Button--link[aria-disabled=true]{color:var(--control-fgColor-disabled);fill:var(--control-fgColor-disabled);background-color:initial;border-color:#0000}.Button--link .Button-label{white-space:unset}.Button--danger{color:var(--button-danger-fgColor-rest);fill:var(--button-danger-iconColor-rest);background-color:var(--button-danger-bgColor-rest);border-color:var(--button-danger-borderColor-rest);box-shadow:var(--button-default-shadow-resting),var(--button-default-shadow-inset)}.Button--danger.Button--iconOnly{color:var(--button-danger-iconColor-rest)}.Button--danger:hover:not(:disabled,.Button--inactive){color:var(--button-danger-fgColor-hover);fill:var(--button-danger-fgColor-hover);background-color:var(--button-danger-bgColor-hover);border-color:var(--button-danger-borderColor-hover);box-shadow:var(--shadow-resting-small)}.Button--danger:hover:not(:disabled,.Button--inactive) .Counter{background-color:var(--buttonCounter-danger-bgColor-hover);color:var(--buttonCounter-danger-fgColor-hover)}.Button--danger:active:not(:disabled),.Button--danger[aria-pressed=true]{color:var(--button-danger-fgColor-active);fill:var(--button-danger-fgColor-active);background-color:var(--button-danger-bgColor-active);border-color:var(--button-danger-borderColor-active);box-shadow:var(--button-danger-shadow-selected)}.Button--danger:disabled,.Button--danger[aria-disabled=true]{color:var(--button-danger-fgColor-disabled);fill:var(--button-danger-fgColor-disabled);background-color:var(--button-danger-bgColor-disabled);border-color:var(--button-default-borderColor-disabled)}:is(.Button--danger:disabled,.Button--danger[aria-disabled=true]) .Counter{background-color:var(--buttonCounter-danger-bgColor-disabled);color:var(--buttonCounter-danger-fgColor-disabled)}.Button--danger .Counter{background-color:var(--buttonCounter-danger-bgColor-rest);color:var(--buttonCounter-danger-fgColor-rest)}.Button--iconOnly{display:inline-grid;padding:unset;place-content:center;width:var(--control-medium-size)}.Button--iconOnly.Button--small{width:var(--control-small-size)}.Button--iconOnly.Button--large{width:var(--control-large-size)}.Button--inactive:not([aria-disabled=true],:disabled){background-color:var(--button-inactive-bgColor);border:0;color:var(--button-inactive-fgColor);cursor:default}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import '@github/clipboard-copy-element';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.Counter{background-color:var(--bgColor-neutral-muted,var(--color-neutral-muted));border:var(--borderWidth-thin) solid var(--counter-borderColor);border-radius:2em;color:var(--fgColor-default);display:inline-block;font-size:var(--text-body-size-small);font-weight:var(--base-text-weight-medium);line-height:calc(var(--base-size-20) - var(--borderWidth-thin)*2);min-width:var(--base-size-20);padding:0
|
|
1
|
+
.Counter{background-color:var(--bgColor-neutral-muted,var(--color-neutral-muted));border:var(--borderWidth-thin) solid var(--counter-borderColor);border-radius:2em;color:var(--fgColor-default);display:inline-block;font-size:var(--text-body-size-small);font-weight:var(--base-text-weight-medium);line-height:calc(var(--base-size-20) - var(--borderWidth-thin)*2);min-width:var(--base-size-20);padding:0 var(--base-size-6);text-align:center}.Counter:empty{display:none}.Counter .octicon{opacity:.8;vertical-align:text-top}.Counter--primary{background-color:var(--bgColor-neutral-emphasis);color:var(--fgColor-onEmphasis)}.Counter--secondary{background-color:var(--bgColor-neutral-muted);color:var(--fgColor-muted)}
|
|
@@ -0,0 +1,20 @@
|
|
|
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
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
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 +1 @@
|
|
|
1
|
-
.Popover{position:absolute;z-index:100}.Popover-message{background-color:var(--overlay-bgColor);border:var(--borderWidth-thin) solid var(--borderColor-default);border-radius:var(--borderRadius-medium);box-shadow:var(--shadow-floating-legacy,var(--color-shadow-large))!important;margin-left:auto;margin-right:auto;position:relative;width:232px}.Popover-message:after,.Popover-message:before{content:"";display:inline-block;left:50%;position:absolute}.Popover-message:before{border:8px solid #0000;border-bottom:8px solid var(--borderColor-default);margin-left:-9px;top:-16px}.Popover-message:after{border:7px solid #0000;border-bottom:7px solid var(--overlay-bgColor);margin-left:-8px;top:-14px}.Popover-message--no-caret:after,.Popover-message--no-caret:before{display:none}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):after,:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):before{border-bottom-color:#0000;top:auto}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):before{border-top-color:var(--borderColor-default);bottom:-16px}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):after{border-top-color:var(--overlay-bgColor);bottom:-14px}.Popover-message--bottom-right,.Popover-message--top-right{margin-right:0;right:-9px}:is(.Popover-message--top-right,.Popover-message--bottom-right):after,:is(.Popover-message--top-right,.Popover-message--bottom-right):before{left:auto;margin-left:0}:is(.Popover-message--top-right,.Popover-message--bottom-right):
|
|
1
|
+
.Popover{position:absolute;z-index:100}.Popover-message{background-color:var(--overlay-bgColor);border:var(--borderWidth-thin) solid var(--borderColor-default);border-radius:var(--borderRadius-medium);box-shadow:var(--shadow-floating-legacy,var(--color-shadow-large))!important;margin-left:auto;margin-right:auto;position:relative;width:232px}.Popover-message:after,.Popover-message:before{content:"";display:inline-block;left:50%;position:absolute}.Popover-message:before{border:8px solid #0000;border-bottom:8px solid var(--borderColor-default);margin-left:-9px;top:-16px}.Popover-message:after{border:7px solid #0000;border-bottom:7px solid var(--overlay-bgColor);margin-left:-8px;top:-14px}.Popover-message--no-caret:after,.Popover-message--no-caret:before{display:none}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):after,:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):before{border-bottom-color:#0000;top:auto}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):before{border-top-color:var(--borderColor-default);bottom:-16px}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):after{border-top-color:var(--overlay-bgColor);bottom:-14px}.Popover-message--bottom-right,.Popover-message--top-right{margin-right:0;right:-9px}:is(.Popover-message--top-right,.Popover-message--bottom-right):after,:is(.Popover-message--top-right,.Popover-message--bottom-right):before{left:auto;margin-left:0}:is(.Popover-message--top-right,.Popover-message--bottom-right):after,:is(.Popover-message--top-right,.Popover-message--bottom-right):before{right:var(--base-size-20)}.Popover-message--bottom-left,.Popover-message--top-left{left:-9px;margin-left:0}:is(.Popover-message--top-left,.Popover-message--bottom-left):after,:is(.Popover-message--top-left,.Popover-message--bottom-left):before{left:var(--base-size-24);margin-left:0}:is(.Popover-message--top-left,.Popover-message--bottom-left):after{left:var(--base-size-24)}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):after,:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):before{border-bottom-color:#0000;left:auto;margin-left:0;top:50%}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):before{margin-top:-9px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):after{margin-top:-8px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom):before{border-left-color:var(--borderColor-default);right:-16px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom):after{border-left-color:var(--overlay-bgColor);right:-14px}:is(.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):before{border-right-color:var(--borderColor-default);left:-16px}:is(.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):after{border-right-color:var(--overlay-bgColor);left:-14px}:is(.Popover-message--right-top,.Popover-message--left-top):after,:is(.Popover-message--right-top,.Popover-message--left-top):before{top:var(--base-size-24)}:is(.Popover-message--right-bottom,.Popover-message--left-bottom):after,:is(.Popover-message--right-bottom,.Popover-message--left-bottom):before{top:auto}:is(.Popover-message--right-bottom,.Popover-message--left-bottom):after,:is(.Popover-message--right-bottom,.Popover-message--left-bottom):before{bottom:var(--base-size-16)}@media (min-width:544px){.Popover-message--large{min-width:320px}}@media (max-width:767.98px){.Popover{bottom:0!important;left:0!important;position:fixed;right:0!important;top:auto!important}.Popover-message{bottom:auto;left:auto;margin:var(--stack-gap-condensed);right:auto;top:auto;width:auto!important}.Popover-message>.btn-octicon{padding:var(--control-medium-paddingInline-normal)!important}.Popover-message:after,.Popover-message:before{display:none}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.Progress{background-color:var(--bgColor-neutral-muted);border-radius:
|
|
1
|
+
.Progress{background-color:var(--bgColor-neutral-muted);border-radius:var(--borderRadius-medium);display:flex;height:8px;outline:1px solid #0000;overflow:hidden}.Progress--large{height:10px}.Progress--small{height:5px}.Progress-item{outline:2px solid #0000}.Progress-item+.Progress-item{margin-left:var(--base-size-2)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import '@github/relative-time-element';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.State,.state{border-radius:2em;display:inline-block;font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-medium);line-height:var(--control-medium-lineBoxHeight);padding:
|
|
1
|
+
.State,.state{border-radius:2em;display:inline-block;font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-medium);line-height:var(--control-medium-lineBoxHeight);padding:var(--base-size-4) var(--control-medium-paddingInline-normal);text-align:center;white-space:nowrap}.State,.State--draft,.state{background-color:var(--bgColor-neutral-emphasis);border:var(--borderWidth-thin) solid #0000;box-shadow:var(--boxShadow-thin) var(--borderColor-neutral-emphasis);color:var(--fgColor-onEmphasis)}.State--open{background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin) var(--borderColor-open-emphasis)}.State--merged,.State--open{color:var(--fgColor-onEmphasis)}.State--merged{background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin) var(--borderColor-done-emphasis)}.State--closed{background-color:var(--bgColor-closed-emphasis,var(--color-closed-emphasis));box-shadow:var(--boxShadow-thin) var(--borderColor-closed-emphasis);color:var(--fgColor-onEmphasis)}.State--small{font-size:var(--text-body-size-small);line-height:var(--base-size-24);padding:0 10px}.State--small .octicon{width:1em}
|
|
@@ -0,0 +1,15 @@
|
|
|
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
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
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
|
+
}
|
|
@@ -0,0 +1,28 @@
|
|
|
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';
|
|
@@ -0,0 +1,13 @@
|
|
|
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
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
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
|
+
}
|
|
@@ -0,0 +1,44 @@
|
|
|
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
|
+
}
|
|
@@ -0,0 +1,119 @@
|
|
|
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 };
|