@cloudgrid-io/ui 0.38.1 → 0.40.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 +9 -5
- package/dist/badge/palette.d.ts +1 -1
- package/dist/badge/palette.d.ts.map +1 -1
- package/dist/badge/palette.js +2 -2
- package/dist/badge/palette.js.map +1 -1
- package/dist/blocks/avatar-picker.d.ts +105 -0
- package/dist/blocks/avatar-picker.d.ts.map +1 -0
- package/dist/blocks/avatar-picker.js +120 -0
- package/dist/blocks/avatar-picker.js.map +1 -0
- package/dist/blocks/avatar.d.ts +10 -3
- package/dist/blocks/avatar.d.ts.map +1 -1
- package/dist/blocks/avatar.js +8 -1
- package/dist/blocks/avatar.js.map +1 -1
- package/dist/blocks/icons.d.ts +37 -0
- package/dist/blocks/icons.d.ts.map +1 -1
- package/dist/blocks/icons.js +37 -0
- package/dist/blocks/icons.js.map +1 -1
- package/dist/blocks/phosphor-marks.d.ts +42 -0
- package/dist/blocks/phosphor-marks.d.ts.map +1 -1
- package/dist/blocks/phosphor-marks.js +63 -0
- package/dist/blocks/phosphor-marks.js.map +1 -1
- package/dist/blocks/plugged-dialog.d.ts +102 -0
- package/dist/blocks/plugged-dialog.d.ts.map +1 -0
- package/dist/blocks/plugged-dialog.js +93 -0
- package/dist/blocks/plugged-dialog.js.map +1 -0
- package/dist/blocks/side-nav.d.ts +12 -2
- package/dist/blocks/side-nav.d.ts.map +1 -1
- package/dist/blocks/side-nav.js +49 -15
- package/dist/blocks/side-nav.js.map +1 -1
- package/dist/console.css +55 -19
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/dist/theme.css +34 -0
- package/dist/tokens/base.json +13 -3
- package/dist/tokens.css +28 -10
- package/dist/tokens.json +2 -1
- package/dist/ui/button.d.ts +1 -1
- package/dist/ui/button.d.ts.map +1 -1
- package/dist/ui/button.js +16 -0
- package/dist/ui/button.js.map +1 -1
- package/dist/ui/dialog.d.ts +6 -0
- package/dist/ui/dialog.d.ts.map +1 -1
- package/dist/ui/dialog.js +7 -1
- package/dist/ui/dialog.js.map +1 -1
- package/dist/ui/drawer.d.ts +6 -4
- package/dist/ui/drawer.d.ts.map +1 -1
- package/dist/ui/drawer.js +7 -5
- package/dist/ui/drawer.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -45,10 +45,14 @@ The order matters, and getting it wrong fails quietly rather than loudly.
|
|
|
45
45
|
- `theme.css` maps Tailwind utilities onto the tokens. Before `tokens.css` has run there is
|
|
46
46
|
nothing to map, so every utility resolves to nothing and the page renders unstyled
|
|
47
47
|
instead of erroring.
|
|
48
|
-
- `console.css` is a **product preset**, not part of the base. It re-declares the body
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
48
|
+
- `console.css` is a **product preset**, not part of the base. It re-declares the body face
|
|
49
|
+
as the UI face, Manrope, and leaves the display face on Tanker, as the CloudGrid 2026
|
|
50
|
+
Figma has it (#371). The CloudGrid Console imports it; so should any product whose body
|
|
51
|
+
type is the UI face. Everyone else leaves the line out and keeps the default. The
|
|
52
|
+
Console's five type roles, as tokens: **Body** `text-body-sm` (15 / 1.46), **Body Bold**
|
|
53
|
+
`text-body-sm font-bold`, **Small** `text-caption` (13 / 1.46), **H4**
|
|
54
|
+
`text-heading-lg font-medium` (22 / 1.2), **Headline** `font-display` (Tanker). A page
|
|
55
|
+
picks a role, not a size. It has to sit **after `tokens.css`**, which is what it
|
|
52
56
|
re-declares: import it before `tokens.css` and the default face wins at equal specificity,
|
|
53
57
|
silently. Its position relative to `theme.css` does not matter. `theme.css` is
|
|
54
58
|
`@theme inline`, so the utilities it emits are live `var()` references that resolve
|
|
@@ -150,7 +154,7 @@ rest).
|
|
|
150
154
|
| | |
|
|
151
155
|
|---|---|
|
|
152
156
|
| `@cloudgrid-io/ui/tokens.css` | every value as a CSS custom property |
|
|
153
|
-
| `@cloudgrid-io/ui/console.css` | product preset: body
|
|
157
|
+
| `@cloudgrid-io/ui/console.css` | product preset: body type set to Manrope, headlines stay Tanker |
|
|
154
158
|
| `@cloudgrid-io/ui/docs.css` | product preset: the Starlight docs site, light only, see below |
|
|
155
159
|
| `@cloudgrid-io/ui/expressive-code` | the docs site's code blocks: Expressive Code theme and overrides, monochrome on ink |
|
|
156
160
|
| `@cloudgrid-io/ui/theme.css` | maps Tailwind utilities onto the tokens |
|
package/dist/badge/palette.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/** Every badge token as one declaration list, for the badge root's rule. */
|
|
2
|
-
export declare const BADGE_TOKEN_DECLARATIONS = "--cg-primary:#5a47f0;--cg-primary-press:#4b39db;--cg-primary-tint:#eeecfe;--cg-secondary:#b6de68;--cg-secondary-press:#a6cf57;--cg-tertiary:#60e9f0;--cg-tertiary-press:#4dd8e0;--cg-accent:#0061f0;--cg-cyan-200:#dffbfc;--cg-lime-200:#eef7dc;--cg-surface-card:#ffffff;--cg-surface-raised:#f4f6f8;--cg-surface-control:#e3e3e3;--cg-surface-subtle:#f2f1f7;--cg-hover:rgba(34, 34, 34, 0.045);--cg-scrim:rgba(
|
|
2
|
+
export declare const BADGE_TOKEN_DECLARATIONS = "--cg-primary:#5a47f0;--cg-primary-press:#4b39db;--cg-primary-tint:#eeecfe;--cg-secondary:#b6de68;--cg-secondary-press:#a6cf57;--cg-tertiary:#60e9f0;--cg-tertiary-press:#4dd8e0;--cg-accent:#0061f0;--cg-cyan-200:#dffbfc;--cg-lime-200:#eef7dc;--cg-surface-card:#ffffff;--cg-surface-raised:#f4f6f8;--cg-surface-control:#e3e3e3;--cg-surface-subtle:#f2f1f7;--cg-hover:rgba(34, 34, 34, 0.045);--cg-scrim:rgba(46, 30, 172, 0.46);--cg-text-primary:#222222;--cg-text-secondary:#595959;--cg-text-muted:#858585;--cg-text-muted-strong:#6a6a6a;--cg-text-placeholder:#acacac;--cg-text-accent:#5a47f0;--cg-text-on-primary:#ffffff;--cg-text-on-accent:#222222;--cg-border-hairline:#e6e8ea;--cg-border-control:#e3e3e3;--cg-border-accent:#5a47f0;--cg-focus-ring:rgba(90, 71, 240, 0.28);--cg-online:#00a05c;--cg-online-fill:#e6f7ef;--cg-online-strong:#085d3a;--cg-expired-fill:#fdf3e0;--cg-expired-border:#fedf89;--cg-expired-strong:#7a3d0a;--cg-font-ui:'Manrope Variable', 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;--cg-font-body:'Space Grotesk Variable', 'Space Grotesk', 'Manrope Variable', 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;--cg-font-mono:'JetBrains Mono Variable', 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;--cg-weight-regular:400;--cg-weight-medium:500;--cg-weight-bold:600;--cg-body-18:18px;--cg-body-md:16px;--cg-body-sm:15px;--cg-body-14:14px;--cg-caption:13px;--cg-body-line:1.46;--cg-mono-size:14px;--cg-mono-line:1.7;--cg-radius-xs:8px;--cg-radius-sm:10px;--cg-radius-md:12px;--cg-radius-lg:14px;--cg-radius-xl:16px;--cg-radius-container:20px;--cg-radius-pill:999px;--cg-shadow-card:0 4px 16px rgba(34, 34, 34, 0.04), 0 4px 4px rgba(34, 34, 34, 0.04);--cg-shadow-hover:0 8px 24px rgba(34, 34, 34, 0.08);--cg-shadow-card-hover:0 8px 24px rgba(34, 34, 34, 0.08), 0 4px 6px rgba(34, 34, 34, 0.06);--cg-shadow-panel:0 10px 40px rgba(90, 71, 240, 0.18);--cg-duration-fast:120ms;--cg-duration:180ms;--cg-duration-slow:280ms;--cg-ease-out:cubic-bezier(0, 0, 0.2, 1);--cg-ease-out-expo:cubic-bezier(0.16, 1, 0.3, 1);--cg-ease-out-quint:cubic-bezier(0.22, 1, 0.36, 1);--cg-ease-out-quart:cubic-bezier(0.25, 1, 0.5, 1);--cg-ease-in-out-cubic:cubic-bezier(0.65, 0, 0.35, 1);--cg-ease-in:cubic-bezier(0.5, 0, 0.75, 0);--cg-ease-spring:cubic-bezier(0.34, 1.56, 0.64, 1);--cg-ease-spring-damped:linear(0, 0.034, 0.122, 0.244, 0.383, 0.526, 0.662, 0.785, 0.889, 0.974, 1.038, 1.083, 1.111, 1.124, 1.126, 1.119, 1.106, 1.09, 1.072, 1.054, 1.038, 1.023, 1.01, 1, 0.993, 0.988, 0.985, 0.984, 0.984, 0.985, 0.987, 0.989, 0.992, 0.994, 0.996, 0.998, 0.999, 1, 1.001, 1.002, 1);";
|
|
3
3
|
/** The same values as a map, for tests and the gallery. Not needed at runtime. */
|
|
4
4
|
export declare const BADGE_TOKENS: Readonly<Record<string, string>>;
|
|
5
5
|
/** `--cg-font-ui`: Manrope. The tab label and button labels. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"palette.d.ts","sourceRoot":"","sources":["../../src/badge/palette.ts"],"names":[],"mappings":"AAMA,4EAA4E;AAC5E,eAAO,MAAM,wBAAwB,
|
|
1
|
+
{"version":3,"file":"palette.d.ts","sourceRoot":"","sources":["../../src/badge/palette.ts"],"names":[],"mappings":"AAMA,4EAA4E;AAC5E,eAAO,MAAM,wBAAwB,8kFACwiF,CAAA;AAE7kF,kFAAkF;AAClF,eAAO,MAAM,YAAY,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAuEzD,CAAA;AAED,gEAAgE;AAChE,eAAO,MAAM,aAAa,6FAA6F,CAAA;AAEvH,iEAAiE;AACjE,eAAO,MAAM,eAAe,wIAAwI,CAAA;AAEpK;;;;;;GAMG;AACH,eAAO,MAAM,gBAAgB,EAAE,aAAa,CAAC;IAC3C,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,YAAY,EAAE,MAAM,CAAA;CACrB,CAGA,CAAA"}
|
package/dist/badge/palette.js
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
// carries its token values with it. Each is the resolved value of the token of
|
|
5
5
|
// the same name at :root. Retune the token and rebuild; this file follows.
|
|
6
6
|
/** Every badge token as one declaration list, for the badge root's rule. */
|
|
7
|
-
export const BADGE_TOKEN_DECLARATIONS = "--cg-primary:#5a47f0;--cg-primary-press:#4b39db;--cg-primary-tint:#eeecfe;--cg-secondary:#b6de68;--cg-secondary-press:#a6cf57;--cg-tertiary:#60e9f0;--cg-tertiary-press:#4dd8e0;--cg-accent:#0061f0;--cg-cyan-200:#dffbfc;--cg-lime-200:#eef7dc;--cg-surface-card:#ffffff;--cg-surface-raised:#f4f6f8;--cg-surface-control:#e3e3e3;--cg-surface-subtle:#f2f1f7;--cg-hover:rgba(34, 34, 34, 0.045);--cg-scrim:rgba(
|
|
7
|
+
export const BADGE_TOKEN_DECLARATIONS = "--cg-primary:#5a47f0;--cg-primary-press:#4b39db;--cg-primary-tint:#eeecfe;--cg-secondary:#b6de68;--cg-secondary-press:#a6cf57;--cg-tertiary:#60e9f0;--cg-tertiary-press:#4dd8e0;--cg-accent:#0061f0;--cg-cyan-200:#dffbfc;--cg-lime-200:#eef7dc;--cg-surface-card:#ffffff;--cg-surface-raised:#f4f6f8;--cg-surface-control:#e3e3e3;--cg-surface-subtle:#f2f1f7;--cg-hover:rgba(34, 34, 34, 0.045);--cg-scrim:rgba(46, 30, 172, 0.46);--cg-text-primary:#222222;--cg-text-secondary:#595959;--cg-text-muted:#858585;--cg-text-muted-strong:#6a6a6a;--cg-text-placeholder:#acacac;--cg-text-accent:#5a47f0;--cg-text-on-primary:#ffffff;--cg-text-on-accent:#222222;--cg-border-hairline:#e6e8ea;--cg-border-control:#e3e3e3;--cg-border-accent:#5a47f0;--cg-focus-ring:rgba(90, 71, 240, 0.28);--cg-online:#00a05c;--cg-online-fill:#e6f7ef;--cg-online-strong:#085d3a;--cg-expired-fill:#fdf3e0;--cg-expired-border:#fedf89;--cg-expired-strong:#7a3d0a;--cg-font-ui:'Manrope Variable', 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;--cg-font-body:'Space Grotesk Variable', 'Space Grotesk', 'Manrope Variable', 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;--cg-font-mono:'JetBrains Mono Variable', 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;--cg-weight-regular:400;--cg-weight-medium:500;--cg-weight-bold:600;--cg-body-18:18px;--cg-body-md:16px;--cg-body-sm:15px;--cg-body-14:14px;--cg-caption:13px;--cg-body-line:1.46;--cg-mono-size:14px;--cg-mono-line:1.7;--cg-radius-xs:8px;--cg-radius-sm:10px;--cg-radius-md:12px;--cg-radius-lg:14px;--cg-radius-xl:16px;--cg-radius-container:20px;--cg-radius-pill:999px;--cg-shadow-card:0 4px 16px rgba(34, 34, 34, 0.04), 0 4px 4px rgba(34, 34, 34, 0.04);--cg-shadow-hover:0 8px 24px rgba(34, 34, 34, 0.08);--cg-shadow-card-hover:0 8px 24px rgba(34, 34, 34, 0.08), 0 4px 6px rgba(34, 34, 34, 0.06);--cg-shadow-panel:0 10px 40px rgba(90, 71, 240, 0.18);--cg-duration-fast:120ms;--cg-duration:180ms;--cg-duration-slow:280ms;--cg-ease-out:cubic-bezier(0, 0, 0.2, 1);--cg-ease-out-expo:cubic-bezier(0.16, 1, 0.3, 1);--cg-ease-out-quint:cubic-bezier(0.22, 1, 0.36, 1);--cg-ease-out-quart:cubic-bezier(0.25, 1, 0.5, 1);--cg-ease-in-out-cubic:cubic-bezier(0.65, 0, 0.35, 1);--cg-ease-in:cubic-bezier(0.5, 0, 0.75, 0);--cg-ease-spring:cubic-bezier(0.34, 1.56, 0.64, 1);--cg-ease-spring-damped:linear(0, 0.034, 0.122, 0.244, 0.383, 0.526, 0.662, 0.785, 0.889, 0.974, 1.038, 1.083, 1.111, 1.124, 1.126, 1.119, 1.106, 1.09, 1.072, 1.054, 1.038, 1.023, 1.01, 1, 0.993, 0.988, 0.985, 0.984, 0.984, 0.985, 0.987, 0.989, 0.992, 0.994, 0.996, 0.998, 0.999, 1, 1.001, 1.002, 1);";
|
|
8
8
|
/** The same values as a map, for tests and the gallery. Not needed at runtime. */
|
|
9
9
|
export const BADGE_TOKENS = {
|
|
10
10
|
"--cg-primary": "#5a47f0",
|
|
@@ -22,7 +22,7 @@ export const BADGE_TOKENS = {
|
|
|
22
22
|
"--cg-surface-control": "#e3e3e3",
|
|
23
23
|
"--cg-surface-subtle": "#f2f1f7",
|
|
24
24
|
"--cg-hover": "rgba(34, 34, 34, 0.045)",
|
|
25
|
-
"--cg-scrim": "rgba(
|
|
25
|
+
"--cg-scrim": "rgba(46, 30, 172, 0.46)",
|
|
26
26
|
"--cg-text-primary": "#222222",
|
|
27
27
|
"--cg-text-secondary": "#595959",
|
|
28
28
|
"--cg-text-muted": "#858585",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"palette.js","sourceRoot":"","sources":["../../src/badge/palette.ts"],"names":[],"mappings":"AAAA,yEAAyE;AACzE,EAAE;AACF,2EAA2E;AAC3E,+EAA+E;AAC/E,2EAA2E;AAE3E,4EAA4E;AAC5E,MAAM,CAAC,MAAM,wBAAwB,GACnC,
|
|
1
|
+
{"version":3,"file":"palette.js","sourceRoot":"","sources":["../../src/badge/palette.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { type AvatarDiameter } from "./avatar.js";
|
|
3
|
+
/**
|
|
4
|
+
* A person's own avatar, pressed to choose a new photo (#367).
|
|
5
|
+
*
|
|
6
|
+
* The Console's profile page (cloudgrid-console#944): click the picture, pick
|
|
7
|
+
* an image, done. No crop screen. `Avatar` stays a server component with its
|
|
8
|
+
* API unchanged; this is the client block that wraps it.
|
|
9
|
+
*
|
|
10
|
+
* ## A real button, and a file input nobody sees
|
|
11
|
+
*
|
|
12
|
+
* The control is a `<button>`, so Tab, Enter, Space, the focus ring and the
|
|
13
|
+
* accessible name all come from the browser. Pressing it calls `click()` on a
|
|
14
|
+
* hidden `<input type="file">`, which is the native picker with nothing
|
|
15
|
+
* hand-rolled. The input is `hidden` and `tabIndex={-1}`, so there is one stop
|
|
16
|
+
* in the tab order and one name, not two. `DropZone` wraps its input in a
|
|
17
|
+
* label instead, because there the input IS the control; here the picture is.
|
|
18
|
+
*
|
|
19
|
+
* ## Which file goes where
|
|
20
|
+
*
|
|
21
|
+
* `routeAvatarFile` is the whole decision and is exported so it can be tested
|
|
22
|
+
* without a browser: a file whose type is not in `accept` goes to
|
|
23
|
+
* `onReject(file, "type")`, one over `maxBytes` to `onReject(file, "size")`,
|
|
24
|
+
* and anything else to `onSelectFile(file)`, once. The type is judged first: a
|
|
25
|
+
* smaller GIF still would not do, so "type" is the more useful reason. `accept`
|
|
26
|
+
* on the input only filters the picker's list, and "All files" is one click
|
|
27
|
+
* away in every OS dialog, so the check runs again on what comes back.
|
|
28
|
+
*
|
|
29
|
+
* The input's value is cleared after every pick. Without that, choosing the
|
|
30
|
+
* same file again fires no change event, and a person whose first try failed
|
|
31
|
+
* presses the picture, picks the photo again and nothing happens.
|
|
32
|
+
*
|
|
33
|
+
* The block makes no network call. The upload, the error line under the
|
|
34
|
+
* picture and the "Remove photo" link are the Console's.
|
|
35
|
+
*
|
|
36
|
+
* ## The mark, on hover and on keyboard focus
|
|
37
|
+
*
|
|
38
|
+
* Phosphor `camera` (`ChangePhotoIcon`) over a strong scrim, faded in on
|
|
39
|
+
* `:hover` and on `:focus-visible`. Hover alone would tell a mouse user the
|
|
40
|
+
* picture is pressable and tell a keyboard user nothing.
|
|
41
|
+
*
|
|
42
|
+
* ## Pending
|
|
43
|
+
*
|
|
44
|
+
* The house convention (`ConfirmDeleteDialog`): `pending` disables the control.
|
|
45
|
+
* A `Spinner` replaces the mark over the picture, the button carries
|
|
46
|
+
* `aria-busy`, and the button and the input are both `disabled`, so neither a
|
|
47
|
+
* press nor a stray `click()` opens a second picker mid-upload. The spinner is
|
|
48
|
+
* decorative: a status role inside a button is flattened into the button's
|
|
49
|
+
* name, and the button already says what it is.
|
|
50
|
+
*
|
|
51
|
+
* ## On any surface
|
|
52
|
+
*
|
|
53
|
+
* Both overlays are `data-cg-surface="ink"` on `bg-scrim-strong`, the scrim
|
|
54
|
+
* measured for marks laid over an arbitrary picture. The ink scope flips the
|
|
55
|
+
* spinner's arc to lime and its track to the ink hairline, and `text-ink` to
|
|
56
|
+
* white, so the overlay reads the same over a white photo, the initials, a
|
|
57
|
+
* purple panel or ink. The ring is `ring-ring`, which flips per surface.
|
|
58
|
+
* Tokens only.
|
|
59
|
+
*/
|
|
60
|
+
/** The picker's default list: JPG, PNG and WebP. */
|
|
61
|
+
export declare const AVATAR_PICKER_ACCEPT = "image/jpeg,image/png,image/webp";
|
|
62
|
+
/** The button's accessible name, when the caller does not pass one. */
|
|
63
|
+
export declare const AVATAR_PICKER_LABEL = "Change photo";
|
|
64
|
+
/** Why a picked file was turned away. */
|
|
65
|
+
export type AvatarPickerRejection = "type" | "size";
|
|
66
|
+
/** The three things `routeAvatarFile` reads off a `File`. */
|
|
67
|
+
type PickedFile = Pick<File, "name" | "type" | "size">;
|
|
68
|
+
/**
|
|
69
|
+
* Sends one picked file to exactly one callback. Exported for tests, and for a
|
|
70
|
+
* caller that takes files from somewhere else (a paste, a drop) and wants the
|
|
71
|
+
* same rules.
|
|
72
|
+
*/
|
|
73
|
+
export declare function routeAvatarFile<F extends PickedFile>(f: F, { accept, maxBytes, onSelectFile, onReject, }: {
|
|
74
|
+
accept?: string;
|
|
75
|
+
maxBytes?: number;
|
|
76
|
+
onSelectFile: (file: F) => void;
|
|
77
|
+
onReject?: (file: F, reason: AvatarPickerRejection) => void;
|
|
78
|
+
}): void;
|
|
79
|
+
export type AvatarPickerProps = {
|
|
80
|
+
/** Whose picture this is. The initials, and the hue unless `seed` is given. */
|
|
81
|
+
name: string;
|
|
82
|
+
/** What the hue is derived from: a stable id, so a rename keeps the colour. */
|
|
83
|
+
seed?: string;
|
|
84
|
+
/** The current picture. A miss falls back to the initials. */
|
|
85
|
+
src?: string;
|
|
86
|
+
/** The diameter, from `Avatar`'s ramp. Defaults to 56, the profile header's. */
|
|
87
|
+
size?: AvatarDiameter;
|
|
88
|
+
/** A good file, after the type and size checks. The caller uploads it. */
|
|
89
|
+
onSelectFile: (file: File) => void;
|
|
90
|
+
/** A file that failed a check, and which one. */
|
|
91
|
+
onReject?: (file: File, reason: AvatarPickerRejection) => void;
|
|
92
|
+
/** The native attribute's syntax. Defaults to JPG, PNG and WebP. */
|
|
93
|
+
accept?: string;
|
|
94
|
+
/** The largest file accepted, in bytes, inclusive. No limit when omitted. */
|
|
95
|
+
maxBytes?: number;
|
|
96
|
+
/** The caller's upload is running: a spinner, `aria-busy`, and no picker. */
|
|
97
|
+
pending?: boolean;
|
|
98
|
+
disabled?: boolean;
|
|
99
|
+
/** The button's accessible name. Defaults to "Change photo". */
|
|
100
|
+
label?: string;
|
|
101
|
+
className?: string;
|
|
102
|
+
};
|
|
103
|
+
declare function AvatarPicker({ name, seed, src, size, onSelectFile, onReject, accept, maxBytes, pending, disabled, label, className, }: AvatarPickerProps): React.JSX.Element;
|
|
104
|
+
export { AvatarPicker };
|
|
105
|
+
//# sourceMappingURL=avatar-picker.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-picker.d.ts","sourceRoot":"","sources":["../../src/blocks/avatar-picker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAU,KAAK,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAIlE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwDG;AAEH,oDAAoD;AACpD,eAAO,MAAM,oBAAoB,oCAAoC,CAAA;AAErE,uEAAuE;AACvE,eAAO,MAAM,mBAAmB,iBAAiB,CAAA;AAEjD,yCAAyC;AACzC,MAAM,MAAM,qBAAqB,GAAG,MAAM,GAAG,MAAM,CAAA;AAEnD,6DAA6D;AAC7D,KAAK,UAAU,GAAG,IAAI,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA;AAqBtD;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,CAAC,SAAS,UAAU,EAClD,CAAC,EAAE,CAAC,EACJ,EACE,MAA6B,EAC7B,QAAQ,EACR,YAAY,EACZ,QAAQ,GACT,EAAE;IACD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,YAAY,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAA;IAC/B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,qBAAqB,KAAK,IAAI,CAAA;CAC5D,QAKF;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,+EAA+E;IAC/E,IAAI,EAAE,MAAM,CAAA;IACZ,+EAA+E;IAC/E,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,8DAA8D;IAC9D,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,gFAAgF;IAChF,IAAI,CAAC,EAAE,cAAc,CAAA;IACrB,0EAA0E;IAC1E,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAA;IAClC,iDAAiD;IACjD,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,qBAAqB,KAAK,IAAI,CAAA;IAC9D,oEAAoE;IACpE,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,6EAA6E;IAC7E,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,6EAA6E;IAC7E,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,gEAAgE;IAChE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAKD,iBAAS,YAAY,CAAC,EACpB,IAAI,EACJ,IAAI,EACJ,GAAG,EACH,IAAS,EACT,YAAY,EACZ,QAAQ,EACR,MAA6B,EAC7B,QAAQ,EACR,OAAe,EACf,QAAgB,EAChB,KAA2B,EAC3B,SAAS,GACV,EAAE,iBAAiB,qBAiEnB;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}
|
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import { cn } from "../lib/cloudgrid-cn.js";
|
|
5
|
+
import { Avatar } from "./avatar.js";
|
|
6
|
+
import { ChangePhotoIcon } from "./icons.js";
|
|
7
|
+
import { Spinner } from "../ui/spinner.js";
|
|
8
|
+
/**
|
|
9
|
+
* A person's own avatar, pressed to choose a new photo (#367).
|
|
10
|
+
*
|
|
11
|
+
* The Console's profile page (cloudgrid-console#944): click the picture, pick
|
|
12
|
+
* an image, done. No crop screen. `Avatar` stays a server component with its
|
|
13
|
+
* API unchanged; this is the client block that wraps it.
|
|
14
|
+
*
|
|
15
|
+
* ## A real button, and a file input nobody sees
|
|
16
|
+
*
|
|
17
|
+
* The control is a `<button>`, so Tab, Enter, Space, the focus ring and the
|
|
18
|
+
* accessible name all come from the browser. Pressing it calls `click()` on a
|
|
19
|
+
* hidden `<input type="file">`, which is the native picker with nothing
|
|
20
|
+
* hand-rolled. The input is `hidden` and `tabIndex={-1}`, so there is one stop
|
|
21
|
+
* in the tab order and one name, not two. `DropZone` wraps its input in a
|
|
22
|
+
* label instead, because there the input IS the control; here the picture is.
|
|
23
|
+
*
|
|
24
|
+
* ## Which file goes where
|
|
25
|
+
*
|
|
26
|
+
* `routeAvatarFile` is the whole decision and is exported so it can be tested
|
|
27
|
+
* without a browser: a file whose type is not in `accept` goes to
|
|
28
|
+
* `onReject(file, "type")`, one over `maxBytes` to `onReject(file, "size")`,
|
|
29
|
+
* and anything else to `onSelectFile(file)`, once. The type is judged first: a
|
|
30
|
+
* smaller GIF still would not do, so "type" is the more useful reason. `accept`
|
|
31
|
+
* on the input only filters the picker's list, and "All files" is one click
|
|
32
|
+
* away in every OS dialog, so the check runs again on what comes back.
|
|
33
|
+
*
|
|
34
|
+
* The input's value is cleared after every pick. Without that, choosing the
|
|
35
|
+
* same file again fires no change event, and a person whose first try failed
|
|
36
|
+
* presses the picture, picks the photo again and nothing happens.
|
|
37
|
+
*
|
|
38
|
+
* The block makes no network call. The upload, the error line under the
|
|
39
|
+
* picture and the "Remove photo" link are the Console's.
|
|
40
|
+
*
|
|
41
|
+
* ## The mark, on hover and on keyboard focus
|
|
42
|
+
*
|
|
43
|
+
* Phosphor `camera` (`ChangePhotoIcon`) over a strong scrim, faded in on
|
|
44
|
+
* `:hover` and on `:focus-visible`. Hover alone would tell a mouse user the
|
|
45
|
+
* picture is pressable and tell a keyboard user nothing.
|
|
46
|
+
*
|
|
47
|
+
* ## Pending
|
|
48
|
+
*
|
|
49
|
+
* The house convention (`ConfirmDeleteDialog`): `pending` disables the control.
|
|
50
|
+
* A `Spinner` replaces the mark over the picture, the button carries
|
|
51
|
+
* `aria-busy`, and the button and the input are both `disabled`, so neither a
|
|
52
|
+
* press nor a stray `click()` opens a second picker mid-upload. The spinner is
|
|
53
|
+
* decorative: a status role inside a button is flattened into the button's
|
|
54
|
+
* name, and the button already says what it is.
|
|
55
|
+
*
|
|
56
|
+
* ## On any surface
|
|
57
|
+
*
|
|
58
|
+
* Both overlays are `data-cg-surface="ink"` on `bg-scrim-strong`, the scrim
|
|
59
|
+
* measured for marks laid over an arbitrary picture. The ink scope flips the
|
|
60
|
+
* spinner's arc to lime and its track to the ink hairline, and `text-ink` to
|
|
61
|
+
* white, so the overlay reads the same over a white photo, the initials, a
|
|
62
|
+
* purple panel or ink. The ring is `ring-ring`, which flips per surface.
|
|
63
|
+
* Tokens only.
|
|
64
|
+
*/
|
|
65
|
+
/** The picker's default list: JPG, PNG and WebP. */
|
|
66
|
+
export const AVATAR_PICKER_ACCEPT = "image/jpeg,image/png,image/webp";
|
|
67
|
+
/** The button's accessible name, when the caller does not pass one. */
|
|
68
|
+
export const AVATAR_PICKER_LABEL = "Change photo";
|
|
69
|
+
/**
|
|
70
|
+
* `accept` in the native attribute's syntax: MIME types, `type/*` wildcards
|
|
71
|
+
* and `.ext` suffixes, comma-separated. The same reading `DropZone` gives it.
|
|
72
|
+
*/
|
|
73
|
+
function acceptsFile(f, accept) {
|
|
74
|
+
const patterns = accept
|
|
75
|
+
.split(",")
|
|
76
|
+
.map((a) => a.trim().toLowerCase())
|
|
77
|
+
.filter(Boolean);
|
|
78
|
+
if (patterns.length === 0)
|
|
79
|
+
return true;
|
|
80
|
+
const name = f.name.toLowerCase();
|
|
81
|
+
const type = f.type.toLowerCase();
|
|
82
|
+
return patterns.some((p) => {
|
|
83
|
+
if (p.startsWith("."))
|
|
84
|
+
return name.endsWith(p);
|
|
85
|
+
if (p.endsWith("/*"))
|
|
86
|
+
return type.startsWith(p.slice(0, -1));
|
|
87
|
+
return type === p;
|
|
88
|
+
});
|
|
89
|
+
}
|
|
90
|
+
/**
|
|
91
|
+
* Sends one picked file to exactly one callback. Exported for tests, and for a
|
|
92
|
+
* caller that takes files from somewhere else (a paste, a drop) and wants the
|
|
93
|
+
* same rules.
|
|
94
|
+
*/
|
|
95
|
+
export function routeAvatarFile(f, { accept = AVATAR_PICKER_ACCEPT, maxBytes, onSelectFile, onReject, }) {
|
|
96
|
+
if (!acceptsFile(f, accept))
|
|
97
|
+
return onReject?.(f, "type");
|
|
98
|
+
if (maxBytes !== undefined && f.size > maxBytes)
|
|
99
|
+
return onReject?.(f, "size");
|
|
100
|
+
onSelectFile(f);
|
|
101
|
+
}
|
|
102
|
+
const OVERLAY = "absolute inset-0 grid place-items-center rounded-pill bg-scrim-strong text-ink";
|
|
103
|
+
function AvatarPicker({ name, seed, src, size = 56, onSelectFile, onReject, accept = AVATAR_PICKER_ACCEPT, maxBytes, pending = false, disabled = false, label = AVATAR_PICKER_LABEL, className, }) {
|
|
104
|
+
const input = React.useRef(null);
|
|
105
|
+
const off = disabled || pending;
|
|
106
|
+
return (_jsxs("span", { "data-slot": "avatar-picker", "data-pending": pending || undefined, className: cn("relative inline-flex shrink-0", className), children: [_jsxs("button", { type: "button", "aria-label": label, "aria-busy": pending || undefined, disabled: off, onClick: () => {
|
|
107
|
+
if (off)
|
|
108
|
+
return;
|
|
109
|
+
input.current?.click();
|
|
110
|
+
}, className: cn("group/avatar-picker relative inline-flex shrink-0 cursor-pointer rounded-pill outline-none", "focus-visible:ring-3 focus-visible:ring-ring", "disabled:cursor-not-allowed", disabled && !pending ? "disabled:opacity-50" : ""), children: [_jsx(Avatar, { name: name, seed: seed, src: src, size: size }), pending ? (_jsx("span", { "data-cg-surface": "ink", "aria-hidden": "true", className: OVERLAY, children: _jsx(Spinner, { decorative: true, size: "lg" }) })) : disabled ? null : (_jsx("span", { "data-slot": "avatar-picker-mark", "data-cg-surface": "ink", "aria-hidden": "true", className: cn(OVERLAY, "opacity-0 transition-opacity duration-150 motion-reduce:transition-none", "group-hover/avatar-picker:opacity-100 group-focus-visible/avatar-picker:opacity-100"), children: _jsx(ChangePhotoIcon, { className: "size-[40%] min-h-3.5 min-w-3.5 shrink-0" }) }))] }), _jsx("input", { ref: input, type: "file", accept: accept, disabled: off, hidden: true, tabIndex: -1, onChange: (e) => {
|
|
111
|
+
const picked = e.target.files?.[0];
|
|
112
|
+
// Cleared before routing, so the same file can be picked again even
|
|
113
|
+
// when a callback throws.
|
|
114
|
+
e.target.value = "";
|
|
115
|
+
if (picked)
|
|
116
|
+
routeAvatarFile(picked, { accept, maxBytes, onSelectFile, onReject });
|
|
117
|
+
} })] }));
|
|
118
|
+
}
|
|
119
|
+
export { AvatarPicker };
|
|
120
|
+
//# sourceMappingURL=avatar-picker.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-picker.js","sourceRoot":"","sources":["../../src/blocks/avatar-picker.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AACvC,OAAO,EAAE,MAAM,EAAuB,MAAM,sBAAsB,CAAA;AAClE,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAA;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAE/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwDG;AAEH,oDAAoD;AACpD,MAAM,CAAC,MAAM,oBAAoB,GAAG,iCAAiC,CAAA;AAErE,uEAAuE;AACvE,MAAM,CAAC,MAAM,mBAAmB,GAAG,cAAc,CAAA;AAQjD;;;GAGG;AACH,SAAS,WAAW,CAAC,CAAa,EAAE,MAAc;IAChD,MAAM,QAAQ,GAAG,MAAM;SACpB,KAAK,CAAC,GAAG,CAAC;SACV,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,WAAW,EAAE,CAAC;SAClC,MAAM,CAAC,OAAO,CAAC,CAAA;IAClB,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,IAAI,CAAA;IACtC,MAAM,IAAI,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,EAAE,CAAA;IACjC,MAAM,IAAI,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,EAAE,CAAA;IACjC,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE;QACzB,IAAI,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC;YAAE,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;QAC9C,IAAI,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC;YAAE,OAAO,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;QAC5D,OAAO,IAAI,KAAK,CAAC,CAAA;IACnB,CAAC,CAAC,CAAA;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,eAAe,CAC7B,CAAI,EACJ,EACE,MAAM,GAAG,oBAAoB,EAC7B,QAAQ,EACR,YAAY,EACZ,QAAQ,GAMT;IAED,IAAI,CAAC,WAAW,CAAC,CAAC,EAAE,MAAM,CAAC;QAAE,OAAO,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,CAAC,CAAA;IACzD,IAAI,QAAQ,KAAK,SAAS,IAAI,CAAC,CAAC,IAAI,GAAG,QAAQ;QAAE,OAAO,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,CAAC,CAAA;IAC7E,YAAY,CAAC,CAAC,CAAC,CAAA;AACjB,CAAC;AA2BD,MAAM,OAAO,GACX,gFAAgF,CAAA;AAElF,SAAS,YAAY,CAAC,EACpB,IAAI,EACJ,IAAI,EACJ,GAAG,EACH,IAAI,GAAG,EAAE,EACT,YAAY,EACZ,QAAQ,EACR,MAAM,GAAG,oBAAoB,EAC7B,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,KAAK,GAAG,mBAAmB,EAC3B,SAAS,GACS;IAClB,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAmB,IAAI,CAAC,CAAA;IAClD,MAAM,GAAG,GAAG,QAAQ,IAAI,OAAO,CAAA;IAE/B,OAAO,CACL,6BACY,eAAe,kBACX,OAAO,IAAI,SAAS,EAClC,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE,SAAS,CAAC,aAEzD,kBACE,IAAI,EAAC,QAAQ,gBACD,KAAK,eACN,OAAO,IAAI,SAAS,EAC/B,QAAQ,EAAE,GAAG,EACb,OAAO,EAAE,GAAG,EAAE;oBACZ,IAAI,GAAG;wBAAE,OAAM;oBACf,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,CAAA;gBACxB,CAAC,EACD,SAAS,EAAE,EAAE,CACX,4FAA4F,EAC5F,8CAA8C,EAC9C,6BAA6B,EAC7B,QAAQ,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,CAClD,aAED,KAAC,MAAM,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,GAAI,EACvD,OAAO,CAAC,CAAC,CAAC,CACT,kCAAsB,KAAK,iBAAa,MAAM,EAAC,SAAS,EAAE,OAAO,YAC/D,KAAC,OAAO,IAAC,UAAU,QAAC,IAAI,EAAC,IAAI,GAAG,GAC3B,CACR,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACpB,4BACY,oBAAoB,qBACd,KAAK,iBACT,MAAM,EAClB,SAAS,EAAE,EAAE,CACX,OAAO,EACP,yEAAyE,EACzE,qFAAqF,CACtF,YAID,KAAC,eAAe,IAAC,SAAS,EAAC,yCAAyC,GAAG,GAClE,CACR,IACM,EACT,gBACE,GAAG,EAAE,KAAK,EACV,IAAI,EAAC,MAAM,EACX,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,GAAG,EACb,MAAM,QACN,QAAQ,EAAE,CAAC,CAAC,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;oBACd,MAAM,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAA;oBAClC,oEAAoE;oBACpE,0BAA0B;oBAC1B,CAAC,CAAC,MAAM,CAAC,KAAK,GAAG,EAAE,CAAA;oBACnB,IAAI,MAAM;wBAAE,eAAe,CAAC,MAAM,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,CAAC,CAAA;gBACnF,CAAC,GACD,IACG,CACR,CAAA;AACH,CAAC;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}
|
package/dist/blocks/avatar.d.ts
CHANGED
|
@@ -84,9 +84,16 @@
|
|
|
84
84
|
*
|
|
85
85
|
* Four rungs, so the union still refuses 33 and a mark cannot be an arbitrary
|
|
86
86
|
* diameter. The letters keep working — see `AVATAR_SIZES` below.
|
|
87
|
+
*
|
|
88
|
+
* ## 56 (#367)
|
|
89
|
+
*
|
|
90
|
+
* The fifth rung, inserted the way the paragraph above says a rung is: by the
|
|
91
|
+
* height of something else. The Console's profile header draws its picture at
|
|
92
|
+
* 56 (cloudgrid-console#944), and `AvatarPicker` renders that picture through
|
|
93
|
+
* this ramp. There is no letter for it, for the reason there is none for 32.
|
|
87
94
|
*/
|
|
88
|
-
export declare const AVATAR_DIAMETERS: readonly [18, 24, 32, 38];
|
|
89
|
-
/** 18, 24, 32 or
|
|
95
|
+
export declare const AVATAR_DIAMETERS: readonly [18, 24, 32, 38, 56];
|
|
96
|
+
/** 18, 24, 32, 38 or 56 across. */
|
|
90
97
|
export type AvatarDiameter = (typeof AVATAR_DIAMETERS)[number];
|
|
91
98
|
/**
|
|
92
99
|
* The 0.26 letter names, and what each one was worth in pixels.
|
|
@@ -129,7 +136,7 @@ declare function Avatar({ name, seed, src, alt, size, monogram, className, style
|
|
|
129
136
|
*/
|
|
130
137
|
alt?: string;
|
|
131
138
|
/**
|
|
132
|
-
* The diameter: `18`, `24`, `32` or `
|
|
139
|
+
* The diameter: `18`, `24`, `32`, `38` or `56`.
|
|
133
140
|
*
|
|
134
141
|
* The 0.26 letters — `'s'`, `'m'`, `'l'` — still resolve to 18, 24 and 38
|
|
135
142
|
* through 0.28. They are deprecated; see `AVATAR_DIAMETERS`.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../src/blocks/avatar.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2DG;AAEH
|
|
1
|
+
{"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../src/blocks/avatar.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2DG;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,gBAAgB,+BAAgC,CAAA;AAE7D,mCAAmC;AACnC,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAA;AAE9D;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,YAAY;;;;CAIf,CAAA;AAEV,mEAAmE;AACnE,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,YAAY,CAAA;AAgBlD,iBAAS,MAAM,CAAC,EACd,IAAI,EACJ,IAAI,EACJ,GAAG,EACH,GAAG,EACH,IAAS,EACT,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,UAAU,CAAC,GAAG;IAClD,yFAAyF;IACzF,IAAI,EAAE,MAAM,CAAA;IACZ;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,4EAA4E;IAC5E,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ;;;;;OAKG;IACH,IAAI,CAAC,EAAE,cAAc,GAAG,UAAU,CAAA;IAClC,uEAAuE;IACvE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,+BA2DA;AAED,OAAO,EAAE,MAAM,EAAE,CAAA"}
|
package/dist/blocks/avatar.js
CHANGED
|
@@ -87,8 +87,15 @@ import { entityIdentityLook, entityMonogram } from "./entity-identity.js";
|
|
|
87
87
|
*
|
|
88
88
|
* Four rungs, so the union still refuses 33 and a mark cannot be an arbitrary
|
|
89
89
|
* diameter. The letters keep working — see `AVATAR_SIZES` below.
|
|
90
|
+
*
|
|
91
|
+
* ## 56 (#367)
|
|
92
|
+
*
|
|
93
|
+
* The fifth rung, inserted the way the paragraph above says a rung is: by the
|
|
94
|
+
* height of something else. The Console's profile header draws its picture at
|
|
95
|
+
* 56 (cloudgrid-console#944), and `AvatarPicker` renders that picture through
|
|
96
|
+
* this ramp. There is no letter for it, for the reason there is none for 32.
|
|
90
97
|
*/
|
|
91
|
-
export const AVATAR_DIAMETERS = [18, 24, 32, 38];
|
|
98
|
+
export const AVATAR_DIAMETERS = [18, 24, 32, 38, 56];
|
|
92
99
|
/**
|
|
93
100
|
* The 0.26 letter names, and what each one was worth in pixels.
|
|
94
101
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"avatar.js","sourceRoot":"","sources":["../../src/blocks/avatar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AACvC,OAAO,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAA;AAElF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2DG;AAEH
|
|
1
|
+
{"version":3,"file":"avatar.js","sourceRoot":"","sources":["../../src/blocks/avatar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AACvC,OAAO,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAA;AAElF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2DG;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAU,CAAA;AAK7D;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG;IAC1B,CAAC,EAAE,EAAE;IACL,CAAC,EAAE,EAAE;IACL,CAAC,EAAE,EAAE;CACG,CAAA;AAKV;;;;;;;;;;;GAWG;AACH,MAAM,cAAc,GAAG,IAAI,CAAA;AAE3B,SAAS,MAAM,CAAC,EACd,IAAI,EACJ,IAAI,EACJ,GAAG,EACH,GAAG,EACH,IAAI,GAAG,EAAE,EACT,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EA4BT;IACC,4EAA4E;IAC5E,gEAAgE;IAChE,MAAM,GAAG,GAAG,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC,IAAI,CAAC,CAAA;IAChE,MAAM,IAAI,GAAG,kBAAkB,CAAC,IAAI,IAAI,IAAI,CAAC,CAAA;IAC7C,MAAM,OAAO,GAAG,QAAQ,IAAI,cAAc,CAAC,IAAI,CAAC,CAAA;IAEhD,6EAA6E;IAC7E,uEAAuE;IACvE,MAAM,MAAM,GAAG,GAAG,KAAK,SAAS,CAAA;IAEhC,OAAO,CACL,6BACY,QAAQ,eASP,GAAG,eACH,IAAI,CAAC,IAAI,KAChB,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,EAC3E,SAAS,EAAE,EAAE,CACX,wHAAwH,EACxH,SAAS,CACV,EACD,KAAK,EAAE;YACL,KAAK,EAAE,GAAG;YACV,MAAM,EAAE,GAAG;YACX,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,GAAG,cAAc,GAAG,EAAE,CAAC,GAAG,EAAE;YACpD,UAAU,EAAE,CAAC;YACb,yEAAyE;YACzE,wEAAwE;YACxE,mEAAmE;YACnE,4CAA4C;YAC5C,UAAU,EAAE,0BAA0B,IAAI,CAAC,GAAG,KAAK,IAAI,CAAC,IAAI,kBAAkB;YAC9E,KAAK,EAAE,2BAA2B;YAClC,GAAG,KAAK;SACT,KACG,KAAK,aAET,4BAAgB,iBAAiB,iBAAa,MAAM,YACjD,OAAO,GACH,EACN,GAAG,CAAC,CAAC,CAAC;YACL,sEAAsE;YACtE,+DAA+D;YAC/D,2BACY,cAAc,EACxB,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EACtB,SAAS,EAAC,yCAAyC,GACnD,CACH,CAAC,CAAC,CAAC,IAAI,IACH,CACR,CAAA;AACH,CAAC;AAED,OAAO,EAAE,MAAM,EAAE,CAAA"}
|
package/dist/blocks/icons.d.ts
CHANGED
|
@@ -424,6 +424,15 @@ export { ChatTeardropTextMark as NoteIcon, XBoldMark as CloseBoldIcon, } from ".
|
|
|
424
424
|
* and not `CommentsIcon` (`chat-circle`), which counts comments.
|
|
425
425
|
*/
|
|
426
426
|
export { ChatCenteredTextMark as LeaveCommentIcon, } from "./phosphor-marks.js";
|
|
427
|
+
/**
|
|
428
|
+
* The clickable avatar (#367).
|
|
429
|
+
*
|
|
430
|
+
* `ChangePhotoIcon` is Phosphor `camera`: the mark `AvatarPicker` lays over a
|
|
431
|
+
* person's own picture on hover and on keyboard focus, so it reads as
|
|
432
|
+
* something to press. It names the act, not the device, so a surface that
|
|
433
|
+
* means "take a picture" asks for its own role rather than borrowing this one.
|
|
434
|
+
*/
|
|
435
|
+
export { CameraMark as ChangePhotoIcon, } from "./phosphor-marks.js";
|
|
427
436
|
/**
|
|
428
437
|
* The App page v2 (#331, Figma 10789:8587): the KPI row's marks, the Ask
|
|
429
438
|
* button, the growth line under the views chart, and the pair of controls that
|
|
@@ -456,6 +465,34 @@ export { ChatCenteredTextMark as LeaveCommentIcon, } from "./phosphor-marks.js";
|
|
|
456
465
|
export { UsersThreeMark as AudienceIcon, GitForkMark as PickupsIcon, ChatCircleTextMark as CommentsStatIcon, TrendUpMark as GrowthIcon, UserSwitchMark as ActiveUsersIcon, ChatTeardropDotsMark as AskIcon, ArrowsOutMark as FullScreenIcon, ArrowsInMark as ExitFullScreenIcon, TimerMark as DurationIcon, PlugsConnectedMark as LiveIcon, } from "./phosphor-marks.js";
|
|
457
466
|
/** The weight departures, each replacing a numeric prop lucide used to carry. */
|
|
458
467
|
export { PulseBoldMark as ActivityBoldIcon, CompassBoldMark as DiscoverBoldIcon, StackBoldMark as LayersBoldIcon, UserBoldMark as PersonBoldIcon, HouseSimpleBoldMark as HomeBoldIcon, GridFourBoldMark as SpaceBoldIcon, PushPinFillMark as SaveFilledIcon, } from "./phosphor-marks.js";
|
|
468
|
+
/**
|
|
469
|
+
* The 2026 menu (#377, Figma 7414:5979, the Admin frame's left column).
|
|
470
|
+
*
|
|
471
|
+
* Two new content roles, for the two glyphs the frame draws that had none:
|
|
472
|
+
*
|
|
473
|
+
* AccountIcon Phosphor `user-circle`. The menu's first row. A person's
|
|
474
|
+
* ACCOUNT, which is not `PersonIcon` (`user`, a person).
|
|
475
|
+
* TeamIcon Phosphor `users-four`. The menu's Grids & Spaces row: a
|
|
476
|
+
* team. Not `PeopleIcon` (`users`, a list of people) nor
|
|
477
|
+
* `AudienceIcon` (`users-three`, who came to look).
|
|
478
|
+
*
|
|
479
|
+
* And a FILLED twin, `<Role>FilledIcon`, the same glyph as `<Role>Icon` in
|
|
480
|
+
* Phosphor's `fill` weight, for the roles two menus wear: the Figma menu's
|
|
481
|
+
* eight rows and the Console's two settings shells (cloudgrid-console#956).
|
|
482
|
+
* NOT every nav role: the app page sidebar's rows (`EntityDashboardIcon`,
|
|
483
|
+
* `CommentsIcon`, `ViewsIcon`, `RefreshIcon`, `ScheduleIcon`, `DocumentIcon`,
|
|
484
|
+
* `DatabaseIcon`, `DeveloperIcon`) have none yet, and draw their outline in
|
|
485
|
+
* both states until one is asked for. `SideNavItem` takes the
|
|
486
|
+
* pair as `icon` and `activeIcon` and draws the filled one on the active row,
|
|
487
|
+
* which is what the frame draws. A twin is a second export, never a prop, for
|
|
488
|
+
* the reason the bold twins above give.
|
|
489
|
+
*
|
|
490
|
+
* The frame's Activity row draws `clock-counter-clockwise`, which here is
|
|
491
|
+
* `VersionsIcon`; its twin is `VersionsFilledIcon`. Whether an Activity row
|
|
492
|
+
* deserves a role of its own is for whoever builds that menu to ask.
|
|
493
|
+
*/
|
|
494
|
+
export { UserCircleMark as AccountIcon, UsersFourMark as TeamIcon, } from "./phosphor-marks.js";
|
|
495
|
+
export { UserCircleFillMark as AccountFilledIcon, UsersFillMark as PeopleFilledIcon, UsersFourFillMark as TeamFilledIcon, KeyFillMark as SecretFilledIcon, PlugFillMark as PlugFilledIcon, CurrencyCircleDollarFillMark as BillingFilledIcon, ClockCounterClockwiseFillMark as VersionsFilledIcon, GearSixFillMark as SettingsFilledIcon, GearSixFillMark as ConfigurationFilledIcon, GridFourFillMark as OverviewFilledIcon, GridFourFillMark as SpaceFilledIcon, ShieldFillMark as GovernedFilledIcon, GlobeFillMark as WebFilledIcon, ArchiveFillMark as JunkyardFilledIcon, UsersThreeFillMark as AudienceFilledIcon, SignInFillMark as SignInFilledIcon, TerminalWindowFillMark as TerminalFilledIcon, UserFillMark as PersonFilledIcon, UserCheckFillMark as VerifiedPersonFilledIcon, StackFillMark as LayersFilledIcon, } from "./phosphor-marks.js";
|
|
459
496
|
/**
|
|
460
497
|
* The props every icon above takes, and all it takes.
|
|
461
498
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../../src/blocks/icons.tsx"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../../src/blocks/icons.tsx"],"names":[],"mappings":"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"}
|
package/dist/blocks/icons.js
CHANGED
|
@@ -436,6 +436,15 @@ export { ChatTeardropTextMark as NoteIcon, XBoldMark as CloseBoldIcon, } from ".
|
|
|
436
436
|
* and not `CommentsIcon` (`chat-circle`), which counts comments.
|
|
437
437
|
*/
|
|
438
438
|
export { ChatCenteredTextMark as LeaveCommentIcon, } from "./phosphor-marks.js";
|
|
439
|
+
/**
|
|
440
|
+
* The clickable avatar (#367).
|
|
441
|
+
*
|
|
442
|
+
* `ChangePhotoIcon` is Phosphor `camera`: the mark `AvatarPicker` lays over a
|
|
443
|
+
* person's own picture on hover and on keyboard focus, so it reads as
|
|
444
|
+
* something to press. It names the act, not the device, so a surface that
|
|
445
|
+
* means "take a picture" asks for its own role rather than borrowing this one.
|
|
446
|
+
*/
|
|
447
|
+
export { CameraMark as ChangePhotoIcon, } from "./phosphor-marks.js";
|
|
439
448
|
/**
|
|
440
449
|
* The App page v2 (#331, Figma 10789:8587): the KPI row's marks, the Ask
|
|
441
450
|
* button, the growth line under the views chart, and the pair of controls that
|
|
@@ -468,4 +477,32 @@ export { ChatCenteredTextMark as LeaveCommentIcon, } from "./phosphor-marks.js";
|
|
|
468
477
|
export { UsersThreeMark as AudienceIcon, GitForkMark as PickupsIcon, ChatCircleTextMark as CommentsStatIcon, TrendUpMark as GrowthIcon, UserSwitchMark as ActiveUsersIcon, ChatTeardropDotsMark as AskIcon, ArrowsOutMark as FullScreenIcon, ArrowsInMark as ExitFullScreenIcon, TimerMark as DurationIcon, PlugsConnectedMark as LiveIcon, } from "./phosphor-marks.js";
|
|
469
478
|
/** The weight departures, each replacing a numeric prop lucide used to carry. */
|
|
470
479
|
export { PulseBoldMark as ActivityBoldIcon, CompassBoldMark as DiscoverBoldIcon, StackBoldMark as LayersBoldIcon, UserBoldMark as PersonBoldIcon, HouseSimpleBoldMark as HomeBoldIcon, GridFourBoldMark as SpaceBoldIcon, PushPinFillMark as SaveFilledIcon, } from "./phosphor-marks.js";
|
|
480
|
+
/**
|
|
481
|
+
* The 2026 menu (#377, Figma 7414:5979, the Admin frame's left column).
|
|
482
|
+
*
|
|
483
|
+
* Two new content roles, for the two glyphs the frame draws that had none:
|
|
484
|
+
*
|
|
485
|
+
* AccountIcon Phosphor `user-circle`. The menu's first row. A person's
|
|
486
|
+
* ACCOUNT, which is not `PersonIcon` (`user`, a person).
|
|
487
|
+
* TeamIcon Phosphor `users-four`. The menu's Grids & Spaces row: a
|
|
488
|
+
* team. Not `PeopleIcon` (`users`, a list of people) nor
|
|
489
|
+
* `AudienceIcon` (`users-three`, who came to look).
|
|
490
|
+
*
|
|
491
|
+
* And a FILLED twin, `<Role>FilledIcon`, the same glyph as `<Role>Icon` in
|
|
492
|
+
* Phosphor's `fill` weight, for the roles two menus wear: the Figma menu's
|
|
493
|
+
* eight rows and the Console's two settings shells (cloudgrid-console#956).
|
|
494
|
+
* NOT every nav role: the app page sidebar's rows (`EntityDashboardIcon`,
|
|
495
|
+
* `CommentsIcon`, `ViewsIcon`, `RefreshIcon`, `ScheduleIcon`, `DocumentIcon`,
|
|
496
|
+
* `DatabaseIcon`, `DeveloperIcon`) have none yet, and draw their outline in
|
|
497
|
+
* both states until one is asked for. `SideNavItem` takes the
|
|
498
|
+
* pair as `icon` and `activeIcon` and draws the filled one on the active row,
|
|
499
|
+
* which is what the frame draws. A twin is a second export, never a prop, for
|
|
500
|
+
* the reason the bold twins above give.
|
|
501
|
+
*
|
|
502
|
+
* The frame's Activity row draws `clock-counter-clockwise`, which here is
|
|
503
|
+
* `VersionsIcon`; its twin is `VersionsFilledIcon`. Whether an Activity row
|
|
504
|
+
* deserves a role of its own is for whoever builds that menu to ask.
|
|
505
|
+
*/
|
|
506
|
+
export { UserCircleMark as AccountIcon, UsersFourMark as TeamIcon, } from "./phosphor-marks.js";
|
|
507
|
+
export { UserCircleFillMark as AccountFilledIcon, UsersFillMark as PeopleFilledIcon, UsersFourFillMark as TeamFilledIcon, KeyFillMark as SecretFilledIcon, PlugFillMark as PlugFilledIcon, CurrencyCircleDollarFillMark as BillingFilledIcon, ClockCounterClockwiseFillMark as VersionsFilledIcon, GearSixFillMark as SettingsFilledIcon, GearSixFillMark as ConfigurationFilledIcon, GridFourFillMark as OverviewFilledIcon, GridFourFillMark as SpaceFilledIcon, ShieldFillMark as GovernedFilledIcon, GlobeFillMark as WebFilledIcon, ArchiveFillMark as JunkyardFilledIcon, UsersThreeFillMark as AudienceFilledIcon, SignInFillMark as SignInFilledIcon, TerminalWindowFillMark as TerminalFilledIcon, UserFillMark as PersonFilledIcon, UserCheckFillMark as VerifiedPersonFilledIcon, StackFillMark as LayersFilledIcon, } from "./phosphor-marks.js";
|
|
471
508
|
//# sourceMappingURL=icons.js.map
|
package/dist/blocks/icons.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icons.js","sourceRoot":"","sources":["../../src/blocks/icons.tsx"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"icons.js","sourceRoot":"","sources":["../../src/blocks/icons.tsx"],"names":[],"mappings":"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"}
|
|
@@ -245,6 +245,48 @@ export declare const TimerMark: ({ className }: PhosphorMarkProps) => React.JSX.
|
|
|
245
245
|
export declare const PlugsConnectedMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
246
246
|
/** Comment: open the note form. Phosphor `chat-centered-text`, regular. */
|
|
247
247
|
export declare const ChatCenteredTextMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
248
|
+
/** Change your photo. Phosphor `camera`, regular. */
|
|
249
|
+
export declare const CameraMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
250
|
+
/** An account — a person in a circle. Phosphor `user-circle`, regular. */
|
|
251
|
+
export declare const UserCircleMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
252
|
+
/** A team — a grid's people. Phosphor `users-four`, regular. */
|
|
253
|
+
export declare const UsersFourMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
254
|
+
/** An account, on the active row. Phosphor `user-circle`, fill. */
|
|
255
|
+
export declare const UserCircleFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
256
|
+
/** People, on the active row. Phosphor `users`, fill. */
|
|
257
|
+
export declare const UsersFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
258
|
+
/** A team, on the active row. Phosphor `users-four`, fill. */
|
|
259
|
+
export declare const UsersFourFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
260
|
+
/** A secret, on the active row. Phosphor `key`, fill. */
|
|
261
|
+
export declare const KeyFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
262
|
+
/** Plugged in, on the active row. Phosphor `plug`, fill. */
|
|
263
|
+
export declare const PlugFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
264
|
+
/** Billing, on the active row. Phosphor `currency-circle-dollar`, fill. */
|
|
265
|
+
export declare const CurrencyCircleDollarFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
266
|
+
/** Earlier versions, on the active row. Phosphor `clock-counter-clockwise`, fill. */
|
|
267
|
+
export declare const ClockCounterClockwiseFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
268
|
+
/** Settings, on the active row. Phosphor `gear-six`, fill. */
|
|
269
|
+
export declare const GearSixFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
270
|
+
/** A space or an overview, on the active row. Phosphor `grid-four`, fill. */
|
|
271
|
+
export declare const GridFourFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
272
|
+
/** Governed, on the active row. Phosphor `shield`, fill. */
|
|
273
|
+
export declare const ShieldFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
274
|
+
/** On the web, on the active row. Phosphor `globe`, fill. */
|
|
275
|
+
export declare const GlobeFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
276
|
+
/** The junkyard, on the active row. Phosphor `archive`, fill. */
|
|
277
|
+
export declare const ArchiveFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
278
|
+
/** Audience, on the active row. Phosphor `users-three`, fill. */
|
|
279
|
+
export declare const UsersThreeFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
280
|
+
/** Sign-in, on the active row. Phosphor `sign-in`, fill. */
|
|
281
|
+
export declare const SignInFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
282
|
+
/** Tools in a terminal, on the active row. Phosphor `terminal-window`, fill. */
|
|
283
|
+
export declare const TerminalWindowFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
284
|
+
/** A person, on the active row. Phosphor `user`, fill. */
|
|
285
|
+
export declare const UserFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
286
|
+
/** A confirmed person, on the active row. Phosphor `user-check`, fill. */
|
|
287
|
+
export declare const UserCheckFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
288
|
+
/** Layers, on the active row. Phosphor `stack`, fill. */
|
|
289
|
+
export declare const StackFillMark: ({ className }: PhosphorMarkProps) => React.JSX.Element;
|
|
248
290
|
/** Keyed by the label a caller shows, the same shape as TOOL_MARKS. */
|
|
249
291
|
export declare const PHOSPHOR_MARKS: {
|
|
250
292
|
readonly "A friend": ({ className }: PhosphorMarkProps) => React.JSX.Element;
|