@orange-halo/components 2.2.0 → 3.0.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/custom-elements.json +551 -314
- package/dist/index.d.ts +1 -7
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +0 -4
- package/dist/index.js.map +1 -1
- package/dist/oh-accordion.d.ts +53 -8
- package/dist/oh-accordion.d.ts.map +1 -1
- package/dist/oh-accordion.js +77 -15
- package/dist/oh-accordion.js.map +1 -1
- package/dist/oh-alert.d.ts +26 -8
- package/dist/oh-alert.d.ts.map +1 -1
- package/dist/oh-alert.js +32 -14
- package/dist/oh-alert.js.map +1 -1
- package/dist/oh-badge.d.ts +32 -13
- package/dist/oh-badge.d.ts.map +1 -1
- package/dist/oh-badge.js +35 -16
- package/dist/oh-badge.js.map +1 -1
- package/dist/oh-breadcrumb.d.ts +39 -12
- package/dist/oh-breadcrumb.d.ts.map +1 -1
- package/dist/oh-breadcrumb.js +39 -17
- package/dist/oh-breadcrumb.js.map +1 -1
- package/dist/oh-button.d.ts +49 -23
- package/dist/oh-button.d.ts.map +1 -1
- package/dist/oh-button.js +63 -44
- package/dist/oh-button.js.map +1 -1
- package/dist/oh-card.d.ts +47 -19
- package/dist/oh-card.d.ts.map +1 -1
- package/dist/oh-card.js +110 -82
- package/dist/oh-card.js.map +1 -1
- package/dist/oh-checkbox-group.d.ts +56 -12
- package/dist/oh-checkbox-group.d.ts.map +1 -1
- package/dist/oh-checkbox-group.figma.js +4 -6
- package/dist/oh-checkbox-group.figma.js.map +1 -1
- package/dist/oh-checkbox-group.js +86 -44
- package/dist/oh-checkbox-group.js.map +1 -1
- package/dist/oh-checkbox.d.ts +54 -17
- package/dist/oh-checkbox.d.ts.map +1 -1
- package/dist/oh-checkbox.js +85 -55
- package/dist/oh-checkbox.js.map +1 -1
- package/dist/oh-cluster.d.ts +19 -14
- package/dist/oh-cluster.d.ts.map +1 -1
- package/dist/oh-cluster.js +19 -19
- package/dist/oh-cluster.js.map +1 -1
- package/dist/oh-container.d.ts +19 -16
- package/dist/oh-container.d.ts.map +1 -1
- package/dist/oh-container.js +21 -23
- package/dist/oh-container.js.map +1 -1
- package/dist/oh-drawer.d.ts +28 -11
- package/dist/oh-drawer.d.ts.map +1 -1
- package/dist/oh-drawer.js +31 -14
- package/dist/oh-drawer.js.map +1 -1
- package/dist/oh-footer.d.ts +37 -18
- package/dist/oh-footer.d.ts.map +1 -1
- package/dist/oh-footer.js +38 -19
- package/dist/oh-footer.js.map +1 -1
- package/dist/oh-grid.d.ts +27 -14
- package/dist/oh-grid.d.ts.map +1 -1
- package/dist/oh-grid.js +27 -19
- package/dist/oh-grid.js.map +1 -1
- package/dist/oh-icon.d.ts +21 -5
- package/dist/oh-icon.d.ts.map +1 -1
- package/dist/oh-icon.js +21 -5
- package/dist/oh-icon.js.map +1 -1
- package/dist/oh-input.d.ts +104 -20
- package/dist/oh-input.d.ts.map +1 -1
- package/dist/oh-input.figma.js +2 -2
- package/dist/oh-input.figma.js.map +1 -1
- package/dist/oh-input.js +205 -66
- package/dist/oh-input.js.map +1 -1
- package/dist/oh-link.d.ts +42 -19
- package/dist/oh-link.d.ts.map +1 -1
- package/dist/oh-link.js +47 -29
- package/dist/oh-link.js.map +1 -1
- package/dist/oh-modal.d.ts +29 -6
- package/dist/oh-modal.d.ts.map +1 -1
- package/dist/oh-modal.js +37 -16
- package/dist/oh-modal.js.map +1 -1
- package/dist/oh-navbar.d.ts +42 -19
- package/dist/oh-navbar.d.ts.map +1 -1
- package/dist/oh-navbar.js +42 -19
- package/dist/oh-navbar.js.map +1 -1
- package/dist/oh-progress.d.ts +26 -7
- package/dist/oh-progress.d.ts.map +1 -1
- package/dist/oh-progress.js +31 -12
- package/dist/oh-progress.js.map +1 -1
- package/dist/oh-radio-group.d.ts +55 -13
- package/dist/oh-radio-group.d.ts.map +1 -1
- package/dist/oh-radio-group.figma.js +2 -2
- package/dist/oh-radio-group.figma.js.map +1 -1
- package/dist/oh-radio-group.js +83 -43
- package/dist/oh-radio-group.js.map +1 -1
- package/dist/oh-radio.d.ts +55 -17
- package/dist/oh-radio.d.ts.map +1 -1
- package/dist/oh-radio.js +87 -56
- package/dist/oh-radio.js.map +1 -1
- package/dist/oh-select.d.ts +58 -16
- package/dist/oh-select.d.ts.map +1 -1
- package/dist/oh-select.js +70 -33
- package/dist/oh-select.js.map +1 -1
- package/dist/oh-skip-link.d.ts +33 -15
- package/dist/oh-skip-link.d.ts.map +1 -1
- package/dist/oh-skip-link.js +38 -25
- package/dist/oh-skip-link.js.map +1 -1
- package/dist/oh-stack.d.ts +17 -14
- package/dist/oh-stack.d.ts.map +1 -1
- package/dist/oh-stack.js +18 -20
- package/dist/oh-stack.js.map +1 -1
- package/dist/oh-tabs.d.ts +55 -30
- package/dist/oh-tabs.d.ts.map +1 -1
- package/dist/oh-tabs.js +80 -65
- package/dist/oh-tabs.js.map +1 -1
- package/dist/oh-textarea.d.ts +37 -6
- package/dist/oh-textarea.d.ts.map +1 -1
- package/dist/oh-textarea.js +40 -9
- package/dist/oh-textarea.js.map +1 -1
- package/dist/oh-toggle.d.ts +45 -12
- package/dist/oh-toggle.d.ts.map +1 -1
- package/dist/oh-toggle.js +64 -29
- package/dist/oh-toggle.js.map +1 -1
- package/package.json +3 -7
- package/dist/oh-hero.d.ts +0 -33
- package/dist/oh-hero.d.ts.map +0 -1
- package/dist/oh-hero.js +0 -248
- package/dist/oh-hero.js.map +0 -1
package/dist/oh-select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"oh-select.js","sourceRoot":"","sources":["../src/oh-select.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;;;;;;;AAEH,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"oh-select.js","sourceRoot":"","sources":["../src/oh-select.ts"],"names":[],"mappings":"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"}
|
package/dist/oh-skip-link.d.ts
CHANGED
|
@@ -1,28 +1,46 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* oh-skip-link
|
|
3
3
|
*
|
|
4
|
-
* Accessibility skip link for keyboard navigation.
|
|
5
|
-
*
|
|
6
4
|
* DESIGN DECISIONS:
|
|
7
5
|
* ─────────────────
|
|
8
|
-
* 1.
|
|
9
|
-
*
|
|
10
|
-
*
|
|
11
|
-
*
|
|
6
|
+
* 1. A native anchor, visually hidden (but still read by screen readers)
|
|
7
|
+
* until it has focus.
|
|
8
|
+
* 2. On focus it appears fixed at the top-left of the viewport, above other
|
|
9
|
+
* content, and transitions in.
|
|
10
|
+
* 3. Focus is shown by a border in `color.brand.primary` on a raised
|
|
11
|
+
* surface; look comes from tokens only.
|
|
12
|
+
*/
|
|
13
|
+
import { OhElement } from "./base.js";
|
|
14
|
+
/**
|
|
15
|
+
* A "skip to content" link that lets keyboard users jump past repeated content, such as navigation.
|
|
12
16
|
*
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
*
|
|
16
|
-
*
|
|
17
|
+
* **Use it for** the first focusable element on every page, pointing at the
|
|
18
|
+
* main content. Add more for other landmarks (search results, footer) if
|
|
19
|
+
* useful. **Don't use it for** in-page navigation that everyone sees (use
|
|
20
|
+
* `oh-link`).
|
|
17
21
|
*
|
|
18
|
-
*
|
|
19
|
-
*
|
|
20
|
-
*
|
|
21
|
-
*
|
|
22
|
+
* **Parts:** `href` is the target (defaults to `#main`); `text` is the label
|
|
23
|
+
* (defaults to "Skip to main content").
|
|
24
|
+
*
|
|
25
|
+
* **Behaviour:** hidden until it receives keyboard focus, then shown fixed at
|
|
26
|
+
* the top-left of the viewport, above other content. Enter follows the link.
|
|
27
|
+
* Transitions are cut short under `prefers-reduced-motion`.
|
|
28
|
+
*
|
|
29
|
+
* **Accessibility:** screen readers can read it at all times. Put it first in
|
|
30
|
+
* the page, and give the target an `id` and `tabindex="-1"` so focus moves to
|
|
31
|
+
* it.
|
|
32
|
+
*
|
|
33
|
+
* **Look:** set by tokens — `color.surface.base`, `color.border.emphasis` and
|
|
34
|
+
* `color.text.link` at rest; `color.surface.raised`, `color.text.linkRaised`
|
|
35
|
+
* and `color.brand.primary` (border) on focus; `stroke.control` the border,
|
|
36
|
+
* `shape.control` the corners; `elevation.offset.lg` with `elevation.color.neutral`
|
|
37
|
+
* (`elevation.color.primary` on focus) the shadow; `typography.body.*` and
|
|
38
|
+
* `typography.label.base.fontWeight` the text; `spacing.*` the padding and
|
|
39
|
+
* position; `motion.gentle`, `motion.quick` and `motion.snappy` the
|
|
40
|
+
* transitions.
|
|
22
41
|
*
|
|
23
42
|
* @element oh-skip-link
|
|
24
43
|
*/
|
|
25
|
-
import { OhElement } from "./base.js";
|
|
26
44
|
export declare class OhSkipLink extends OhElement {
|
|
27
45
|
static styles: import("lit").CSSResult[];
|
|
28
46
|
href: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"oh-skip-link.d.ts","sourceRoot":"","sources":["../src/oh-skip-link.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"oh-skip-link.d.ts","sourceRoot":"","sources":["../src/oh-skip-link.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAIH,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,qBACa,UAAW,SAAQ,SAAS;IACvC,OAAgB,MAAM,4BAgFpB;IAGF,IAAI,SAAW;IAGf,IAAI,SAA0B;IAE9B,MAAM;CAOP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,UAAU,CAAC;KAC5B;CACF"}
|
package/dist/oh-skip-link.js
CHANGED
|
@@ -1,26 +1,14 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* oh-skip-link
|
|
3
3
|
*
|
|
4
|
-
* Accessibility skip link for keyboard navigation.
|
|
5
|
-
*
|
|
6
4
|
* DESIGN DECISIONS:
|
|
7
5
|
* ─────────────────
|
|
8
|
-
* 1.
|
|
9
|
-
*
|
|
10
|
-
*
|
|
11
|
-
*
|
|
12
|
-
*
|
|
13
|
-
*
|
|
14
|
-
* - Fixed top-left position
|
|
15
|
-
* - Smooth transition on focus
|
|
16
|
-
* - Z-index above other content
|
|
17
|
-
*
|
|
18
|
-
* 3. STYLING
|
|
19
|
-
* - Warm orange focus state
|
|
20
|
-
* - Chunky padding and border
|
|
21
|
-
* - Clear typography
|
|
22
|
-
*
|
|
23
|
-
* @element oh-skip-link
|
|
6
|
+
* 1. A native anchor, visually hidden (but still read by screen readers)
|
|
7
|
+
* until it has focus.
|
|
8
|
+
* 2. On focus it appears fixed at the top-left of the viewport, above other
|
|
9
|
+
* content, and transitions in.
|
|
10
|
+
* 3. Focus is shown by a border in `color.brand.primary` on a raised
|
|
11
|
+
* surface; look comes from tokens only.
|
|
24
12
|
*/
|
|
25
13
|
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
26
14
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
@@ -31,6 +19,36 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
31
19
|
import { html, css } from "lit";
|
|
32
20
|
import { customElement, property } from "lit/decorators.js";
|
|
33
21
|
import { OhElement, baseStyles } from "./base.js";
|
|
22
|
+
/**
|
|
23
|
+
* A "skip to content" link that lets keyboard users jump past repeated content, such as navigation.
|
|
24
|
+
*
|
|
25
|
+
* **Use it for** the first focusable element on every page, pointing at the
|
|
26
|
+
* main content. Add more for other landmarks (search results, footer) if
|
|
27
|
+
* useful. **Don't use it for** in-page navigation that everyone sees (use
|
|
28
|
+
* `oh-link`).
|
|
29
|
+
*
|
|
30
|
+
* **Parts:** `href` is the target (defaults to `#main`); `text` is the label
|
|
31
|
+
* (defaults to "Skip to main content").
|
|
32
|
+
*
|
|
33
|
+
* **Behaviour:** hidden until it receives keyboard focus, then shown fixed at
|
|
34
|
+
* the top-left of the viewport, above other content. Enter follows the link.
|
|
35
|
+
* Transitions are cut short under `prefers-reduced-motion`.
|
|
36
|
+
*
|
|
37
|
+
* **Accessibility:** screen readers can read it at all times. Put it first in
|
|
38
|
+
* the page, and give the target an `id` and `tabindex="-1"` so focus moves to
|
|
39
|
+
* it.
|
|
40
|
+
*
|
|
41
|
+
* **Look:** set by tokens — `color.surface.base`, `color.border.emphasis` and
|
|
42
|
+
* `color.text.link` at rest; `color.surface.raised`, `color.text.linkRaised`
|
|
43
|
+
* and `color.brand.primary` (border) on focus; `stroke.control` the border,
|
|
44
|
+
* `shape.control` the corners; `elevation.offset.lg` with `elevation.color.neutral`
|
|
45
|
+
* (`elevation.color.primary` on focus) the shadow; `typography.body.*` and
|
|
46
|
+
* `typography.label.base.fontWeight` the text; `spacing.*` the padding and
|
|
47
|
+
* position; `motion.gentle`, `motion.quick` and `motion.snappy` the
|
|
48
|
+
* transitions.
|
|
49
|
+
*
|
|
50
|
+
* @element oh-skip-link
|
|
51
|
+
*/
|
|
34
52
|
let OhSkipLink = class OhSkipLink extends OhElement {
|
|
35
53
|
constructor() {
|
|
36
54
|
super(...arguments);
|
|
@@ -40,11 +58,6 @@ let OhSkipLink = class OhSkipLink extends OhElement {
|
|
|
40
58
|
static { this.styles = [
|
|
41
59
|
baseStyles,
|
|
42
60
|
css `
|
|
43
|
-
/* ═══════════════════════════════════════════════════════════════
|
|
44
|
-
ORANGE HALO SKIP LINK
|
|
45
|
-
Accessibility • Keyboard Navigation • Hidden until focus
|
|
46
|
-
═══════════════════════════════════════════════════════════════ */
|
|
47
|
-
|
|
48
61
|
:host {
|
|
49
62
|
display: contents;
|
|
50
63
|
}
|
|
@@ -72,7 +85,7 @@ let OhSkipLink = class OhSkipLink extends OhElement {
|
|
|
72
85
|
border: var(--oh-stroke-control) solid var(--oh-color-border-emphasis);
|
|
73
86
|
border-radius: var(--oh-shape-control);
|
|
74
87
|
box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg)
|
|
75
|
-
0 0 var(--oh-
|
|
88
|
+
0 0 var(--oh-elevation-color-neutral);
|
|
76
89
|
|
|
77
90
|
font-family: var(--oh-typography-body-font-family);
|
|
78
91
|
font-size: var(--oh-typography-body-base-font-size);
|
|
@@ -98,7 +111,7 @@ let OhSkipLink = class OhSkipLink extends OhElement {
|
|
|
98
111
|
color: var(--oh-color-text-link-raised);
|
|
99
112
|
border-color: var(--oh-color-brand-primary);
|
|
100
113
|
box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg)
|
|
101
|
-
0 0 var(--oh-
|
|
114
|
+
0 0 var(--oh-elevation-color-primary);
|
|
102
115
|
}
|
|
103
116
|
|
|
104
117
|
/* Screen reader only when not focused */
|
package/dist/oh-skip-link.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"oh-skip-link.js","sourceRoot":"","sources":["../src/oh-skip-link.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"oh-skip-link.js","sourceRoot":"","sources":["../src/oh-skip-link.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;;;;;;;AAEH,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAElD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AAEI,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,SAAS;IAAlC;;QAoFL,SAAI,GAAG,OAAO,CAAC;QAGf,SAAI,GAAG,sBAAsB,CAAC;IAShC,CAAC;aA/FiB,WAAM,GAAG;QACvB,UAAU;QACV,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA6EF;KACF,AAhFqB,CAgFpB;IAQF,MAAM;QACJ,OAAO,IAAI,CAAA;kCACmB,IAAI,CAAC,IAAI,eAAe,IAAI,CAAC,IAAI;UACzD,IAAI,CAAC,IAAI;;KAEd,CAAC;IACJ,CAAC;;AAXD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCACZ;AAGf;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCACG;AAvFnB,UAAU;IADtB,aAAa,CAAC,cAAc,CAAC;GACjB,UAAU,CAgGtB"}
|
package/dist/oh-stack.d.ts
CHANGED
|
@@ -1,27 +1,30 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* oh-stack
|
|
3
3
|
*
|
|
4
|
-
* Vertical spacing between children.
|
|
5
|
-
* Creates consistent vertical rhythm without manual margins.
|
|
6
|
-
*
|
|
7
4
|
* DESIGN DECISIONS:
|
|
8
5
|
* ─────────────────
|
|
9
|
-
* 1.
|
|
10
|
-
*
|
|
11
|
-
*
|
|
6
|
+
* 1. A flex column; `gap` maps named steps to `spacing.*` tokens, so
|
|
7
|
+
* children need no margins.
|
|
8
|
+
* 2. Cross-axis alignment: start, center, end, stretch (default).
|
|
9
|
+
*/
|
|
10
|
+
import { OhElement } from "./base.js";
|
|
11
|
+
export type StackGap = "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
|
|
12
|
+
export type StackAlign = "start" | "center" | "end" | "stretch";
|
|
13
|
+
/**
|
|
14
|
+
* A vertical layout that spaces its children evenly, top to bottom.
|
|
12
15
|
*
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
*
|
|
16
|
+
* **Use it for** consistent vertical rhythm without margins on children.
|
|
17
|
+
* **Don't use it for** items in a row (use `oh-cluster`) or a grid of cards
|
|
18
|
+
* (use `oh-grid`).
|
|
16
19
|
*
|
|
17
|
-
*
|
|
18
|
-
*
|
|
20
|
+
* **Gaps:** `gap` is `none`, `xs` (`spacing.1`), `sm` (`spacing.2`), `md`
|
|
21
|
+
* (default, `spacing.4`), `lg` (`spacing.6`), `xl` (`spacing.8`) or `2xl`
|
|
22
|
+
* (`spacing.12`). `align` sets horizontal alignment: `start`, `center`,
|
|
23
|
+
* `end` or `stretch` (default).
|
|
19
24
|
*
|
|
20
25
|
* @element oh-stack
|
|
26
|
+
* @slot - The items to stack.
|
|
21
27
|
*/
|
|
22
|
-
import { OhElement } from "./base.js";
|
|
23
|
-
export type StackGap = "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
|
|
24
|
-
export type StackAlign = "start" | "center" | "end" | "stretch";
|
|
25
28
|
export declare class OhStack extends OhElement {
|
|
26
29
|
static styles: import("lit").CSSResult[];
|
|
27
30
|
gap: StackGap;
|
package/dist/oh-stack.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"oh-stack.d.ts","sourceRoot":"","sources":["../src/oh-stack.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"oh-stack.d.ts","sourceRoot":"","sources":["../src/oh-stack.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,MAAM,QAAQ,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AACzE,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;AAEhE;;;;;;;;;;;;;;GAcG;AACH,qBACa,OAAQ,SAAQ,SAAS;IACpC,OAAgB,MAAM,4BAuDpB;IAGF,GAAG,EAAE,QAAQ,CAAQ;IAGrB,KAAK,EAAE,UAAU,CAAa;IAE9B,MAAM;CAGP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}
|
package/dist/oh-stack.js
CHANGED
|
@@ -1,23 +1,11 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* oh-stack
|
|
3
3
|
*
|
|
4
|
-
* Vertical spacing between children.
|
|
5
|
-
* Creates consistent vertical rhythm without manual margins.
|
|
6
|
-
*
|
|
7
4
|
* DESIGN DECISIONS:
|
|
8
5
|
* ─────────────────
|
|
9
|
-
* 1.
|
|
10
|
-
*
|
|
11
|
-
*
|
|
12
|
-
*
|
|
13
|
-
* 2. FLEX COLUMN LAYOUT
|
|
14
|
-
* - Simple vertical stacking
|
|
15
|
-
* - Gap property for consistent spacing
|
|
16
|
-
*
|
|
17
|
-
* 3. ALIGNMENT OPTIONS
|
|
18
|
-
* - start, center, end, stretch
|
|
19
|
-
*
|
|
20
|
-
* @element oh-stack
|
|
6
|
+
* 1. A flex column; `gap` maps named steps to `spacing.*` tokens, so
|
|
7
|
+
* children need no margins.
|
|
8
|
+
* 2. Cross-axis alignment: start, center, end, stretch (default).
|
|
21
9
|
*/
|
|
22
10
|
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
23
11
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
@@ -28,6 +16,21 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
28
16
|
import { html, css } from "lit";
|
|
29
17
|
import { customElement, property } from "lit/decorators.js";
|
|
30
18
|
import { OhElement, baseStyles } from "./base.js";
|
|
19
|
+
/**
|
|
20
|
+
* A vertical layout that spaces its children evenly, top to bottom.
|
|
21
|
+
*
|
|
22
|
+
* **Use it for** consistent vertical rhythm without margins on children.
|
|
23
|
+
* **Don't use it for** items in a row (use `oh-cluster`) or a grid of cards
|
|
24
|
+
* (use `oh-grid`).
|
|
25
|
+
*
|
|
26
|
+
* **Gaps:** `gap` is `none`, `xs` (`spacing.1`), `sm` (`spacing.2`), `md`
|
|
27
|
+
* (default, `spacing.4`), `lg` (`spacing.6`), `xl` (`spacing.8`) or `2xl`
|
|
28
|
+
* (`spacing.12`). `align` sets horizontal alignment: `start`, `center`,
|
|
29
|
+
* `end` or `stretch` (default).
|
|
30
|
+
*
|
|
31
|
+
* @element oh-stack
|
|
32
|
+
* @slot - The items to stack.
|
|
33
|
+
*/
|
|
31
34
|
let OhStack = class OhStack extends OhElement {
|
|
32
35
|
constructor() {
|
|
33
36
|
super(...arguments);
|
|
@@ -37,11 +40,6 @@ let OhStack = class OhStack extends OhElement {
|
|
|
37
40
|
static { this.styles = [
|
|
38
41
|
baseStyles,
|
|
39
42
|
css `
|
|
40
|
-
/* ═══════════════════════════════════════════════════════════════
|
|
41
|
-
ORANGE HALO STACK
|
|
42
|
-
Vertical spacing • Consistent rhythm • Flexible alignment
|
|
43
|
-
═══════════════════════════════════════════════════════════════ */
|
|
44
|
-
|
|
45
43
|
:host {
|
|
46
44
|
display: flex;
|
|
47
45
|
flex-direction: column;
|
package/dist/oh-stack.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"oh-stack.js","sourceRoot":"","sources":["../src/oh-stack.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"oh-stack.js","sourceRoot":"","sources":["../src/oh-stack.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;;;;;;;AAEH,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAKlD;;;;;;;;;;;;;;GAcG;AAEI,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,SAAS;IAA/B;;QA2DL,QAAG,GAAa,IAAI,CAAC;QAGrB,UAAK,GAAe,SAAS,CAAC;IAKhC,CAAC;aAlEiB,WAAM,GAAG;QACvB,UAAU;QACV,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAoDF;KACF,AAvDqB,CAuDpB;IAQF,MAAM;QACJ,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AAPD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oCACrB;AAGrB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sCACZ;AA9DnB,OAAO;IADnB,aAAa,CAAC,UAAU,CAAC;GACb,OAAO,CAmEnB"}
|
package/dist/oh-tabs.d.ts
CHANGED
|
@@ -1,28 +1,17 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* oh-tabs
|
|
3
3
|
*
|
|
4
|
-
*
|
|
5
|
-
*
|
|
6
|
-
*
|
|
7
|
-
*
|
|
8
|
-
*
|
|
9
|
-
*
|
|
10
|
-
*
|
|
11
|
-
*
|
|
12
|
-
*
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
*
|
|
16
|
-
* KEYBOARD INTERACTIONS:
|
|
17
|
-
* ──────────────────────
|
|
18
|
-
* - Left Arrow: Move focus to previous tab (wraps to last)
|
|
19
|
-
* - Right Arrow: Move focus to next tab (wraps to first)
|
|
20
|
-
* - Home: Move focus to first tab
|
|
21
|
-
* - End: Move focus to last tab
|
|
22
|
-
* - Enter/Space: Activate focused tab and move focus to panel
|
|
23
|
-
* - Tab: Move focus out of tablist
|
|
24
|
-
*
|
|
25
|
-
* @element oh-tabs
|
|
4
|
+
* DESIGN DECISIONS:
|
|
5
|
+
* ─────────────────
|
|
6
|
+
* 1. WAI-ARIA tabs pattern: tablist / tab / tabpanel roles, roving tabindex,
|
|
7
|
+
* inactive panels `hidden`.
|
|
8
|
+
* 2. Manual activation: arrow keys and Home/End move focus only;
|
|
9
|
+
* Enter/Space selects and moves focus into the panel. Tab leaves the
|
|
10
|
+
* tablist.
|
|
11
|
+
* 3. The selected tab joins the panel: it shares the panel's surface and
|
|
12
|
+
* border, and covers the panel's top border beneath it.
|
|
13
|
+
* 4. Focus is a solid underline on the tab label (and an outline on the
|
|
14
|
+
* panel), never colour alone.
|
|
26
15
|
*/
|
|
27
16
|
import { OhElement } from "./base.js";
|
|
28
17
|
export interface TabItem {
|
|
@@ -30,16 +19,52 @@ export interface TabItem {
|
|
|
30
19
|
label: string;
|
|
31
20
|
content?: string;
|
|
32
21
|
}
|
|
22
|
+
/**
|
|
23
|
+
* A set of tabs that switches between panels of related content in the same place.
|
|
24
|
+
*
|
|
25
|
+
* **Use it for** a few peer sections of content where only one needs to be
|
|
26
|
+
* seen at a time. **Don't use it for** navigating between pages (use links
|
|
27
|
+
* or `oh-navbar`), or for content people need to compare side by side.
|
|
28
|
+
*
|
|
29
|
+
* **Parts:** pass `items`, an array of `{ id, label, content? }`. A panel
|
|
30
|
+
* shows `content` as text, or else the light-DOM element with
|
|
31
|
+
* `slot="<id>"`. `value` is the selected tab's `id` (defaults to the first).
|
|
32
|
+
*
|
|
33
|
+
* **States:** each tab is selected or not; unselected tabs show an underline
|
|
34
|
+
* on hover.
|
|
35
|
+
*
|
|
36
|
+
* **Behaviour:** click selects a tab. Arrow keys move focus between tabs and
|
|
37
|
+
* wrap (Left/Right, or Up/Down when `orientation="vertical"`; orientation
|
|
38
|
+
* changes the keys only, not the layout); Home/End jump to the first/last.
|
|
39
|
+
* Enter or Space selects the focused tab and moves focus to its panel.
|
|
40
|
+
* Selecting a different tab fires `oh-change`. Transitions are cut short
|
|
41
|
+
* under `prefers-reduced-motion`.
|
|
42
|
+
*
|
|
43
|
+
* **Accessibility:** tablist/tab/tabpanel roles with `aria-selected`,
|
|
44
|
+
* `aria-controls` and `aria-labelledby`; one tab is in the tab order at a
|
|
45
|
+
* time; inactive panels are `hidden`; the active panel is focusable. Keyboard
|
|
46
|
+
* focus shows a solid underline on the tab label and an outline on the panel.
|
|
47
|
+
* Keep labels short.
|
|
48
|
+
*
|
|
49
|
+
* **Look:** set by tokens — `color.brand.primary` the unselected tabs and
|
|
50
|
+
* their hover underline (`decoration.underlineThickness`,
|
|
51
|
+
* `decoration.underlineDash`, `decoration.underlinePeriod`);
|
|
52
|
+
* `color.text.primary`, `color.surface.base` and `color.border.emphasis` the
|
|
53
|
+
* selected tab and panel; `stroke.control` the borders; `shape.control` the
|
|
54
|
+
* tab corners and `shape.container` the panel corners;
|
|
55
|
+
* `typography.body.*` and `typography.label.base.fontWeight` the text;
|
|
56
|
+
* `spacing.*` the padding; `motion.snappy` and `motion.relaxed` the
|
|
57
|
+
* transitions.
|
|
58
|
+
*
|
|
59
|
+
* @element oh-tabs
|
|
60
|
+
* @fires oh-change - When a different tab is selected. `detail: { value }`, the tab's `id`.
|
|
61
|
+
*/
|
|
33
62
|
export declare class OhTabs extends OhElement {
|
|
34
63
|
static styles: import("lit").CSSResult[];
|
|
35
|
-
/**
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
/**
|
|
40
|
-
* ID of the currently selected tab
|
|
41
|
-
*/
|
|
42
|
-
selected: string;
|
|
64
|
+
/** The tabs: `{ id, label, content? }`. In HTML, a JSON array */
|
|
65
|
+
items: TabItem[];
|
|
66
|
+
/** The selected tab's `id`. Defaults to the first tab */
|
|
67
|
+
value: string;
|
|
43
68
|
/**
|
|
44
69
|
* Orientation of the tabs (affects arrow key behavior)
|
|
45
70
|
*/
|
package/dist/oh-tabs.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"oh-tabs.d.ts","sourceRoot":"","sources":["../src/oh-tabs.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"oh-tabs.d.ts","sourceRoot":"","sources":["../src/oh-tabs.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAIH,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,WAAW,OAAO;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,qBACa,MAAO,SAAQ,SAAS;IACnC,OAAgB,MAAM,4BAqKpB;IAEF,iEAAiE;IAEjE,KAAK,EAAE,OAAO,EAAE,CAAM;IAEtB,yDAAyD;IAEzD,KAAK,SAAM;IAEX;;OAEG;IAEH,WAAW,EAAE,YAAY,GAAG,UAAU,CAAgB;IAEtD;;OAEG;IAEH,OAAO,CAAC,aAAa,CAAK;IAE1B;;OAEG;IACH,OAAO,CAAC,SAAS,CAAwD;IAEhE,iBAAiB;IAajB,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAMxD;;;OAGG;YACW,cAAc;IAuE5B;;OAEG;IACH,OAAO,CAAC,WAAW;IAMnB;;OAEG;IACH,OAAO,CAAC,SAAS;IAMjB;;OAEG;IACH,OAAO,CAAC,UAAU;IASlB;;OAEG;IACH,OAAO,CAAC,eAAe;IAKvB,MAAM;CA2DP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,MAAM,CAAC;KACnB;CACF"}
|