staffa 0.4.2 → 0.4.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "staffa",
-  "version": "0.4.2",
+  "version": "0.4.3",
   "description": "An opinionated component library for the Aberdeen reactive UI library.",
   "license": "ISC",
   "author": "",

package/src/components/autocomplete.ts

@@ -68,11 +68,11 @@ function normOption(o: AutocompleteOptionInput): AcOption {
  * S.autocomplete({ label: "Country", options: ["Belgium", "Netherlands"], bind: $sel });
  *
  * // Multi-select, disallowing custom items
- * const $tags = A.proxy([] as string[]);
+ * const $tags = A.proxy({value: [] as string[]});
  * S.autocomplete({
  *   label: "Tags",
  *   multi: true,
- *   allowCustom: true,
+ *   allowCustom: false,
  *   options: ["Rust", "JS", "C++", "Klingon", "Go"],
  *   bind: A.ref($tags)
  * });

package/src/components/button.ts

@@ -87,7 +87,7 @@ const ROLE_CLASS = /\.(gradient|primary|secondary|neutral|danger|success|warning
  *
  * @example
  * ```ts
- * S.button({ content: "Save", click: save });
+ * S.button({ content: "Save", click: S.alert("Saved.") });
  * S.button({ content: "Delete", attrs: ".danger .outlined", click: del });
  * S.button("Cancel");                        // shorthand for { content: "Cancel" }
  * S.button({ href: "/docs", content: "Docs" }); // renders an <a role=button>

package/src/components/menu.ts

@@ -246,12 +246,13 @@ mountPortal(() => {
  * @example
  * ```ts
  * // An @-mention picker: typing "@" in the input pops up a user menu.
+ * const users = ['Alice', 'Bob', 'Charlie', 'Dutley']
  * A("input placeholder=Comment…", () => {
  *   A("keydown=", (e: KeyboardEvent) => {
  *     if (e.key !== "@") return;
  *     S.showFloatingMenu({
  *       anchor: e.currentTarget as HTMLElement,
- *       items: users.map((u) => ({ label: u.name, click: () => mention(u) })),
+ *       items: users.map((u) => ({ label: u, click: () => S.alert(`Mentioned ${u}!`) })),
  *     });
  *   });
  * });

package/src/components/select.ts

@@ -31,6 +31,7 @@ A.insertGlobalCss({
  *
  * @example
  * ```ts
+ * const $sel = A.proxy("Netherlands"); 
  * S.select({ label: "Country", options: ["Belgium", "Netherlands"], bind: $sel });
  * ```
  */

package/src/components/tooltip.ts

@@ -117,9 +117,11 @@ mountPortal(() => {
  *   A("#Save");
  *   S.addTooltip({ tip: "Saves your work to the cloud" });
  * });
+ * 
+ * A(" ");
  *
  * S.button(() => {
- * 	 A(".danger#Delete");
+ *   A(".danger #Delete");
  *   S.addTooltip({ tip: "Dangerous — cannot be undone", placement: "bottom" });
  * });
  * ```