@silo-code/sdk 0.38.0 → 0.39.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/dist/MenuButton.d.ts +52 -0
- package/dist/MenuButton.d.ts.map +1 -0
- package/dist/MenuButton.js +47 -0
- package/dist/MenuButton.js.map +1 -0
- package/dist/Section.d.ts +1 -1
- package/dist/Section.d.ts.map +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/menu-button-classes.d.ts +15 -0
- package/dist/menu-button-classes.d.ts.map +1 -0
- package/dist/menu-button-classes.js +12 -0
- package/dist/menu-button-classes.js.map +1 -0
- package/package.json +1 -1
- package/src/MenuButton.tsx +89 -0
- package/src/Section.tsx +1 -1
- package/src/index.ts +2 -0
- package/src/menu-button-classes.test.ts +15 -0
- package/src/menu-button-classes.ts +19 -0
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import type { ButtonHTMLAttributes, ReactNode } from "react";
|
|
2
|
+
import { type MenuButtonSize } from "./menu-button-classes.js";
|
|
3
|
+
export type { MenuButtonSize };
|
|
4
|
+
/**
|
|
5
|
+
* A **labelled** button that opens a menu — the counterpart to
|
|
6
|
+
* {@link IconButton} for the cases where a bare `⋮` doesn't tell anyone what
|
|
7
|
+
* they'd get. Renders its label with a trailing chevron, the standard signal
|
|
8
|
+
* that pressing it reveals more rather than performing something.
|
|
9
|
+
*
|
|
10
|
+
* Reach for this over `IconButton` whenever the menu is a place a user is
|
|
11
|
+
* *meant* to go rather than an escape hatch: a `⋮` is discoverable only by the
|
|
12
|
+
* people who already know to look. Keep `IconButton` for dense rows and
|
|
13
|
+
* toolbars where a label won't fit.
|
|
14
|
+
*
|
|
15
|
+
* It is the trigger only — it does not own the menu. Open one from `onClick`
|
|
16
|
+
* with {@link UiService.showMenu}, anchoring to `e.currentTarget` so the menu
|
|
17
|
+
* lines up under the button.
|
|
18
|
+
*
|
|
19
|
+
* Styled purely via host-provided `.silo-menu-button*` classes — no stylesheet
|
|
20
|
+
* import is needed in the extension.
|
|
21
|
+
*
|
|
22
|
+
* @example
|
|
23
|
+
* ```tsx
|
|
24
|
+
* <MenuButton
|
|
25
|
+
* label="More"
|
|
26
|
+
* onClick={(e) =>
|
|
27
|
+
* ctx.ui.showMenu({
|
|
28
|
+
* items: [
|
|
29
|
+
* { id: "disable", label: "Disable", run: disable },
|
|
30
|
+
* { id: "uninstall", label: "Uninstall", run: uninstall },
|
|
31
|
+
* ],
|
|
32
|
+
* at: e.currentTarget,
|
|
33
|
+
* })
|
|
34
|
+
* }
|
|
35
|
+
* />
|
|
36
|
+
*
|
|
37
|
+
* // compact — e.g. in a card footer or a ListRow's trailing slot
|
|
38
|
+
* <MenuButton size="sm" label="More" onClick={openMenu} />
|
|
39
|
+
* ```
|
|
40
|
+
*
|
|
41
|
+
* @category Consumer Services
|
|
42
|
+
* @public
|
|
43
|
+
*/
|
|
44
|
+
export declare function MenuButton({ label, size, className, type, children, ...rest }: {
|
|
45
|
+
/** The visible label — the whole point of reaching for this over `IconButton`. */
|
|
46
|
+
label: ReactNode;
|
|
47
|
+
/** `sm` for compact contexts (card footers, list rows). */
|
|
48
|
+
size?: MenuButtonSize;
|
|
49
|
+
/** Optional leading content, e.g. an icon before the label. */
|
|
50
|
+
children?: ReactNode;
|
|
51
|
+
} & Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children">): import("react").JSX.Element;
|
|
52
|
+
//# sourceMappingURL=MenuButton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MenuButton.d.ts","sourceRoot":"","sources":["../src/MenuButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAmB,KAAK,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAE7E,YAAY,EAAE,cAAc,EAAE,CAAC;AAE/B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,IAAe,EACf,SAAS,EACT,IAAe,EACf,QAAQ,EACR,GAAG,IAAI,EACR,EAAE;IACD,kFAAkF;IAClF,KAAK,EAAE,SAAS,CAAC;IACjB,2DAA2D;IAC3D,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,GAAG,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC,+BA6B5D"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { menuButtonClass } from "./menu-button-classes.js";
|
|
3
|
+
/**
|
|
4
|
+
* A **labelled** button that opens a menu — the counterpart to
|
|
5
|
+
* {@link IconButton} for the cases where a bare `⋮` doesn't tell anyone what
|
|
6
|
+
* they'd get. Renders its label with a trailing chevron, the standard signal
|
|
7
|
+
* that pressing it reveals more rather than performing something.
|
|
8
|
+
*
|
|
9
|
+
* Reach for this over `IconButton` whenever the menu is a place a user is
|
|
10
|
+
* *meant* to go rather than an escape hatch: a `⋮` is discoverable only by the
|
|
11
|
+
* people who already know to look. Keep `IconButton` for dense rows and
|
|
12
|
+
* toolbars where a label won't fit.
|
|
13
|
+
*
|
|
14
|
+
* It is the trigger only — it does not own the menu. Open one from `onClick`
|
|
15
|
+
* with {@link UiService.showMenu}, anchoring to `e.currentTarget` so the menu
|
|
16
|
+
* lines up under the button.
|
|
17
|
+
*
|
|
18
|
+
* Styled purely via host-provided `.silo-menu-button*` classes — no stylesheet
|
|
19
|
+
* import is needed in the extension.
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* ```tsx
|
|
23
|
+
* <MenuButton
|
|
24
|
+
* label="More"
|
|
25
|
+
* onClick={(e) =>
|
|
26
|
+
* ctx.ui.showMenu({
|
|
27
|
+
* items: [
|
|
28
|
+
* { id: "disable", label: "Disable", run: disable },
|
|
29
|
+
* { id: "uninstall", label: "Uninstall", run: uninstall },
|
|
30
|
+
* ],
|
|
31
|
+
* at: e.currentTarget,
|
|
32
|
+
* })
|
|
33
|
+
* }
|
|
34
|
+
* />
|
|
35
|
+
*
|
|
36
|
+
* // compact — e.g. in a card footer or a ListRow's trailing slot
|
|
37
|
+
* <MenuButton size="sm" label="More" onClick={openMenu} />
|
|
38
|
+
* ```
|
|
39
|
+
*
|
|
40
|
+
* @category Consumer Services
|
|
41
|
+
* @public
|
|
42
|
+
*/
|
|
43
|
+
export function MenuButton({ label, size = "normal", className, type = "button", children, ...rest }) {
|
|
44
|
+
const classes = menuButtonClass(size);
|
|
45
|
+
return (_jsxs("button", { type: type, className: className ? `${classes} ${className}` : classes, "aria-haspopup": "menu", ...rest, children: [children, _jsx("span", { className: "silo-menu-button-label", children: label }), _jsx("svg", { className: "silo-menu-button-chevron", viewBox: "0 0 16 16", "aria-hidden": "true", children: _jsx("path", { d: "M4 6l4 4 4-4", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })] }));
|
|
46
|
+
}
|
|
47
|
+
//# sourceMappingURL=MenuButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MenuButton.js","sourceRoot":"","sources":["../src/MenuButton.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,eAAe,EAAuB,MAAM,uBAAuB,CAAC;AAI7E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,MAAM,UAAU,UAAU,CAAC,EACzB,KAAK,EACL,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,IAAI,GAAG,QAAQ,EACf,QAAQ,EACR,GAAG,IAAI,EAQoD;IAC3D,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,CAAC;IACtC,OAAO,CACL,kBACE,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC,GAAG,OAAO,IAAI,SAAS,EAAE,CAAC,CAAC,CAAC,OAAO,mBAG5C,MAAM,KAChB,IAAI,aAEP,QAAQ,EACT,eAAM,SAAS,EAAC,wBAAwB,YAAE,KAAK,GAAQ,EACvD,cACE,SAAS,EAAC,0BAA0B,EACpC,OAAO,EAAC,WAAW,iBACP,MAAM,YAElB,eACE,CAAC,EAAC,cAAc,EAChB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,KAAK,EACjB,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,GACtB,GACE,IACC,CACV,CAAC;AACJ,CAAC"}
|
package/dist/Section.d.ts
CHANGED
|
@@ -26,7 +26,7 @@ import type { ReactNode } from "react";
|
|
|
26
26
|
* @public
|
|
27
27
|
*/
|
|
28
28
|
export declare function Section({ label, accessory, children, }: {
|
|
29
|
-
/** Rendered uppercase, letter-spaced, chrome−1, `text-lo`. */
|
|
29
|
+
/** Rendered uppercase, semibold, letter-spaced, chrome−1, `text-lo`. */
|
|
30
30
|
label: string;
|
|
31
31
|
/** Right-aligned — a count badge, an add affordance. */
|
|
32
32
|
accessory?: ReactNode;
|
package/dist/Section.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Section.d.ts","sourceRoot":"","sources":["../src/Section.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,OAAO,CAAC,EACtB,KAAK,EACL,SAAS,EACT,QAAQ,GACT,EAAE;IACD,
|
|
1
|
+
{"version":3,"file":"Section.d.ts","sourceRoot":"","sources":["../src/Section.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,OAAO,CAAC,EACtB,KAAK,EACL,SAAS,EACT,QAAQ,GACT,EAAE;IACD,wEAAwE;IACxE,KAAK,EAAE,MAAM,CAAC;IACd,wDAAwD;IACxD,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,+BAUA"}
|
package/dist/index.d.ts
CHANGED
|
@@ -52,6 +52,8 @@ export { Button } from "./Button.js";
|
|
|
52
52
|
export type { ButtonVariant, ButtonSize } from "./Button.js";
|
|
53
53
|
export { IconButton } from "./IconButton.js";
|
|
54
54
|
export type { IconButtonSize, IconButtonVariant } from "./IconButton.js";
|
|
55
|
+
export { MenuButton } from "./MenuButton.js";
|
|
56
|
+
export type { MenuButtonSize } from "./MenuButton.js";
|
|
55
57
|
export { Input } from "./Input.js";
|
|
56
58
|
export { Textarea } from "./Textarea.js";
|
|
57
59
|
export { SearchInput } from "./SearchInput.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
|
@@ -32,6 +32,7 @@ export { Tooltip } from "./Tooltip.js";
|
|
|
32
32
|
// styled purely via host-provided `.silo-*` classes.
|
|
33
33
|
export { Button } from "./Button.js";
|
|
34
34
|
export { IconButton } from "./IconButton.js";
|
|
35
|
+
export { MenuButton } from "./MenuButton.js";
|
|
35
36
|
export { Input } from "./Input.js";
|
|
36
37
|
export { Textarea } from "./Textarea.js";
|
|
37
38
|
export { SearchInput } from "./SearchInput.js";
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAqHH,OAAO,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAgChD,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AA6BhD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAuBzC,sEAAsE;AACtE,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAkCjD,8EAA8E;AAC9E,8EAA8E;AAC9E,6DAA6D;AAC7D,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,yEAAyE;AACzE,iFAAiF;AACjF,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,4EAA4E;AAC5E,qDAAqD;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,4DAA4D;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAExC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAEvC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,wEAAwE;AACxE,iFAAiF;AACjF,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAEtD,8EAA8E;AAC9E,4EAA4E;AAC5E,8EAA8E;AAC9E,8EAA8E;AAC9E,OAAO,EAAE,aAAa,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAUvE,6EAA6E;AAC7E,wEAAwE;AACxE,+CAA+C;AAC/C,OAAO,EACL,yBAAyB,EACzB,uBAAuB,GACxB,MAAM,0BAA0B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAqHH,OAAO,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAgChD,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AA6BhD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAuBzC,sEAAsE;AACtE,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAkCjD,8EAA8E;AAC9E,8EAA8E;AAC9E,6DAA6D;AAC7D,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,yEAAyE;AACzE,iFAAiF;AACjF,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,4EAA4E;AAC5E,qDAAqD;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,4DAA4D;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAExC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAEvC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,wEAAwE;AACxE,iFAAiF;AACjF,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAEtD,8EAA8E;AAC9E,4EAA4E;AAC5E,8EAA8E;AAC9E,8EAA8E;AAC9E,OAAO,EAAE,aAAa,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAUvE,6EAA6E;AAC7E,wEAAwE;AACxE,+CAA+C;AAC/C,OAAO,EACL,yBAAyB,EACzB,uBAAuB,GACxB,MAAM,0BAA0B,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Class-string mapping for {@link MenuButton} — pinned by unit tests so a
|
|
3
|
+
* rename of the host contract classes fails CI (RFC 0016).
|
|
4
|
+
*
|
|
5
|
+
* @internal
|
|
6
|
+
*/
|
|
7
|
+
export type MenuButtonSize = "normal" | "sm";
|
|
8
|
+
/**
|
|
9
|
+
* Resolve the host `.silo-menu-button*` class string for a MenuButton's `size`.
|
|
10
|
+
* `sm` composes with the base class, matching how `.silo-button-sm` works.
|
|
11
|
+
*
|
|
12
|
+
* @internal
|
|
13
|
+
*/
|
|
14
|
+
export declare function menuButtonClass(size?: MenuButtonSize): string;
|
|
15
|
+
//# sourceMappingURL=menu-button-classes.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"menu-button-classes.d.ts","sourceRoot":"","sources":["../src/menu-button-classes.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,IAAI,CAAC;AAE7C;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,IAAI,GAAE,cAAyB,GAAG,MAAM,CAIvE"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Resolve the host `.silo-menu-button*` class string for a MenuButton's `size`.
|
|
3
|
+
* `sm` composes with the base class, matching how `.silo-button-sm` works.
|
|
4
|
+
*
|
|
5
|
+
* @internal
|
|
6
|
+
*/
|
|
7
|
+
export function menuButtonClass(size = "normal") {
|
|
8
|
+
return size === "sm"
|
|
9
|
+
? "silo-menu-button silo-menu-button-sm"
|
|
10
|
+
: "silo-menu-button";
|
|
11
|
+
}
|
|
12
|
+
//# sourceMappingURL=menu-button-classes.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"menu-button-classes.js","sourceRoot":"","sources":["../src/menu-button-classes.ts"],"names":[],"mappings":"AAQA;;;;;GAKG;AACH,MAAM,UAAU,eAAe,CAAC,OAAuB,QAAQ;IAC7D,OAAO,IAAI,KAAK,IAAI;QAClB,CAAC,CAAC,sCAAsC;QACxC,CAAC,CAAC,kBAAkB,CAAC;AACzB,CAAC"}
|
package/package.json
CHANGED
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import type { ButtonHTMLAttributes, ReactNode } from "react";
|
|
2
|
+
import { menuButtonClass, type MenuButtonSize } from "./menu-button-classes";
|
|
3
|
+
|
|
4
|
+
export type { MenuButtonSize };
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* A **labelled** button that opens a menu — the counterpart to
|
|
8
|
+
* {@link IconButton} for the cases where a bare `⋮` doesn't tell anyone what
|
|
9
|
+
* they'd get. Renders its label with a trailing chevron, the standard signal
|
|
10
|
+
* that pressing it reveals more rather than performing something.
|
|
11
|
+
*
|
|
12
|
+
* Reach for this over `IconButton` whenever the menu is a place a user is
|
|
13
|
+
* *meant* to go rather than an escape hatch: a `⋮` is discoverable only by the
|
|
14
|
+
* people who already know to look. Keep `IconButton` for dense rows and
|
|
15
|
+
* toolbars where a label won't fit.
|
|
16
|
+
*
|
|
17
|
+
* It is the trigger only — it does not own the menu. Open one from `onClick`
|
|
18
|
+
* with {@link UiService.showMenu}, anchoring to `e.currentTarget` so the menu
|
|
19
|
+
* lines up under the button.
|
|
20
|
+
*
|
|
21
|
+
* Styled purely via host-provided `.silo-menu-button*` classes — no stylesheet
|
|
22
|
+
* import is needed in the extension.
|
|
23
|
+
*
|
|
24
|
+
* @example
|
|
25
|
+
* ```tsx
|
|
26
|
+
* <MenuButton
|
|
27
|
+
* label="More"
|
|
28
|
+
* onClick={(e) =>
|
|
29
|
+
* ctx.ui.showMenu({
|
|
30
|
+
* items: [
|
|
31
|
+
* { id: "disable", label: "Disable", run: disable },
|
|
32
|
+
* { id: "uninstall", label: "Uninstall", run: uninstall },
|
|
33
|
+
* ],
|
|
34
|
+
* at: e.currentTarget,
|
|
35
|
+
* })
|
|
36
|
+
* }
|
|
37
|
+
* />
|
|
38
|
+
*
|
|
39
|
+
* // compact — e.g. in a card footer or a ListRow's trailing slot
|
|
40
|
+
* <MenuButton size="sm" label="More" onClick={openMenu} />
|
|
41
|
+
* ```
|
|
42
|
+
*
|
|
43
|
+
* @category Consumer Services
|
|
44
|
+
* @public
|
|
45
|
+
*/
|
|
46
|
+
export function MenuButton({
|
|
47
|
+
label,
|
|
48
|
+
size = "normal",
|
|
49
|
+
className,
|
|
50
|
+
type = "button",
|
|
51
|
+
children,
|
|
52
|
+
...rest
|
|
53
|
+
}: {
|
|
54
|
+
/** The visible label — the whole point of reaching for this over `IconButton`. */
|
|
55
|
+
label: ReactNode;
|
|
56
|
+
/** `sm` for compact contexts (card footers, list rows). */
|
|
57
|
+
size?: MenuButtonSize;
|
|
58
|
+
/** Optional leading content, e.g. an icon before the label. */
|
|
59
|
+
children?: ReactNode;
|
|
60
|
+
} & Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children">) {
|
|
61
|
+
const classes = menuButtonClass(size);
|
|
62
|
+
return (
|
|
63
|
+
<button
|
|
64
|
+
type={type}
|
|
65
|
+
className={className ? `${classes} ${className}` : classes}
|
|
66
|
+
// The chevron is decorative — the label already names the control, and
|
|
67
|
+
// announcing "down arrow" after it would be noise.
|
|
68
|
+
aria-haspopup="menu"
|
|
69
|
+
{...rest}
|
|
70
|
+
>
|
|
71
|
+
{children}
|
|
72
|
+
<span className="silo-menu-button-label">{label}</span>
|
|
73
|
+
<svg
|
|
74
|
+
className="silo-menu-button-chevron"
|
|
75
|
+
viewBox="0 0 16 16"
|
|
76
|
+
aria-hidden="true"
|
|
77
|
+
>
|
|
78
|
+
<path
|
|
79
|
+
d="M4 6l4 4 4-4"
|
|
80
|
+
fill="none"
|
|
81
|
+
stroke="currentColor"
|
|
82
|
+
strokeWidth="1.5"
|
|
83
|
+
strokeLinecap="round"
|
|
84
|
+
strokeLinejoin="round"
|
|
85
|
+
/>
|
|
86
|
+
</svg>
|
|
87
|
+
</button>
|
|
88
|
+
);
|
|
89
|
+
}
|
package/src/Section.tsx
CHANGED
|
@@ -31,7 +31,7 @@ export function Section({
|
|
|
31
31
|
accessory,
|
|
32
32
|
children,
|
|
33
33
|
}: {
|
|
34
|
-
/** Rendered uppercase, letter-spaced, chrome−1, `text-lo`. */
|
|
34
|
+
/** Rendered uppercase, semibold, letter-spaced, chrome−1, `text-lo`. */
|
|
35
35
|
label: string;
|
|
36
36
|
/** Right-aligned — a count badge, an add affordance. */
|
|
37
37
|
accessory?: ReactNode;
|
package/src/index.ts
CHANGED
|
@@ -266,6 +266,8 @@ export { Button } from "./Button";
|
|
|
266
266
|
export type { ButtonVariant, ButtonSize } from "./Button";
|
|
267
267
|
export { IconButton } from "./IconButton";
|
|
268
268
|
export type { IconButtonSize, IconButtonVariant } from "./IconButton";
|
|
269
|
+
export { MenuButton } from "./MenuButton";
|
|
270
|
+
export type { MenuButtonSize } from "./MenuButton";
|
|
269
271
|
export { Input } from "./Input";
|
|
270
272
|
export { Textarea } from "./Textarea";
|
|
271
273
|
export { SearchInput } from "./SearchInput";
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { describe, expect, it } from "vitest";
|
|
2
|
+
import { menuButtonClass } from "./menu-button-classes";
|
|
3
|
+
|
|
4
|
+
// Pins the host contract classes (components.css) so renaming one fails here
|
|
5
|
+
// rather than silently unstyling every extension's menu triggers.
|
|
6
|
+
describe("menuButtonClass", () => {
|
|
7
|
+
it("defaults to the base class", () => {
|
|
8
|
+
expect(menuButtonClass()).toBe("silo-menu-button");
|
|
9
|
+
expect(menuButtonClass("normal")).toBe("silo-menu-button");
|
|
10
|
+
});
|
|
11
|
+
|
|
12
|
+
it("composes the compact modifier onto the base, like .silo-button-sm", () => {
|
|
13
|
+
expect(menuButtonClass("sm")).toBe("silo-menu-button silo-menu-button-sm");
|
|
14
|
+
});
|
|
15
|
+
});
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Class-string mapping for {@link MenuButton} — pinned by unit tests so a
|
|
3
|
+
* rename of the host contract classes fails CI (RFC 0016).
|
|
4
|
+
*
|
|
5
|
+
* @internal
|
|
6
|
+
*/
|
|
7
|
+
export type MenuButtonSize = "normal" | "sm";
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* Resolve the host `.silo-menu-button*` class string for a MenuButton's `size`.
|
|
11
|
+
* `sm` composes with the base class, matching how `.silo-button-sm` works.
|
|
12
|
+
*
|
|
13
|
+
* @internal
|
|
14
|
+
*/
|
|
15
|
+
export function menuButtonClass(size: MenuButtonSize = "normal"): string {
|
|
16
|
+
return size === "sm"
|
|
17
|
+
? "silo-menu-button silo-menu-button-sm"
|
|
18
|
+
: "silo-menu-button";
|
|
19
|
+
}
|