@f-ewald/components 1.20.0 → 1.21.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -0
- package/custom-elements.json +94 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/status-banner.d.ts +35 -0
- package/dist/status-banner.d.ts.map +1 -0
- package/dist/status-banner.js +134 -0
- package/dist/status-banner.js.map +1 -0
- package/docs/status-banner.md +55 -0
- package/llms.txt +27 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -103,6 +103,7 @@ import "@f-ewald/components/roman-numeral.js";
|
|
|
103
103
|
| `<slide-panel>` | [API reference](https://f-ewald.github.io/components/docs/slide-panel.html) |
|
|
104
104
|
| `<split-hero>` | [API reference](https://f-ewald.github.io/components/docs/split-hero.html) |
|
|
105
105
|
| `<stat-meter>` | [API reference](https://f-ewald.github.io/components/docs/stat-meter.html) |
|
|
106
|
+
| `<status-banner>` | [API reference](https://f-ewald.github.io/components/docs/status-banner.html) |
|
|
106
107
|
| `<status-pill>` | [API reference](https://f-ewald.github.io/components/docs/status-pill.html) |
|
|
107
108
|
| `<tab-bar>` | [API reference](https://f-ewald.github.io/components/docs/tab-bar.html) |
|
|
108
109
|
| `<tab-item>` | [API reference](https://f-ewald.github.io/components/docs/tab-item.html) |
|
package/custom-elements.json
CHANGED
|
@@ -6793,6 +6793,22 @@
|
|
|
6793
6793
|
"module": "./stat-meter.js"
|
|
6794
6794
|
}
|
|
6795
6795
|
},
|
|
6796
|
+
{
|
|
6797
|
+
"kind": "js",
|
|
6798
|
+
"name": "StatusBanner",
|
|
6799
|
+
"declaration": {
|
|
6800
|
+
"name": "StatusBanner",
|
|
6801
|
+
"module": "./status-banner.js"
|
|
6802
|
+
}
|
|
6803
|
+
},
|
|
6804
|
+
{
|
|
6805
|
+
"kind": "js",
|
|
6806
|
+
"name": "StatusBannerVariant",
|
|
6807
|
+
"declaration": {
|
|
6808
|
+
"name": "StatusBannerVariant",
|
|
6809
|
+
"module": "./status-banner.js"
|
|
6810
|
+
}
|
|
6811
|
+
},
|
|
6796
6812
|
{
|
|
6797
6813
|
"kind": "js",
|
|
6798
6814
|
"name": "StatusPill",
|
|
@@ -13435,6 +13451,84 @@
|
|
|
13435
13451
|
}
|
|
13436
13452
|
]
|
|
13437
13453
|
},
|
|
13454
|
+
{
|
|
13455
|
+
"kind": "javascript-module",
|
|
13456
|
+
"path": "src/status-banner.ts",
|
|
13457
|
+
"declarations": [
|
|
13458
|
+
{
|
|
13459
|
+
"kind": "class",
|
|
13460
|
+
"description": "Full-width, app-level status bar for a persistent condition — \"Reconnecting…\",\n\"Read-only mode\", \"New version available\". Unlike `toast-notification` (which\nis transient, imperative, and stacks in a corner) this stays put for as long\nas the condition holds, so the consumer controls its presence by rendering it\nor not.\n\nColors mirror `status-pill`: a tinted background with accent-colored text.\nAnnounced to assistive tech via `role=\"status\"` (or `role=\"alert\"` for the\n`danger` variant, matching `toast-notification`'s split).",
|
|
13461
|
+
"name": "StatusBanner",
|
|
13462
|
+
"slots": [
|
|
13463
|
+
{
|
|
13464
|
+
"description": "The message text.",
|
|
13465
|
+
"name": ""
|
|
13466
|
+
},
|
|
13467
|
+
{
|
|
13468
|
+
"description": "Optional trailing controls, e.g. a \"Retry\" button.",
|
|
13469
|
+
"name": "actions"
|
|
13470
|
+
}
|
|
13471
|
+
],
|
|
13472
|
+
"members": [
|
|
13473
|
+
{
|
|
13474
|
+
"kind": "field",
|
|
13475
|
+
"name": "variant",
|
|
13476
|
+
"type": {
|
|
13477
|
+
"text": "StatusBannerVariant"
|
|
13478
|
+
},
|
|
13479
|
+
"default": "\"info\"",
|
|
13480
|
+
"description": "Visual style; also selects the accent color.",
|
|
13481
|
+
"attribute": "variant",
|
|
13482
|
+
"reflects": true
|
|
13483
|
+
},
|
|
13484
|
+
{
|
|
13485
|
+
"kind": "field",
|
|
13486
|
+
"name": "icon",
|
|
13487
|
+
"type": {
|
|
13488
|
+
"text": "TemplateResult | null"
|
|
13489
|
+
},
|
|
13490
|
+
"default": "null",
|
|
13491
|
+
"description": "Optional leading icon, pre-rendered by the consumer (e.g. `iconInfo(14)`),\nmatching `nav-item`/`icon-button` — icons are passed in, not named, so the\ncomponent never has to know the icon catalog."
|
|
13492
|
+
}
|
|
13493
|
+
],
|
|
13494
|
+
"attributes": [
|
|
13495
|
+
{
|
|
13496
|
+
"name": "variant",
|
|
13497
|
+
"type": {
|
|
13498
|
+
"text": "StatusBannerVariant"
|
|
13499
|
+
},
|
|
13500
|
+
"default": "\"info\"",
|
|
13501
|
+
"description": "Visual style; also selects the accent color.",
|
|
13502
|
+
"fieldName": "variant"
|
|
13503
|
+
}
|
|
13504
|
+
],
|
|
13505
|
+
"superclass": {
|
|
13506
|
+
"name": "LitElement",
|
|
13507
|
+
"package": "lit"
|
|
13508
|
+
},
|
|
13509
|
+
"tagName": "status-banner",
|
|
13510
|
+
"customElement": true
|
|
13511
|
+
}
|
|
13512
|
+
],
|
|
13513
|
+
"exports": [
|
|
13514
|
+
{
|
|
13515
|
+
"kind": "js",
|
|
13516
|
+
"name": "StatusBanner",
|
|
13517
|
+
"declaration": {
|
|
13518
|
+
"name": "StatusBanner",
|
|
13519
|
+
"module": "src/status-banner.ts"
|
|
13520
|
+
}
|
|
13521
|
+
},
|
|
13522
|
+
{
|
|
13523
|
+
"kind": "custom-element-definition",
|
|
13524
|
+
"name": "status-banner",
|
|
13525
|
+
"declaration": {
|
|
13526
|
+
"name": "StatusBanner",
|
|
13527
|
+
"module": "src/status-banner.ts"
|
|
13528
|
+
}
|
|
13529
|
+
}
|
|
13530
|
+
]
|
|
13531
|
+
},
|
|
13438
13532
|
{
|
|
13439
13533
|
"kind": "javascript-module",
|
|
13440
13534
|
"path": "src/status-pill.ts",
|
package/dist/index.d.ts
CHANGED
|
@@ -29,6 +29,7 @@ export { RangeSlider } from "./range-slider.js";
|
|
|
29
29
|
export { ButtonGroup, type ButtonGroupOption } from "./button-group.js";
|
|
30
30
|
export { UiButton, type ButtonVariant } from "./ui-button.js";
|
|
31
31
|
export { StatMeter } from "./stat-meter.js";
|
|
32
|
+
export { StatusBanner, type StatusBannerVariant } from "./status-banner.js";
|
|
32
33
|
export { StatusPill, type StatusPillColor } from "./status-pill.js";
|
|
33
34
|
export { EditableText } from "./editable-text.js";
|
|
34
35
|
export { LiveTimer } from "./live-timer.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
|
@@ -29,6 +29,7 @@ export { RangeSlider } from "./range-slider.js";
|
|
|
29
29
|
export { ButtonGroup } from "./button-group.js";
|
|
30
30
|
export { UiButton } from "./ui-button.js";
|
|
31
31
|
export { StatMeter } from "./stat-meter.js";
|
|
32
|
+
export { StatusBanner } from "./status-banner.js";
|
|
32
33
|
export { StatusPill } from "./status-pill.js";
|
|
33
34
|
export { EditableText } from "./editable-text.js";
|
|
34
35
|
export { LiveTimer } from "./live-timer.js";
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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","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 { MapboxMap } from \"./mapbox-map.js\";\nexport { RadioCards, type RadioCardOption } from \"./radio-cards.js\";\nexport { RadioPills, type RadioPillOption } from \"./radio-pills.js\";\nexport { RangeSlider } from \"./range-slider.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 { SplitHero } from \"./split-hero.js\";\nexport { TabBar, type TabChangeDetail } from \"./tab-bar.js\";\nexport { TabItem } from \"./tab-item.js\";\nexport { MarkdownEditor } from \"./markdown-editor.js\";\nexport {\n parseFrontMatter,\n formatFrontMatterValue,\n type FrontMatterResult,\n} from \"./utils/front-matter.js\";\nexport { formatDuration, type DurationFormat } from \"./utils/duration.js\";\nexport { tokens, tokenValues, darkTokenValues } from \"./tokens.js\";\nexport * from \"./icons.js\";\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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","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 { MapboxMap } from \"./mapbox-map.js\";\nexport { RadioCards, type RadioCardOption } from \"./radio-cards.js\";\nexport { RadioPills, type RadioPillOption } from \"./radio-pills.js\";\nexport { RangeSlider } from \"./range-slider.js\";\nexport { ButtonGroup, type ButtonGroupOption } from \"./button-group.js\";\nexport { UiButton, type ButtonVariant } from \"./ui-button.js\";\nexport { StatMeter } from \"./stat-meter.js\";\nexport { StatusBanner, type StatusBannerVariant } from \"./status-banner.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 { SplitHero } from \"./split-hero.js\";\nexport { TabBar, type TabChangeDetail } from \"./tab-bar.js\";\nexport { TabItem } from \"./tab-item.js\";\nexport { MarkdownEditor } from \"./markdown-editor.js\";\nexport {\n parseFrontMatter,\n formatFrontMatterValue,\n type FrontMatterResult,\n} from \"./utils/front-matter.js\";\nexport { formatDuration, type DurationFormat } from \"./utils/duration.js\";\nexport { tokens, tokenValues, darkTokenValues } from \"./tokens.js\";\nexport * from \"./icons.js\";\n"]}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { LitElement, type TemplateResult } from "lit";
|
|
2
|
+
export type StatusBannerVariant = "neutral" | "info" | "success" | "warning" | "danger";
|
|
3
|
+
/**
|
|
4
|
+
* Full-width, app-level status bar for a persistent condition — "Reconnecting…",
|
|
5
|
+
* "Read-only mode", "New version available". Unlike `toast-notification` (which
|
|
6
|
+
* is transient, imperative, and stacks in a corner) this stays put for as long
|
|
7
|
+
* as the condition holds, so the consumer controls its presence by rendering it
|
|
8
|
+
* or not.
|
|
9
|
+
*
|
|
10
|
+
* Colors mirror `status-pill`: a tinted background with accent-colored text.
|
|
11
|
+
* Announced to assistive tech via `role="status"` (or `role="alert"` for the
|
|
12
|
+
* `danger` variant, matching `toast-notification`'s split).
|
|
13
|
+
*
|
|
14
|
+
* @element status-banner
|
|
15
|
+
* @slot - The message text.
|
|
16
|
+
* @slot actions - Optional trailing controls, e.g. a "Retry" button.
|
|
17
|
+
*/
|
|
18
|
+
export declare class StatusBanner extends LitElement {
|
|
19
|
+
static styles: import("lit").CSSResult[];
|
|
20
|
+
/** Visual style; also selects the accent color. */
|
|
21
|
+
variant: StatusBannerVariant;
|
|
22
|
+
/**
|
|
23
|
+
* Optional leading icon, pre-rendered by the consumer (e.g. `iconInfo(14)`),
|
|
24
|
+
* matching `nav-item`/`icon-button` — icons are passed in, not named, so the
|
|
25
|
+
* component never has to know the icon catalog.
|
|
26
|
+
*/
|
|
27
|
+
icon: TemplateResult | null;
|
|
28
|
+
render(): TemplateResult<1>;
|
|
29
|
+
}
|
|
30
|
+
declare global {
|
|
31
|
+
interface HTMLElementTagNameMap {
|
|
32
|
+
"status-banner": StatusBanner;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
//# sourceMappingURL=status-banner.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"status-banner.d.ts","sourceRoot":"","sources":["../src/status-banner.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,KAAK,cAAc,EAAsB,MAAM,KAAK,CAAC;AAI1E,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAExF;;;;;;;;;;;;;;GAcG;AACH,qBACa,YAAa,SAAQ,UAAU;IAC1C,OAAgB,MAAM,4BA0EpB;IAEF,mDAAmD;IACtB,OAAO,EAAE,mBAAmB,CAAU;IAEnE;;;;OAIG;IAC6B,IAAI,EAAE,cAAc,GAAG,IAAI,CAAQ;IAE1D,MAAM,sBAUd;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAC;KAC/B;CACF"}
|
|
@@ -0,0 +1,134 @@
|
|
|
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, nothing } from "lit";
|
|
8
|
+
import { customElement, property } from "lit/decorators.js";
|
|
9
|
+
import { tokens } from "./tokens.js";
|
|
10
|
+
/**
|
|
11
|
+
* Full-width, app-level status bar for a persistent condition — "Reconnecting…",
|
|
12
|
+
* "Read-only mode", "New version available". Unlike `toast-notification` (which
|
|
13
|
+
* is transient, imperative, and stacks in a corner) this stays put for as long
|
|
14
|
+
* as the condition holds, so the consumer controls its presence by rendering it
|
|
15
|
+
* or not.
|
|
16
|
+
*
|
|
17
|
+
* Colors mirror `status-pill`: a tinted background with accent-colored text.
|
|
18
|
+
* Announced to assistive tech via `role="status"` (or `role="alert"` for the
|
|
19
|
+
* `danger` variant, matching `toast-notification`'s split).
|
|
20
|
+
*
|
|
21
|
+
* @element status-banner
|
|
22
|
+
* @slot - The message text.
|
|
23
|
+
* @slot actions - Optional trailing controls, e.g. a "Retry" button.
|
|
24
|
+
*/
|
|
25
|
+
let StatusBanner = class StatusBanner extends LitElement {
|
|
26
|
+
constructor() {
|
|
27
|
+
super(...arguments);
|
|
28
|
+
/** Visual style; also selects the accent color. */
|
|
29
|
+
this.variant = "info";
|
|
30
|
+
/**
|
|
31
|
+
* Optional leading icon, pre-rendered by the consumer (e.g. `iconInfo(14)`),
|
|
32
|
+
* matching `nav-item`/`icon-button` — icons are passed in, not named, so the
|
|
33
|
+
* component never has to know the icon catalog.
|
|
34
|
+
*/
|
|
35
|
+
this.icon = null;
|
|
36
|
+
}
|
|
37
|
+
static { this.styles = [
|
|
38
|
+
tokens,
|
|
39
|
+
css `
|
|
40
|
+
:host {
|
|
41
|
+
display: block;
|
|
42
|
+
}
|
|
43
|
+
.bar {
|
|
44
|
+
display: flex;
|
|
45
|
+
align-items: center;
|
|
46
|
+
justify-content: center;
|
|
47
|
+
gap: 0.5rem;
|
|
48
|
+
padding: 0.5rem 0.75rem;
|
|
49
|
+
/* Deliberately taller than the 2rem control target: this is a passive
|
|
50
|
+
page-level notice competing with real content, so it needs presence.
|
|
51
|
+
Expressed against the type token so it keeps the 4x relationship if a
|
|
52
|
+
consumer scales the font. */
|
|
53
|
+
min-height: calc(var(--ui-font-size-sm, 0.75rem) * 4);
|
|
54
|
+
box-sizing: border-box;
|
|
55
|
+
font-family: var(
|
|
56
|
+
--ui-font,
|
|
57
|
+
ui-sans-serif,
|
|
58
|
+
system-ui,
|
|
59
|
+
sans-serif,
|
|
60
|
+
"Apple Color Emoji",
|
|
61
|
+
"Segoe UI Emoji",
|
|
62
|
+
"Segoe UI Symbol",
|
|
63
|
+
"Noto Color Emoji"
|
|
64
|
+
);
|
|
65
|
+
font-size: var(--ui-font-size-sm, 0.75rem);
|
|
66
|
+
line-height: var(--ui-line-height-normal, 1.5);
|
|
67
|
+
}
|
|
68
|
+
/* Keep the message centered while actions sit at the trailing edge. */
|
|
69
|
+
.message {
|
|
70
|
+
display: inline-flex;
|
|
71
|
+
align-items: center;
|
|
72
|
+
gap: 0.25rem;
|
|
73
|
+
text-align: center;
|
|
74
|
+
}
|
|
75
|
+
.actions {
|
|
76
|
+
margin-left: auto;
|
|
77
|
+
display: inline-flex;
|
|
78
|
+
align-items: center;
|
|
79
|
+
gap: 0.25rem;
|
|
80
|
+
}
|
|
81
|
+
.icon {
|
|
82
|
+
display: inline-flex;
|
|
83
|
+
line-height: 0;
|
|
84
|
+
}
|
|
85
|
+
.bar.neutral {
|
|
86
|
+
background: color-mix(in srgb, var(--ui-text-muted, #64748b) 15%, transparent);
|
|
87
|
+
color: var(--ui-text-muted, #64748b);
|
|
88
|
+
}
|
|
89
|
+
.bar.info {
|
|
90
|
+
background: color-mix(in srgb, var(--ui-info, #0ea5e9) 15%, transparent);
|
|
91
|
+
color: var(--ui-info, #0ea5e9);
|
|
92
|
+
}
|
|
93
|
+
.bar.success {
|
|
94
|
+
background: color-mix(in srgb, var(--ui-success, #16a34a) 15%, transparent);
|
|
95
|
+
color: var(--ui-success, #16a34a);
|
|
96
|
+
}
|
|
97
|
+
.bar.warning {
|
|
98
|
+
background: color-mix(in srgb, var(--ui-warning, #d97706) 15%, transparent);
|
|
99
|
+
color: var(--ui-warning, #d97706);
|
|
100
|
+
}
|
|
101
|
+
.bar.danger {
|
|
102
|
+
background: color-mix(in srgb, var(--ui-danger, #dc2626) 15%, transparent);
|
|
103
|
+
color: var(--ui-danger, #dc2626);
|
|
104
|
+
}
|
|
105
|
+
@media (forced-colors: active) {
|
|
106
|
+
.bar {
|
|
107
|
+
border-bottom: 1px solid CanvasText;
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
`,
|
|
111
|
+
]; }
|
|
112
|
+
render() {
|
|
113
|
+
return html `
|
|
114
|
+
<div class="bar ${this.variant}" role=${this.variant === "danger" ? "alert" : "status"}>
|
|
115
|
+
<span class="message">
|
|
116
|
+
${this.icon ? html `<span class="icon">${this.icon}</span>` : nothing}
|
|
117
|
+
<slot></slot>
|
|
118
|
+
</span>
|
|
119
|
+
<span class="actions"><slot name="actions"></slot></span>
|
|
120
|
+
</div>
|
|
121
|
+
`;
|
|
122
|
+
}
|
|
123
|
+
};
|
|
124
|
+
__decorate([
|
|
125
|
+
property({ reflect: true })
|
|
126
|
+
], StatusBanner.prototype, "variant", void 0);
|
|
127
|
+
__decorate([
|
|
128
|
+
property({ attribute: false })
|
|
129
|
+
], StatusBanner.prototype, "icon", void 0);
|
|
130
|
+
StatusBanner = __decorate([
|
|
131
|
+
customElement("status-banner")
|
|
132
|
+
], StatusBanner);
|
|
133
|
+
export { StatusBanner };
|
|
134
|
+
//# sourceMappingURL=status-banner.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"status-banner.js","sourceRoot":"","sources":["../src/status-banner.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAuB,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAIrC;;;;;;;;;;;;;;GAcG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QA6EL,mDAAmD;QACtB,YAAO,GAAwB,MAAM,CAAC;QAEnE;;;;WAIG;QAC6B,SAAI,GAA0B,IAAI,CAAC;IAarE,CAAC;aAjGiB,WAAM,GAAG;QACvB,MAAM;QACN,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAuEF;KACF,AA1EqB,CA0EpB;IAYO,MAAM;QACb,OAAO,IAAI,CAAA;wBACS,IAAI,CAAC,OAAO,UAAU,IAAI,CAAC,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ;;YAEhF,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,sBAAsB,IAAI,CAAC,IAAI,SAAS,CAAC,CAAC,CAAC,OAAO;;;;;KAKzE,CAAC;IACJ,CAAC;CACF,CAAA;AApB8B;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAAuC;AAOnC;IAA/B,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;0CAAoC;AArFxD,YAAY;IADxB,aAAa,CAAC,eAAe,CAAC;GAClB,YAAY,CAkGxB","sourcesContent":["import { LitElement, type TemplateResult, css, html, nothing } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport { tokens } from \"./tokens.js\";\n\nexport type StatusBannerVariant = \"neutral\" | \"info\" | \"success\" | \"warning\" | \"danger\";\n\n/**\n * Full-width, app-level status bar for a persistent condition — \"Reconnecting…\",\n * \"Read-only mode\", \"New version available\". Unlike `toast-notification` (which\n * is transient, imperative, and stacks in a corner) this stays put for as long\n * as the condition holds, so the consumer controls its presence by rendering it\n * or not.\n *\n * Colors mirror `status-pill`: a tinted background with accent-colored text.\n * Announced to assistive tech via `role=\"status\"` (or `role=\"alert\"` for the\n * `danger` variant, matching `toast-notification`'s split).\n *\n * @element status-banner\n * @slot - The message text.\n * @slot actions - Optional trailing controls, e.g. a \"Retry\" button.\n */\n@customElement(\"status-banner\")\nexport class StatusBanner extends LitElement {\n static override styles = [\n tokens,\n css`\n :host {\n display: block;\n }\n .bar {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n padding: 0.5rem 0.75rem;\n /* Deliberately taller than the 2rem control target: this is a passive\n page-level notice competing with real content, so it needs presence.\n Expressed against the type token so it keeps the 4x relationship if a\n consumer scales the font. */\n min-height: calc(var(--ui-font-size-sm, 0.75rem) * 4);\n box-sizing: border-box;\n font-family: var(\n --ui-font,\n ui-sans-serif,\n system-ui,\n sans-serif,\n \"Apple Color Emoji\",\n \"Segoe UI Emoji\",\n \"Segoe UI Symbol\",\n \"Noto Color Emoji\"\n );\n font-size: var(--ui-font-size-sm, 0.75rem);\n line-height: var(--ui-line-height-normal, 1.5);\n }\n /* Keep the message centered while actions sit at the trailing edge. */\n .message {\n display: inline-flex;\n align-items: center;\n gap: 0.25rem;\n text-align: center;\n }\n .actions {\n margin-left: auto;\n display: inline-flex;\n align-items: center;\n gap: 0.25rem;\n }\n .icon {\n display: inline-flex;\n line-height: 0;\n }\n .bar.neutral {\n background: color-mix(in srgb, var(--ui-text-muted, #64748b) 15%, transparent);\n color: var(--ui-text-muted, #64748b);\n }\n .bar.info {\n background: color-mix(in srgb, var(--ui-info, #0ea5e9) 15%, transparent);\n color: var(--ui-info, #0ea5e9);\n }\n .bar.success {\n background: color-mix(in srgb, var(--ui-success, #16a34a) 15%, transparent);\n color: var(--ui-success, #16a34a);\n }\n .bar.warning {\n background: color-mix(in srgb, var(--ui-warning, #d97706) 15%, transparent);\n color: var(--ui-warning, #d97706);\n }\n .bar.danger {\n background: color-mix(in srgb, var(--ui-danger, #dc2626) 15%, transparent);\n color: var(--ui-danger, #dc2626);\n }\n @media (forced-colors: active) {\n .bar {\n border-bottom: 1px solid CanvasText;\n }\n }\n `,\n ];\n\n /** Visual style; also selects the accent color. */\n @property({ reflect: true }) variant: StatusBannerVariant = \"info\";\n\n /**\n * Optional leading icon, pre-rendered by the consumer (e.g. `iconInfo(14)`),\n * matching `nav-item`/`icon-button` — icons are passed in, not named, so the\n * component never has to know the icon catalog.\n */\n @property({ attribute: false }) icon: TemplateResult | null = null;\n\n override render() {\n return html`\n <div class=\"bar ${this.variant}\" role=${this.variant === \"danger\" ? \"alert\" : \"status\"}>\n <span class=\"message\">\n ${this.icon ? html`<span class=\"icon\">${this.icon}</span>` : nothing}\n <slot></slot>\n </span>\n <span class=\"actions\"><slot name=\"actions\"></slot></span>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"status-banner\": StatusBanner;\n }\n}\n"]}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
# `<status-banner>`
|
|
2
|
+
|
|
3
|
+
Full-width, app-level status bar for a persistent condition — "Reconnecting…",
|
|
4
|
+
"Read-only mode", "New version available". Unlike `toast-notification` (which
|
|
5
|
+
is transient, imperative, and stacks in a corner) this stays put for as long
|
|
6
|
+
as the condition holds, so the consumer controls its presence by rendering it
|
|
7
|
+
or not.
|
|
8
|
+
|
|
9
|
+
Colors mirror `status-pill`: a tinted background with accent-colored text.
|
|
10
|
+
Announced to assistive tech via `role="status"` (or `role="alert"` for the
|
|
11
|
+
`danger` variant, matching `toast-notification`'s split).
|
|
12
|
+
|
|
13
|
+
## Install
|
|
14
|
+
|
|
15
|
+
```js
|
|
16
|
+
import "@f-ewald/components/status-banner.js";
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
## Usage
|
|
20
|
+
|
|
21
|
+
```html
|
|
22
|
+
<status-banner variant="warning">Reconnecting… — data may be stale</status-banner>
|
|
23
|
+
<status-banner variant="info">
|
|
24
|
+
A new version is available.
|
|
25
|
+
<button slot="actions">Reload</button>
|
|
26
|
+
</status-banner>
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
## Attributes / properties
|
|
30
|
+
|
|
31
|
+
| Property | Attribute | Type | Default | Description |
|
|
32
|
+
| --- | --- | --- | --- | --- |
|
|
33
|
+
| `variant` | `variant` | `StatusBannerVariant` | `"info"` | Visual style; also selects the accent color. |
|
|
34
|
+
| `icon` | _(JS property only)_ | `TemplateResult | null` | `null` | Optional leading icon, pre-rendered by the consumer (e.g. `iconInfo(14)`), matching `nav-item`/`icon-button` — icons are passed in, not named, so the component never has to know the icon catalog. |
|
|
35
|
+
|
|
36
|
+
## Events
|
|
37
|
+
|
|
38
|
+
_None._
|
|
39
|
+
|
|
40
|
+
## Slots
|
|
41
|
+
|
|
42
|
+
_None._
|
|
43
|
+
|
|
44
|
+
## CSS custom properties
|
|
45
|
+
|
|
46
|
+
| Custom property |
|
|
47
|
+
| --- |
|
|
48
|
+
| `--ui-danger` |
|
|
49
|
+
| `--ui-font` |
|
|
50
|
+
| `--ui-font-size-sm` |
|
|
51
|
+
| `--ui-info` |
|
|
52
|
+
| `--ui-line-height-normal` |
|
|
53
|
+
| `--ui-success` |
|
|
54
|
+
| `--ui-text-muted` |
|
|
55
|
+
| `--ui-warning` |
|
package/llms.txt
CHANGED
|
@@ -1696,6 +1696,33 @@ Example:
|
|
|
1696
1696
|
<stat-meter label="GPU" percent="88" color="#dc2626"></stat-meter>
|
|
1697
1697
|
```
|
|
1698
1698
|
|
|
1699
|
+
## <status-banner>
|
|
1700
|
+
|
|
1701
|
+
Full-width, app-level status bar for a persistent condition — "Reconnecting…",
|
|
1702
|
+
"Read-only mode", "New version available". Unlike `toast-notification` (which
|
|
1703
|
+
is transient, imperative, and stacks in a corner) this stays put for as long
|
|
1704
|
+
as the condition holds, so the consumer controls its presence by rendering it
|
|
1705
|
+
or not.
|
|
1706
|
+
|
|
1707
|
+
Colors mirror `status-pill`: a tinted background with accent-colored text.
|
|
1708
|
+
Announced to assistive tech via `role="status"` (or `role="alert"` for the
|
|
1709
|
+
`danger` variant, matching `toast-notification`'s split).
|
|
1710
|
+
|
|
1711
|
+
Import: `import "@f-ewald/components/status-banner.js";`
|
|
1712
|
+
|
|
1713
|
+
Properties: `variant` (attribute `variant`) : StatusBannerVariant, default "info"; `icon` (JS property only) : TemplateResult | null, default null
|
|
1714
|
+
Events: none
|
|
1715
|
+
CSS custom properties: `--ui-danger`, `--ui-font`, `--ui-font-size-sm`, `--ui-info`, `--ui-line-height-normal`, `--ui-success`, `--ui-text-muted`, `--ui-warning`
|
|
1716
|
+
|
|
1717
|
+
Example:
|
|
1718
|
+
```html
|
|
1719
|
+
<status-banner variant="warning">Reconnecting… — data may be stale</status-banner>
|
|
1720
|
+
<status-banner variant="info">
|
|
1721
|
+
A new version is available.
|
|
1722
|
+
<button slot="actions">Reload</button>
|
|
1723
|
+
</status-banner>
|
|
1724
|
+
```
|
|
1725
|
+
|
|
1699
1726
|
## <status-pill>
|
|
1700
1727
|
|
|
1701
1728
|
Small colored status pill, optionally with a spinning icon — for task/run
|