@f-ewald/components 1.14.1 → 1.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -0
- package/custom-elements.json +295 -3
- package/dist/icons.d.ts +1 -0
- package/dist/icons.d.ts.map +1 -1
- package/dist/icons.js +1 -0
- package/dist/icons.js.map +1 -1
- package/dist/index.d.ts +3 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +3 -1
- package/dist/index.js.map +1 -1
- package/dist/loading-dots.d.ts +28 -0
- package/dist/loading-dots.d.ts.map +1 -0
- package/dist/loading-dots.js +116 -0
- package/dist/loading-dots.js.map +1 -0
- package/dist/loading-spinner.d.ts +28 -0
- package/dist/loading-spinner.d.ts.map +1 -0
- package/dist/loading-spinner.js +109 -0
- package/dist/loading-spinner.js.map +1 -0
- package/dist/photo-gallery.d.ts +4 -0
- package/dist/photo-gallery.d.ts.map +1 -1
- package/dist/photo-gallery.js +14 -1
- package/dist/photo-gallery.js.map +1 -1
- package/dist/toast-notification.d.ts +27 -9
- package/dist/toast-notification.d.ts.map +1 -1
- package/dist/toast-notification.js +68 -17
- package/dist/toast-notification.js.map +1 -1
- package/dist/tree-view.d.ts +9 -0
- package/dist/tree-view.d.ts.map +1 -1
- package/dist/tree-view.js +66 -4
- package/dist/tree-view.js.map +1 -1
- package/docs/loading-dots.md +45 -0
- package/docs/loading-spinner.md +46 -0
- package/docs/photo-gallery.md +5 -0
- package/docs/toast-notification.md +15 -6
- package/docs/tree-view.md +7 -1
- package/llms.txt +70 -11
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -6,7 +6,7 @@ export { RevealButton } from "./reveal-button.js";
|
|
|
6
6
|
export { RomanNumeral } from "./roman-numeral.js";
|
|
7
7
|
export { ConfirmDialog } from "./confirm-dialog.js";
|
|
8
8
|
export { ContentDivider } from "./content-divider.js";
|
|
9
|
-
export { ToastNotification, notifySuccess, notifyError, notifyInfo, type ToastVariant, } from "./toast-notification.js";
|
|
9
|
+
export { ToastNotification, notifySuccess, notifyError, notifyInfo, notifyWarning, type ToastVariant, } from "./toast-notification.js";
|
|
10
10
|
export { ScrollToBottom } from "./scroll-to-bottom.js";
|
|
11
11
|
export { ScrollToTop } from "./scroll-to-top.js";
|
|
12
12
|
export { SlidePanel } from "./slide-panel.js";
|
|
@@ -31,6 +31,8 @@ export { StatusPill, type StatusPillColor } from "./status-pill.js";
|
|
|
31
31
|
export { EditableText } from "./editable-text.js";
|
|
32
32
|
export { LiveTimer } from "./live-timer.js";
|
|
33
33
|
export { LoadMore } from "./load-more.js";
|
|
34
|
+
export { LoadingSpinner } from "./loading-spinner.js";
|
|
35
|
+
export { LoadingDots } from "./loading-dots.js";
|
|
34
36
|
export { ChatMessage, type ChatMessageRole, type ChatMessageVariant, } from "./chat-message.js";
|
|
35
37
|
export { UiCheckbox } from "./ui-checkbox.js";
|
|
36
38
|
export { FormField } from "./form-field.js";
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -6,7 +6,7 @@ export { RevealButton } from "./reveal-button.js";
|
|
|
6
6
|
export { RomanNumeral } from "./roman-numeral.js";
|
|
7
7
|
export { ConfirmDialog } from "./confirm-dialog.js";
|
|
8
8
|
export { ContentDivider } from "./content-divider.js";
|
|
9
|
-
export { ToastNotification, notifySuccess, notifyError, notifyInfo, } from "./toast-notification.js";
|
|
9
|
+
export { ToastNotification, notifySuccess, notifyError, notifyInfo, notifyWarning, } from "./toast-notification.js";
|
|
10
10
|
export { ScrollToBottom } from "./scroll-to-bottom.js";
|
|
11
11
|
export { ScrollToTop } from "./scroll-to-top.js";
|
|
12
12
|
export { SlidePanel } from "./slide-panel.js";
|
|
@@ -31,6 +31,8 @@ export { StatusPill } from "./status-pill.js";
|
|
|
31
31
|
export { EditableText } from "./editable-text.js";
|
|
32
32
|
export { LiveTimer } from "./live-timer.js";
|
|
33
33
|
export { LoadMore } from "./load-more.js";
|
|
34
|
+
export { LoadingSpinner } from "./loading-spinner.js";
|
|
35
|
+
export { LoadingDots } from "./loading-dots.js";
|
|
34
36
|
export { ChatMessage, } from "./chat-message.js";
|
|
35
37
|
export { UiCheckbox } from "./ui-checkbox.js";
|
|
36
38
|
export { FormField } from "./form-field.js";
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EACL,YAAY,GAIb,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EACL,iBAAiB,EACjB,aAAa,EACb,WAAW,EACX,UAAU,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EACL,YAAY,GAIb,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EACL,iBAAiB,EACjB,aAAa,EACb,WAAW,EACX,UAAU,EACV,aAAa,GAEd,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AACjD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,iBAAiB,EAAmB,MAAM,0BAA0B,CAAC;AAC9E,OAAO,EAAE,iBAAiB,EAA0B,MAAM,yBAAyB,CAAC;AACpF,OAAO,EAAE,eAAe,EAAwB,MAAM,wBAAwB,CAAC;AAC/E,OAAO,EAAE,cAAc,EAAsB,MAAM,uBAAuB,CAAC;AAC3E,OAAO,EACL,mBAAmB,GAEpB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACL,iBAAiB,GAElB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAwB,MAAM,kBAAkB,CAAC;AACpE,OAAO,EAAE,UAAU,EAAwB,MAAM,kBAAkB,CAAC;AACpE,OAAO,EAAE,WAAW,EAA0B,MAAM,mBAAmB,CAAC;AACxE,OAAO,EAAE,QAAQ,EAAsB,MAAM,gBAAgB,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAwB,MAAM,kBAAkB,CAAC;AACpE,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EACL,WAAW,GAGZ,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAqB,MAAM,kBAAkB,CAAC;AACjE,OAAO,EACL,WAAW,GAGZ,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,SAAS,EAAwB,MAAM,iBAAiB,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAiB,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,cAAc,EAAuB,MAAM,sBAAsB,CAAC;AAC3E,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAoB,MAAM,eAAe,CAAC;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAA4B,MAAM,gBAAgB,CAAC;AACpE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAyB,MAAM,qBAAqB,CAAC;AAC3E,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EACL,WAAW,GAKZ,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAuB,MAAM,gBAAgB,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAuB,MAAM,qBAAqB,CAAC;AAC1E,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AACnE,cAAc,YAAY,CAAC","sourcesContent":["export { AnimateConfetti } from \"./animate-confetti.js\";\nexport { GalleryItem } from \"./gallery-item.js\";\nexport { GalleryItemVariant } from \"./gallery-item-variant.js\";\nexport {\n PhotoGallery,\n type PhotoGalleryChangeReason,\n type PhotoGalleryObjectFit,\n type PhotoGallerySlideChangeDetail,\n} from \"./photo-gallery.js\";\nexport { RevealButton } from \"./reveal-button.js\";\nexport { RomanNumeral } from \"./roman-numeral.js\";\nexport { ConfirmDialog } from \"./confirm-dialog.js\";\nexport { ContentDivider } from \"./content-divider.js\";\nexport {\n ToastNotification,\n notifySuccess,\n notifyError,\n notifyInfo,\n notifyWarning,\n type ToastVariant,\n} from \"./toast-notification.js\";\nexport { ScrollToBottom } from \"./scroll-to-bottom.js\";\nexport { ScrollToTop } from \"./scroll-to-top.js\";\nexport { SlidePanel } from \"./slide-panel.js\";\nexport { CopyLinkButton } from \"./copy-link-button.js\";\nexport { RelativeTime } from \"./relative-time.js\";\nexport { DistanceValue } from \"./distance-value.js\";\nexport { PriceHistoryChart, type PricePoint } from \"./price-history-chart.js\";\nexport { DistributionChart, type DistributionValue } from \"./distribution-chart.js\";\nexport { PercentBarChart, type PercentBarGroup } from \"./percent-bar-chart.js\";\nexport { WeightBarChart, type WeightBarItem } from \"./weight-bar-chart.js\";\nexport {\n AddressAutocomplete,\n type AddressSuggestion,\n} from \"./address-autocomplete.js\";\nexport {\n AutocompleteInput,\n type AutocompleteOption,\n} from \"./autocomplete-input.js\";\nexport { UserAvatar } from \"./user-avatar.js\";\nexport { MapPin } from \"./map-pin.js\";\nexport { MapCircle } from \"./map-circle.js\";\nexport { RadioCards, type RadioCardOption } from \"./radio-cards.js\";\nexport { RadioPills, type RadioPillOption } from \"./radio-pills.js\";\nexport { ButtonGroup, type ButtonGroupOption } from \"./button-group.js\";\nexport { UiButton, type ButtonVariant } from \"./ui-button.js\";\nexport { StatMeter } from \"./stat-meter.js\";\nexport { StatusPill, type StatusPillColor } from \"./status-pill.js\";\nexport { EditableText } from \"./editable-text.js\";\nexport { LiveTimer } from \"./live-timer.js\";\nexport { LoadMore } from \"./load-more.js\";\nexport { LoadingSpinner } from \"./loading-spinner.js\";\nexport { LoadingDots } from \"./loading-dots.js\";\nexport {\n ChatMessage,\n type ChatMessageRole,\n type ChatMessageVariant,\n} from \"./chat-message.js\";\nexport { UiCheckbox } from \"./ui-checkbox.js\";\nexport { FormField } from \"./form-field.js\";\nexport { FormSelect, type SelectOption } from \"./form-select.js\";\nexport {\n MultiSelect,\n type MultiSelectOption,\n type MultiSelectVariant,\n} from \"./multi-select.js\";\nexport { DataTable, type DataTableColumn } from \"./data-table.js\";\nexport { TileGrid } from \"./tile-grid.js\";\nexport { TreeView, type TreeNode } from \"./tree-view.js\";\nexport { PopoverPanel } from \"./popover-panel.js\";\nexport { DropdownButton, type DropdownOption } from \"./dropdown-button.js\";\nexport { IconButton } from \"./icon-button.js\";\nexport { KbdHint, type KbdPlatform } from \"./kbd-hint.js\";\nexport { FrameBox } from \"./frame-box.js\";\nexport { AppShell, type SidebarToggleDetail } from \"./app-shell.js\";\nexport { AppSidebar } from \"./app-sidebar.js\";\nexport { ActionBar } from \"./action-bar.js\";\nexport { PageHeader } from \"./page-header.js\";\nexport { PaginationNav, type PageChangeDetail } from \"./pagination-nav.js\";\nexport { FormActions } from \"./form-actions.js\";\nexport { TimelineContainer } from \"./timeline-container.js\";\nexport { TimelineEntry } from \"./timeline-entry.js\";\nexport { CalendarEntry } from \"./calendar-entry.js\";\nexport { CalendarMonth } from \"./calendar-month.js\";\nexport { CalendarYear } from \"./calendar-year.js\";\nexport {\n KanbanBoard,\n type KanbanCardData,\n type KanbanColumnData,\n type KanbanCardMoveDetail,\n type KanbanCardOpenDetail,\n} from \"./kanban-board.js\";\nexport { KanbanColumn } from \"./kanban-column.js\";\nexport { KanbanCard } from \"./kanban-card.js\";\nexport { TextArea } from \"./text-area.js\";\nexport { LinkCard, type LinkCardStatus } from \"./link-card.js\";\nexport { CardGrid } from \"./card-grid.js\";\nexport { MarkdownView } from \"./markdown-view.js\";\nexport { AutoScroll } from \"./auto-scroll.js\";\nexport { formatDuration, type DurationFormat } from \"./utils/duration.js\";\nexport { tokens, tokenValues, darkTokenValues } from \"./tokens.js\";\nexport * from \"./icons.js\";\n"]}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { LitElement, type PropertyValues } from "lit";
|
|
2
|
+
/**
|
|
3
|
+
* Three dots that bounce one after another as a lightweight, indeterminate
|
|
4
|
+
* "working" / "typing" indicator. Purely presentational and property-driven —
|
|
5
|
+
* show it while a short operation is pending and remove it when done.
|
|
6
|
+
*
|
|
7
|
+
* Exposes an accessible `role="status"` with `label` as its name, so assistive
|
|
8
|
+
* technology announces the loading state; the dots themselves are decorative.
|
|
9
|
+
* Under `prefers-reduced-motion` the bounce is removed and the dots rest.
|
|
10
|
+
*
|
|
11
|
+
* @element loading-dots
|
|
12
|
+
*/
|
|
13
|
+
export declare class LoadingDots extends LitElement {
|
|
14
|
+
static styles: import("lit").CSSResult[];
|
|
15
|
+
/** Dot-size step — `sm`, `md` (default), or `lg`. */
|
|
16
|
+
size: "sm" | "md" | "lg";
|
|
17
|
+
/** Accessible name announced by the `role="status"` live region. */
|
|
18
|
+
label: string;
|
|
19
|
+
connectedCallback(): void;
|
|
20
|
+
protected updated(changed: PropertyValues): void;
|
|
21
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
22
|
+
}
|
|
23
|
+
declare global {
|
|
24
|
+
interface HTMLElementTagNameMap {
|
|
25
|
+
"loading-dots": LoadingDots;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
//# sourceMappingURL=loading-dots.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"loading-dots.d.ts","sourceRoot":"","sources":["../src/loading-dots.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAIjE;;;;;;;;;;GAUG;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC,OAAgB,MAAM,4BAyDpB;IAEF,qDAAqD;IACzC,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAC5C,oEAAoE;IACxD,KAAK,SAAa;IAErB,iBAAiB,IAAI,IAAI,CAGjC;IAED,UAAmB,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,CAExD;IAEQ,MAAM,yCAQd;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF"}
|
|
@@ -0,0 +1,116 @@
|
|
|
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
|
+
import { LitElement, css, html } from "lit";
|
|
8
|
+
import { customElement, property } from "lit/decorators.js";
|
|
9
|
+
import { tokens } from "./tokens.js";
|
|
10
|
+
/**
|
|
11
|
+
* Three dots that bounce one after another as a lightweight, indeterminate
|
|
12
|
+
* "working" / "typing" indicator. Purely presentational and property-driven —
|
|
13
|
+
* show it while a short operation is pending and remove it when done.
|
|
14
|
+
*
|
|
15
|
+
* Exposes an accessible `role="status"` with `label` as its name, so assistive
|
|
16
|
+
* technology announces the loading state; the dots themselves are decorative.
|
|
17
|
+
* Under `prefers-reduced-motion` the bounce is removed and the dots rest.
|
|
18
|
+
*
|
|
19
|
+
* @element loading-dots
|
|
20
|
+
*/
|
|
21
|
+
let LoadingDots = class LoadingDots extends LitElement {
|
|
22
|
+
constructor() {
|
|
23
|
+
super(...arguments);
|
|
24
|
+
/** Dot-size step — `sm`, `md` (default), or `lg`. */
|
|
25
|
+
this.size = "md";
|
|
26
|
+
/** Accessible name announced by the `role="status"` live region. */
|
|
27
|
+
this.label = "Loading";
|
|
28
|
+
}
|
|
29
|
+
static { this.styles = [
|
|
30
|
+
tokens,
|
|
31
|
+
css `
|
|
32
|
+
:host {
|
|
33
|
+
display: inline-flex;
|
|
34
|
+
line-height: var(--ui-line-height-glyph, 1);
|
|
35
|
+
}
|
|
36
|
+
.dots {
|
|
37
|
+
display: inline-flex;
|
|
38
|
+
align-items: flex-end;
|
|
39
|
+
gap: 0.25rem;
|
|
40
|
+
}
|
|
41
|
+
.dot {
|
|
42
|
+
width: 0.5rem;
|
|
43
|
+
height: 0.5rem;
|
|
44
|
+
border-radius: 999px;
|
|
45
|
+
background: var(--ui-primary, #4f46e5);
|
|
46
|
+
animation: loading-dots-bounce 1.4s ease-in-out infinite;
|
|
47
|
+
}
|
|
48
|
+
.dot:nth-child(2) {
|
|
49
|
+
animation-delay: 0.16s;
|
|
50
|
+
}
|
|
51
|
+
.dot:nth-child(3) {
|
|
52
|
+
animation-delay: 0.32s;
|
|
53
|
+
}
|
|
54
|
+
.dots.sm .dot {
|
|
55
|
+
width: 0.375rem;
|
|
56
|
+
height: 0.375rem;
|
|
57
|
+
}
|
|
58
|
+
.dots.lg .dot {
|
|
59
|
+
width: 0.625rem;
|
|
60
|
+
height: 0.625rem;
|
|
61
|
+
}
|
|
62
|
+
@keyframes loading-dots-bounce {
|
|
63
|
+
0%,
|
|
64
|
+
80%,
|
|
65
|
+
100% {
|
|
66
|
+
transform: translateY(0);
|
|
67
|
+
opacity: 0.5;
|
|
68
|
+
}
|
|
69
|
+
40% {
|
|
70
|
+
transform: translateY(-0.375rem);
|
|
71
|
+
opacity: 1;
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
@media (prefers-reduced-motion: reduce) {
|
|
75
|
+
.dot {
|
|
76
|
+
animation: none;
|
|
77
|
+
opacity: 1;
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
@media (forced-colors: active) {
|
|
81
|
+
.dot {
|
|
82
|
+
background: CanvasText;
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
`,
|
|
86
|
+
]; }
|
|
87
|
+
connectedCallback() {
|
|
88
|
+
super.connectedCallback();
|
|
89
|
+
if (!this.hasAttribute("role"))
|
|
90
|
+
this.setAttribute("role", "status");
|
|
91
|
+
}
|
|
92
|
+
updated(changed) {
|
|
93
|
+
if (changed.has("label"))
|
|
94
|
+
this.setAttribute("aria-label", this.label);
|
|
95
|
+
}
|
|
96
|
+
render() {
|
|
97
|
+
return html `
|
|
98
|
+
<span class="dots ${this.size}" aria-hidden="true">
|
|
99
|
+
<span class="dot"></span>
|
|
100
|
+
<span class="dot"></span>
|
|
101
|
+
<span class="dot"></span>
|
|
102
|
+
</span>
|
|
103
|
+
`;
|
|
104
|
+
}
|
|
105
|
+
};
|
|
106
|
+
__decorate([
|
|
107
|
+
property()
|
|
108
|
+
], LoadingDots.prototype, "size", void 0);
|
|
109
|
+
__decorate([
|
|
110
|
+
property()
|
|
111
|
+
], LoadingDots.prototype, "label", void 0);
|
|
112
|
+
LoadingDots = __decorate([
|
|
113
|
+
customElement("loading-dots")
|
|
114
|
+
], LoadingDots);
|
|
115
|
+
export { LoadingDots };
|
|
116
|
+
//# sourceMappingURL=loading-dots.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"loading-dots.js","sourceRoot":"","sources":["../src/loading-dots.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,IAAI,EAAuB,MAAM,KAAK,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC;;;;;;;;;;GAUG;AAEI,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAApC;;QA4DL,qDAAqD;QACzC,SAAI,GAAuB,IAAI,CAAC;QAC5C,oEAAoE;QACxD,UAAK,GAAG,SAAS,CAAC;IAoBhC,CAAC;aAlFiB,WAAM,GAAG;QACvB,MAAM;QACN,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAsDF;KACF,AAzDqB,CAyDpB;IAOO,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;YAAE,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IACtE,CAAC;IAEkB,OAAO,CAAC,OAAuB;QAChD,IAAI,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC;YAAE,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IACxE,CAAC;IAEQ,MAAM;QACb,OAAO,IAAI,CAAA;0BACW,IAAI,CAAC,IAAI;;;;;KAK9B,CAAC;IACJ,CAAC;CACF,CAAA;AAtBa;IAAX,QAAQ,EAAE;yCAAiC;AAEhC;IAAX,QAAQ,EAAE;0CAAmB;AA/DnB,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CAmFvB","sourcesContent":["import { LitElement, css, html, type PropertyValues } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport { tokens } from \"./tokens.js\";\n\n/**\n * Three dots that bounce one after another as a lightweight, indeterminate\n * \"working\" / \"typing\" indicator. Purely presentational and property-driven —\n * show it while a short operation is pending and remove it when done.\n *\n * Exposes an accessible `role=\"status\"` with `label` as its name, so assistive\n * technology announces the loading state; the dots themselves are decorative.\n * Under `prefers-reduced-motion` the bounce is removed and the dots rest.\n *\n * @element loading-dots\n */\n@customElement(\"loading-dots\")\nexport class LoadingDots extends LitElement {\n static override styles = [\n tokens,\n css`\n :host {\n display: inline-flex;\n line-height: var(--ui-line-height-glyph, 1);\n }\n .dots {\n display: inline-flex;\n align-items: flex-end;\n gap: 0.25rem;\n }\n .dot {\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 999px;\n background: var(--ui-primary, #4f46e5);\n animation: loading-dots-bounce 1.4s ease-in-out infinite;\n }\n .dot:nth-child(2) {\n animation-delay: 0.16s;\n }\n .dot:nth-child(3) {\n animation-delay: 0.32s;\n }\n .dots.sm .dot {\n width: 0.375rem;\n height: 0.375rem;\n }\n .dots.lg .dot {\n width: 0.625rem;\n height: 0.625rem;\n }\n @keyframes loading-dots-bounce {\n 0%,\n 80%,\n 100% {\n transform: translateY(0);\n opacity: 0.5;\n }\n 40% {\n transform: translateY(-0.375rem);\n opacity: 1;\n }\n }\n @media (prefers-reduced-motion: reduce) {\n .dot {\n animation: none;\n opacity: 1;\n }\n }\n @media (forced-colors: active) {\n .dot {\n background: CanvasText;\n }\n }\n `,\n ];\n\n /** Dot-size step — `sm`, `md` (default), or `lg`. */\n @property() size: \"sm\" | \"md\" | \"lg\" = \"md\";\n /** Accessible name announced by the `role=\"status\"` live region. */\n @property() label = \"Loading\";\n\n override connectedCallback(): void {\n super.connectedCallback();\n if (!this.hasAttribute(\"role\")) this.setAttribute(\"role\", \"status\");\n }\n\n protected override updated(changed: PropertyValues): void {\n if (changed.has(\"label\")) this.setAttribute(\"aria-label\", this.label);\n }\n\n override render() {\n return html`\n <span class=\"dots ${this.size}\" aria-hidden=\"true\">\n <span class=\"dot\"></span>\n <span class=\"dot\"></span>\n <span class=\"dot\"></span>\n </span>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"loading-dots\": LoadingDots;\n }\n}\n"]}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { LitElement, type PropertyValues } from "lit";
|
|
2
|
+
/**
|
|
3
|
+
* Indeterminate circular loading spinner: a rotating arc over a faint track,
|
|
4
|
+
* in the style of a browser page-load indicator. Purely presentational and
|
|
5
|
+
* property-driven — show it while work is in flight and remove it when done.
|
|
6
|
+
*
|
|
7
|
+
* Exposes an accessible `role="status"` with `label` as its name, so assistive
|
|
8
|
+
* technology announces the loading state; the arc itself is decorative. Under
|
|
9
|
+
* `prefers-reduced-motion` it stops rotating and stays a static ring.
|
|
10
|
+
*
|
|
11
|
+
* @element loading-spinner
|
|
12
|
+
*/
|
|
13
|
+
export declare class LoadingSpinner extends LitElement {
|
|
14
|
+
static styles: import("lit").CSSResult[];
|
|
15
|
+
/** Diameter step — `sm` ≈ 1rem, `md` ≈ 1.5rem (default), `lg` ≈ 2rem. */
|
|
16
|
+
size: "sm" | "md" | "lg";
|
|
17
|
+
/** Accessible name announced by the `role="status"` live region. */
|
|
18
|
+
label: string;
|
|
19
|
+
connectedCallback(): void;
|
|
20
|
+
protected updated(changed: PropertyValues): void;
|
|
21
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
22
|
+
}
|
|
23
|
+
declare global {
|
|
24
|
+
interface HTMLElementTagNameMap {
|
|
25
|
+
"loading-spinner": LoadingSpinner;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
//# sourceMappingURL=loading-spinner.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"loading-spinner.d.ts","sourceRoot":"","sources":["../src/loading-spinner.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAIjE;;;;;;;;;;GAUG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC5C,OAAgB,MAAM,4BAmDpB;IAEF,yEAAyE;IAC7D,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAC5C,oEAAoE;IACxD,KAAK,SAAa;IAErB,iBAAiB,IAAI,IAAI,CAGjC;IAED,UAAmB,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,CAExD;IAEQ,MAAM,yCAOd;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,cAAc,CAAC;KACnC;CACF"}
|
|
@@ -0,0 +1,109 @@
|
|
|
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
|
+
import { LitElement, css, html } from "lit";
|
|
8
|
+
import { customElement, property } from "lit/decorators.js";
|
|
9
|
+
import { tokens } from "./tokens.js";
|
|
10
|
+
/**
|
|
11
|
+
* Indeterminate circular loading spinner: a rotating arc over a faint track,
|
|
12
|
+
* in the style of a browser page-load indicator. Purely presentational and
|
|
13
|
+
* property-driven — show it while work is in flight and remove it when done.
|
|
14
|
+
*
|
|
15
|
+
* Exposes an accessible `role="status"` with `label` as its name, so assistive
|
|
16
|
+
* technology announces the loading state; the arc itself is decorative. Under
|
|
17
|
+
* `prefers-reduced-motion` it stops rotating and stays a static ring.
|
|
18
|
+
*
|
|
19
|
+
* @element loading-spinner
|
|
20
|
+
*/
|
|
21
|
+
let LoadingSpinner = class LoadingSpinner extends LitElement {
|
|
22
|
+
constructor() {
|
|
23
|
+
super(...arguments);
|
|
24
|
+
/** Diameter step — `sm` ≈ 1rem, `md` ≈ 1.5rem (default), `lg` ≈ 2rem. */
|
|
25
|
+
this.size = "md";
|
|
26
|
+
/** Accessible name announced by the `role="status"` live region. */
|
|
27
|
+
this.label = "Loading";
|
|
28
|
+
}
|
|
29
|
+
static { this.styles = [
|
|
30
|
+
tokens,
|
|
31
|
+
css `
|
|
32
|
+
:host {
|
|
33
|
+
display: inline-flex;
|
|
34
|
+
line-height: var(--ui-line-height-glyph, 1);
|
|
35
|
+
}
|
|
36
|
+
.spinner {
|
|
37
|
+
width: 1.5rem;
|
|
38
|
+
height: 1.5rem;
|
|
39
|
+
animation: spin 0.8s linear infinite;
|
|
40
|
+
}
|
|
41
|
+
.spinner.sm {
|
|
42
|
+
width: 1rem;
|
|
43
|
+
height: 1rem;
|
|
44
|
+
}
|
|
45
|
+
.spinner.lg {
|
|
46
|
+
width: 2rem;
|
|
47
|
+
height: 2rem;
|
|
48
|
+
}
|
|
49
|
+
.track {
|
|
50
|
+
fill: none;
|
|
51
|
+
stroke: var(--ui-border, #e2e8f0);
|
|
52
|
+
stroke-width: 3;
|
|
53
|
+
}
|
|
54
|
+
.arc {
|
|
55
|
+
fill: none;
|
|
56
|
+
stroke: var(--ui-primary, #4f46e5);
|
|
57
|
+
stroke-width: 3;
|
|
58
|
+
stroke-linecap: round;
|
|
59
|
+
stroke-dasharray: 42 100;
|
|
60
|
+
}
|
|
61
|
+
@keyframes spin {
|
|
62
|
+
to {
|
|
63
|
+
transform: rotate(360deg);
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
@media (prefers-reduced-motion: reduce) {
|
|
67
|
+
.spinner {
|
|
68
|
+
animation: none;
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
@media (forced-colors: active) {
|
|
72
|
+
.track {
|
|
73
|
+
stroke: GrayText;
|
|
74
|
+
}
|
|
75
|
+
.arc {
|
|
76
|
+
stroke: CanvasText;
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
`,
|
|
80
|
+
]; }
|
|
81
|
+
connectedCallback() {
|
|
82
|
+
super.connectedCallback();
|
|
83
|
+
if (!this.hasAttribute("role"))
|
|
84
|
+
this.setAttribute("role", "status");
|
|
85
|
+
}
|
|
86
|
+
updated(changed) {
|
|
87
|
+
if (changed.has("label"))
|
|
88
|
+
this.setAttribute("aria-label", this.label);
|
|
89
|
+
}
|
|
90
|
+
render() {
|
|
91
|
+
return html `
|
|
92
|
+
<svg class="spinner ${this.size}" viewBox="0 0 24 24" aria-hidden="true">
|
|
93
|
+
<circle class="track" cx="12" cy="12" r="9"></circle>
|
|
94
|
+
<circle class="arc" cx="12" cy="12" r="9"></circle>
|
|
95
|
+
</svg>
|
|
96
|
+
`;
|
|
97
|
+
}
|
|
98
|
+
};
|
|
99
|
+
__decorate([
|
|
100
|
+
property()
|
|
101
|
+
], LoadingSpinner.prototype, "size", void 0);
|
|
102
|
+
__decorate([
|
|
103
|
+
property()
|
|
104
|
+
], LoadingSpinner.prototype, "label", void 0);
|
|
105
|
+
LoadingSpinner = __decorate([
|
|
106
|
+
customElement("loading-spinner")
|
|
107
|
+
], LoadingSpinner);
|
|
108
|
+
export { LoadingSpinner };
|
|
109
|
+
//# sourceMappingURL=loading-spinner.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"loading-spinner.js","sourceRoot":"","sources":["../src/loading-spinner.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,IAAI,EAAuB,MAAM,KAAK,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC;;;;;;;;;;GAUG;AAEI,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,UAAU;IAAvC;;QAsDL,yEAAyE;QAC7D,SAAI,GAAuB,IAAI,CAAC;QAC5C,oEAAoE;QACxD,UAAK,GAAG,SAAS,CAAC;IAmBhC,CAAC;aA3EiB,WAAM,GAAG;QACvB,MAAM;QACN,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAgDF;KACF,AAnDqB,CAmDpB;IAOO,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;YAAE,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IACtE,CAAC;IAEkB,OAAO,CAAC,OAAuB;QAChD,IAAI,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC;YAAE,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IACxE,CAAC;IAEQ,MAAM;QACb,OAAO,IAAI,CAAA;4BACa,IAAI,CAAC,IAAI;;;;KAIhC,CAAC;IACJ,CAAC;CACF,CAAA;AArBa;IAAX,QAAQ,EAAE;4CAAiC;AAEhC;IAAX,QAAQ,EAAE;6CAAmB;AAzDnB,cAAc;IAD1B,aAAa,CAAC,iBAAiB,CAAC;GACpB,cAAc,CA4E1B","sourcesContent":["import { LitElement, css, html, type PropertyValues } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport { tokens } from \"./tokens.js\";\n\n/**\n * Indeterminate circular loading spinner: a rotating arc over a faint track,\n * in the style of a browser page-load indicator. Purely presentational and\n * property-driven — show it while work is in flight and remove it when done.\n *\n * Exposes an accessible `role=\"status\"` with `label` as its name, so assistive\n * technology announces the loading state; the arc itself is decorative. Under\n * `prefers-reduced-motion` it stops rotating and stays a static ring.\n *\n * @element loading-spinner\n */\n@customElement(\"loading-spinner\")\nexport class LoadingSpinner extends LitElement {\n static override styles = [\n tokens,\n css`\n :host {\n display: inline-flex;\n line-height: var(--ui-line-height-glyph, 1);\n }\n .spinner {\n width: 1.5rem;\n height: 1.5rem;\n animation: spin 0.8s linear infinite;\n }\n .spinner.sm {\n width: 1rem;\n height: 1rem;\n }\n .spinner.lg {\n width: 2rem;\n height: 2rem;\n }\n .track {\n fill: none;\n stroke: var(--ui-border, #e2e8f0);\n stroke-width: 3;\n }\n .arc {\n fill: none;\n stroke: var(--ui-primary, #4f46e5);\n stroke-width: 3;\n stroke-linecap: round;\n stroke-dasharray: 42 100;\n }\n @keyframes spin {\n to {\n transform: rotate(360deg);\n }\n }\n @media (prefers-reduced-motion: reduce) {\n .spinner {\n animation: none;\n }\n }\n @media (forced-colors: active) {\n .track {\n stroke: GrayText;\n }\n .arc {\n stroke: CanvasText;\n }\n }\n `,\n ];\n\n /** Diameter step — `sm` ≈ 1rem, `md` ≈ 1.5rem (default), `lg` ≈ 2rem. */\n @property() size: \"sm\" | \"md\" | \"lg\" = \"md\";\n /** Accessible name announced by the `role=\"status\"` live region. */\n @property() label = \"Loading\";\n\n override connectedCallback(): void {\n super.connectedCallback();\n if (!this.hasAttribute(\"role\")) this.setAttribute(\"role\", \"status\");\n }\n\n protected override updated(changed: PropertyValues): void {\n if (changed.has(\"label\")) this.setAttribute(\"aria-label\", this.label);\n }\n\n override render() {\n return html`\n <svg class=\"spinner ${this.size}\" viewBox=\"0 0 24 24\" aria-hidden=\"true\">\n <circle class=\"track\" cx=\"12\" cy=\"12\" r=\"9\"></circle>\n <circle class=\"arc\" cx=\"12\" cy=\"12\" r=\"9\"></circle>\n </svg>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"loading-spinner\": LoadingSpinner;\n }\n}\n"]}
|
package/dist/photo-gallery.d.ts
CHANGED
|
@@ -12,6 +12,10 @@ export interface PhotoGallerySlideChangeDetail {
|
|
|
12
12
|
* Responsive, accessible image carousel composed from declarative
|
|
13
13
|
* `gallery-item` children.
|
|
14
14
|
*
|
|
15
|
+
* The image viewport keeps a fixed `aspect-ratio`, and the caption row is
|
|
16
|
+
* reserved for every slide whenever any slide has a caption, so the carousel's
|
|
17
|
+
* total height stays constant as it cycles — it never shifts the page below it.
|
|
18
|
+
*
|
|
15
19
|
* @element photo-gallery
|
|
16
20
|
* @slot - `gallery-item` elements rendered as slides.
|
|
17
21
|
* @fires slide-change - The active image changed.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"photo-gallery.d.ts","sourceRoot":"","sources":["../src/photo-gallery.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAK1E,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIhD,MAAM,MAAM,qBAAqB,GAAG,OAAO,GAAG,SAAS,CAAC;AACxD,MAAM,MAAM,wBAAwB,GAChC,UAAU,GACV,WAAW,GACX,OAAO,GACP,UAAU,GACV,MAAM,GACN,UAAU,GACV,cAAc,GACd,OAAO,CAAC;AAEZ,MAAM,WAAW,6BAA6B;IAC5C,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,WAAW,CAAC;IAClB,MAAM,EAAE,wBAAwB,CAAC;CAClC;AAUD
|
|
1
|
+
{"version":3,"file":"photo-gallery.d.ts","sourceRoot":"","sources":["../src/photo-gallery.ts"],"names":[],"mappings":"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"}
|
package/dist/photo-gallery.js
CHANGED
|
@@ -21,6 +21,10 @@ const booleanAttribute = {
|
|
|
21
21
|
* Responsive, accessible image carousel composed from declarative
|
|
22
22
|
* `gallery-item` children.
|
|
23
23
|
*
|
|
24
|
+
* The image viewport keeps a fixed `aspect-ratio`, and the caption row is
|
|
25
|
+
* reserved for every slide whenever any slide has a caption, so the carousel's
|
|
26
|
+
* total height stays constant as it cycles — it never shifts the page below it.
|
|
27
|
+
*
|
|
24
28
|
* @element photo-gallery
|
|
25
29
|
* @slot - `gallery-item` elements rendered as slides.
|
|
26
30
|
* @fires slide-change - The active image changed.
|
|
@@ -165,6 +169,8 @@ let PhotoGallery = class PhotoGallery extends LitElement {
|
|
|
165
169
|
}
|
|
166
170
|
figcaption {
|
|
167
171
|
padding: 0.5rem 0.25rem 0;
|
|
172
|
+
min-height: 1lh;
|
|
173
|
+
line-height: var(--ui-line-height-normal, 1.5);
|
|
168
174
|
color: var(--ui-text-muted, #64748b);
|
|
169
175
|
}
|
|
170
176
|
.footer {
|
|
@@ -543,6 +549,11 @@ let PhotoGallery = class PhotoGallery extends LitElement {
|
|
|
543
549
|
render() {
|
|
544
550
|
const itemCount = this._galleryItems.length;
|
|
545
551
|
const currentItem = this._galleryItems[this.currentIndex];
|
|
552
|
+
// Reserve the caption row for every slide as soon as any slide has a
|
|
553
|
+
// caption, so the gallery's total height stays constant while it cycles
|
|
554
|
+
// (a slide without a caption no longer collapses the box and shifts the
|
|
555
|
+
// page below it).
|
|
556
|
+
const hasCaptions = this._galleryItems.some((item) => item.caption);
|
|
546
557
|
const objectFit = this.objectFit === "contain" ? "contain" : "cover";
|
|
547
558
|
const viewportStyles = {
|
|
548
559
|
"--photo-gallery-aspect-ratio": this.aspectRatio.trim() || "16 / 9",
|
|
@@ -600,7 +611,9 @@ let PhotoGallery = class PhotoGallery extends LitElement {
|
|
|
600
611
|
`
|
|
601
612
|
: nothing}
|
|
602
613
|
</div>
|
|
603
|
-
${
|
|
614
|
+
${hasCaptions
|
|
615
|
+
? html `<figcaption>${currentItem.caption}</figcaption>`
|
|
616
|
+
: nothing}
|
|
604
617
|
</figure>
|
|
605
618
|
${this._renderFooter(itemCount)}
|
|
606
619
|
`
|