@netlify/spark-ui 0.0.47-alpha → 1.0.0

package/README.md

@@ -7,6 +7,30 @@ Foundational design tokens, components, utilities, and other global assets to be
 - **Styles** - Element and component CSS
 - **Utils** - Collection of JS utility functions
 
+## Versioning
+
+When commmits are merged into `main`, a new release will be created via GitHub Action. [semantic-release](https://semantic-release.gitbook.io/semantic-release) uses the commit messages to determine the impact of changes in the codebase. Follow [the commit message format](https://semantic-release.gitbook.io/semantic-release#commit-message-format) to properly version updates.
+
+```bash
+<type>[optional scope]: <description>
+
+[optional body]
+
+[optional footer(s)]
+```
+
+| Commit message                                                                                                           | Release type                                                                                                 |
+| ------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------ |
+| fix: corrects prop types                                                                                                 | ~~Patch~~ Fix Release                                                                                        |
+| feat: add sparkCool feature                                                                                              | ~~Minor~~ Feature Release                                                                                    |
+| perf: remove sparkCool feature<br><br>BREAKING CHANGE: The sparkCool option has been removed due to performance reasons. | ~~Major~~ Breaking Release<br><br>(Note that the BREAKING CHANGE: token must be in the footer of the commit) |
+
+Check out [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/) for other commit message types.
+
+### Troubleshooting
+
+Check that npm and GitHub tokens have not expired. Both are used in the [Release GitHub Action](https://github.com/netlify/netlify-spark-ui/blob/main/.github/workflows/release.yml#L34-L35) job.
+
 ## Code Quality
 
 ### Linting

package/dist/assets/SearchHeading.css

@@ -1 +1 @@
-.n-search-heading{--n-search-heading-weight: var(--font-regular, 400);--n-search-heading-size: var(--step--2, 13px);--n-search-heading-color: var(--color-text-3, #757575);font-size:var(--n-search-heading-size);font-weight:var(--n-search-heading-weight);color:var(--n-search-heading-color);padding-inline:1rem;margin-block:var(--space-xs);letter-spacing:.2px}
+.n-search-heading{--n-search-heading-weight: var(--font-weight-regular, 400);--n-search-heading-size: var(--font-size-text-sm, 13px);--n-search-heading-color: var(--color-text-weak, #757575);font-size:var(--n-search-heading-size);font-weight:var(--n-search-heading-weight);color:var(--n-search-heading-color);padding-inline:1rem;margin-block:var(--space-xs);letter-spacing:.2px}

package/dist/assets/SearchLink.css

@@ -1 +1 @@
-.n-search-link{--n-search-icon-size: 1em;all:unset;display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-s, 1rem);align-items:center;padding:var(--n-search-link-padding-block, 1em) var(--n-search-link-padding-inline, 1em);font-size:var(--step--1);font-weight:var(--font-regular);text-decoration:none;cursor:pointer}.n-search-link-body{flex:1;width:80%;color:var(--color-text-2)}.n-search-link:is(:hover,:focus-within){background:var(--n-search-color-bg-2)}.n-search-link:is(:hover,:focus-within) .n-search-link-icon [data-icon=caretRight]{display:block}.n-search-link-title{font-weight:var(--font-semibold, 680);color:var(--color-text-2);line-height:1.5}.n-search-link-excerpt{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--color-text-3);line-height:1.3;font-size:.9em;margin-block-start:var(--space-3xs)}.n-search-link-icon{display:flex;width:var(--n-search-icon-size);height:var(--n-search-icon-size);color:var(--n-search-color-text-secondary)}.n-search-link-icon [data-icon=caretRight]{display:none;width:.8em;opacity:.3}.n-search-link-label{margin-inline-end:var(--space-3xs)}.n-search-link-badge{display:inline-block;width:max-content;font-size:.7em;padding:.1em .4em;position:relative;bottom:.3em;color:var(--n-search-link-badge-text-color, var(--neutral-500));background:var(--n-search-link-badge-color, var(--neutral-100));border:1px solid var(--n-search-link-badge-border, var(--neutral-300));border-radius:3px}.n-search-link-badge[data-resource=blog]{--n-search-link-badge-color: var(--blue-000);--n-search-link-badge-text-color: var(--blue-500);--n-search-link-badge-border: var(--blue-100)}.n-search-link-badge[data-resource=changelog]{--n-search-link-badge-color: var(--gold-000);--n-search-link-badge-text-color: var(--gold-500);--n-search-link-badge-border: var(--gold-100)}.n-search-link-badge[data-resource=guide]{--n-search-link-badge-color: var(--teal-000);--n-search-link-badge-text-color: var(--teal-500);--n-search-link-badge-border: var(--teal-100)}
+.n-search-link{--n-search-icon-size: 1em;all:unset;display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-s, 1rem);align-items:center;padding:var(--n-search-link-padding-block, 1em) var(--n-search-link-padding-inline, 1em);font-size:var(--font-size-text-sm);font-weight:var(--font-weight-regular);text-decoration:none;cursor:pointer}.n-search-link-body{flex:1;width:80%;color:var(--color-text-weak);text-wrap:pretty}.n-search-link:is(:hover,:focus-within){background:var(--n-search-color-bg-2)}.n-search-link:is(:hover,:focus-within) .n-search-link-icon [data-icon=caretRight]{display:block}.n-search-link-title{font-weight:var(--font-weight-medium);color:var(--color-text);line-height:1.5}.n-search-link-excerpt{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--color-text-weak);line-height:1.3;font-size:.9em;margin-block-start:var(--space-3xs)}.n-search-link-icon{display:flex;width:var(--n-search-icon-size);height:var(--n-search-icon-size);color:var(--n-search-color-text-secondary)}.n-search-link-icon [data-icon=caretRight]{display:none;width:.8em;opacity:.3}.n-search-link-label{margin-inline-end:var(--space-3xs)}.n-search-link-badge{display:inline-block;width:max-content;font-size:.7em;padding:.1em .4em;position:relative;bottom:.3em;color:var(--n-search-link-badge-text-color, var(--neutral-500));background:var(--n-search-link-badge-color, var(--neutral-100));border:1px solid var(--n-search-link-badge-border, var(--neutral-300));border-radius:3px}.n-search-link-badge[data-resource=blog]{--n-search-link-badge-color: var(--blue-000);--n-search-link-badge-text-color: var(--blue-500);--n-search-link-badge-border: var(--blue-100)}.n-search-link-badge[data-resource=changelog]{--n-search-link-badge-color: var(--gold-000);--n-search-link-badge-text-color: var(--gold-500);--n-search-link-badge-border: var(--gold-100)}.n-search-link-badge[data-resource=guide]{--n-search-link-badge-color: var(--teal-000);--n-search-link-badge-text-color: var(--teal-500);--n-search-link-badge-border: var(--teal-100)}

package/dist/assets/SearchModal.css

@@ -1 +1 @@
-.n-keyboard-key{--n-key-text-size: .8em;--n-key-border-radius: 6px;--n-key-text-color: currentColor;--n-key-bg-color: transparent;display:flex;gap:calc(var(--space-3xs) * .5);font-size:var(--n-key-text-size);color:var(--n-key-text-color);background:var(--n-key-bg-color);border:1px solid currentColor;border-radius:var(--n-key-border-radius);padding:var(--n-key-padding-block, .05em) var(--n-key-padding-inline, .3em)}.n-search-heading{--n-search-heading-weight: var(--font-regular, 400);--n-search-heading-size: var(--step--2, 13px);--n-search-heading-color: var(--color-text-3, #757575);font-size:var(--n-search-heading-size);font-weight:var(--n-search-heading-weight);color:var(--n-search-heading-color);padding-inline:1rem;margin-block:var(--space-xs);letter-spacing:.2px}.n-search-link{--n-search-icon-size: 1em;all:unset;display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-s, 1rem);align-items:center;padding:var(--n-search-link-padding-block, 1em) var(--n-search-link-padding-inline, 1em);font-size:var(--step--1);font-weight:var(--font-regular);text-decoration:none;cursor:pointer}.n-search-link-body{flex:1;width:80%;color:var(--color-text-2)}.n-search-link:is(:hover,:focus-within){background:var(--n-search-color-bg-2)}.n-search-link:is(:hover,:focus-within) .n-search-link-icon [data-icon=caretRight]{display:block}.n-search-link-title{font-weight:var(--font-semibold, 680);color:var(--color-text-2);line-height:1.5}.n-search-link-excerpt{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--color-text-3);line-height:1.3;font-size:.9em;margin-block-start:var(--space-3xs)}.n-search-link-icon{display:flex;width:var(--n-search-icon-size);height:var(--n-search-icon-size);color:var(--n-search-color-text-secondary)}.n-search-link-icon [data-icon=caretRight]{display:none;width:.8em;opacity:.3}.n-search-link-label{margin-inline-end:var(--space-3xs)}.n-search-link-badge{display:inline-block;width:max-content;font-size:.7em;padding:.1em .4em;position:relative;bottom:.3em;color:var(--n-search-link-badge-text-color, var(--neutral-500));background:var(--n-search-link-badge-color, var(--neutral-100));border:1px solid var(--n-search-link-badge-border, var(--neutral-300));border-radius:3px}.n-search-link-badge[data-resource=blog]{--n-search-link-badge-color: var(--blue-000);--n-search-link-badge-text-color: var(--blue-500);--n-search-link-badge-border: var(--blue-100)}.n-search-link-badge[data-resource=changelog]{--n-search-link-badge-color: var(--gold-000);--n-search-link-badge-text-color: var(--gold-500);--n-search-link-badge-border: var(--gold-100)}.n-search-link-badge[data-resource=guide]{--n-search-link-badge-color: var(--teal-000);--n-search-link-badge-text-color: var(--teal-500);--n-search-link-badge-border: var(--teal-100)}.n-search-modal{--n-search-padding-inline: .5em;--n-search-color-text: var(--color-text-1, currentColor);--n-search-color-text-secondary: var(--color-text-2, currentColor);--n-search-color-bg: var(--color-bg-1);--n-search-color-bg-2: var(--color-bg-2);--n-search-color-border: var(--color-bg-3);--n-search-border-radius: 8px;--n-search-max-w: 600px;--n-search-text-highlight: var(--color-text-accent)}.n-search-modal{padding:0;border:none;border-radius:var(--n-search-border-radius);width:min(var(--n-search-max-w),100%);margin-inline:auto}.n-search-container{--mark-bg: var(--n-search-text-highlight);display:grid;width:min(var(--n-search-max-w),100%);min-height:470px;background-color:var(--n-search-color-bg);border-radius:var(--n-search-border-radius);overflow:hidden}.n-search-bar{display:flex;flex-wrap:wrap;align-items:center;overflow:hidden;background:var(--n-search-color-bg);border-bottom:1px solid var(--n-search-color-border)}.n-search-input-wrapper{all:unset;display:flex;width:100%;border-bottom:1px solid var(--n-search-color-border)}.n-search-input{display:inline-flex;box-sizing:border-box;background:var(--n-search-color-bg);inline-size:100%;padding-block:.75rem;padding-inline:var(--n-search-padding-inline);flex:1;border:none;outline:none;font-size:1rem;color:var(--color-text-1)}.n-search-input::placeholder{color:var(--n-search-color-text)}.n-search-label{display:flex;padding-inline:var(--n-search-padding-inline);align-items:center}.n-search-label>*{display:inline-block;margin:0}.n-search-icon{display:flex;width:var(--icon-size, 1em);height:var(--icon-size, 1em);color:var(--n-search-color-text-secondary)}.n-search-term{font-weight:var(--font-medium);font-size:1.1em}.n-search-window{height:400px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;margin-block:0;background:var(--n-search-color-bg)}.n-results-list,ul[role=list]{list-style:none;padding:0}.n-results-list-item{border-bottom:1px solid var(--color-bg-3)}.n-results-list-item:first-of-type{border-top:1px solid var(--color-bg-3)}.n-search-footer{border-top:1px solid var(--n-search-color-border);padding:var(--space-2xs) var(--space-s);background:var(--color-bg-2);display:flex;gap:var(--space-m)}.n-search-footer-tip{--n-key-text-color: var(--n-search-color-text-secondary);color:var(--n-search-color-text-secondary);display:flex;gap:var(--space-2xs);align-items:center;font-size:var(--step--1)}.n-search-modal{transition:display .2s allow-discrete,overlay .2s allow-discrete;animation:closeSearch .2s forwards}.n-search-modal[open]{animation:openSearch .2s forwards}@keyframes openSearch{0%{opacity:0;transform:translateY(20px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes closeSearch{0%{opacity:1;transform:translateY(0) scale(1)}50%{opacity:.3}to{opacity:0;transform:translateY(20px) scale(.9)}}.n-search-modal::backdrop{animation:closeSearchBackdrop .2s forwards}.n-search-modal[open]::backdrop{animation:openSearchBackdrop .2s forwards}@keyframes openSearchBackdrop{0%{opacity:0;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}to{opacity:1;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}}@keyframes closeSearchBackdrop{0%{opacity:1;-webkit-backdrop-filter:blur(1.5px);backdrop-filter:blur(1.5px)}50%{opacity:.3}to{opacity:0;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}}
+.n-keyboard-key{--n-key-text-size: .8em;--n-key-border-radius: 6px;--n-key-text-color: currentColor;--n-key-bg-color: transparent;display:flex;gap:calc(var(--space-3xs) * .5);font-size:var(--n-key-text-size);color:var(--n-key-text-color);background:var(--n-key-bg-color);border:1px solid currentColor;border-radius:var(--n-key-border-radius);padding:var(--n-key-padding-block, .05em) var(--n-key-padding-inline, .3em)}.n-search-heading{--n-search-heading-weight: var(--font-weight-regular, 400);--n-search-heading-size: var(--font-size-text-sm, 13px);--n-search-heading-color: var(--color-text-weak, #757575);font-size:var(--n-search-heading-size);font-weight:var(--n-search-heading-weight);color:var(--n-search-heading-color);padding-inline:1rem;margin-block:var(--space-xs);letter-spacing:.2px}.n-search-link{--n-search-icon-size: 1em;all:unset;display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-s, 1rem);align-items:center;padding:var(--n-search-link-padding-block, 1em) var(--n-search-link-padding-inline, 1em);font-size:var(--font-size-text-sm);font-weight:var(--font-weight-regular);text-decoration:none;cursor:pointer}.n-search-link-body{flex:1;width:80%;color:var(--color-text-weak);text-wrap:pretty}.n-search-link:is(:hover,:focus-within){background:var(--n-search-color-bg-2)}.n-search-link:is(:hover,:focus-within) .n-search-link-icon [data-icon=caretRight]{display:block}.n-search-link-title{font-weight:var(--font-weight-medium);color:var(--color-text);line-height:1.5}.n-search-link-excerpt{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--color-text-weak);line-height:1.3;font-size:.9em;margin-block-start:var(--space-3xs)}.n-search-link-icon{display:flex;width:var(--n-search-icon-size);height:var(--n-search-icon-size);color:var(--n-search-color-text-secondary)}.n-search-link-icon [data-icon=caretRight]{display:none;width:.8em;opacity:.3}.n-search-link-label{margin-inline-end:var(--space-3xs)}.n-search-link-badge{display:inline-block;width:max-content;font-size:.7em;padding:.1em .4em;position:relative;bottom:.3em;color:var(--n-search-link-badge-text-color, var(--neutral-500));background:var(--n-search-link-badge-color, var(--neutral-100));border:1px solid var(--n-search-link-badge-border, var(--neutral-300));border-radius:3px}.n-search-link-badge[data-resource=blog]{--n-search-link-badge-color: var(--blue-000);--n-search-link-badge-text-color: var(--blue-500);--n-search-link-badge-border: var(--blue-100)}.n-search-link-badge[data-resource=changelog]{--n-search-link-badge-color: var(--gold-000);--n-search-link-badge-text-color: var(--gold-500);--n-search-link-badge-border: var(--gold-100)}.n-search-link-badge[data-resource=guide]{--n-search-link-badge-color: var(--teal-000);--n-search-link-badge-text-color: var(--teal-500);--n-search-link-badge-border: var(--teal-100)}.n-search-modal{--n-search-padding-inline: .5em;--n-search-color-text: var(--color-text, currentColor);--n-search-color-text-secondary: var(--color-text-weak, currentColor);--n-search-color-bg: var(--color-bg);--n-search-color-bg-2: var(--color-bg-2);--n-search-color-border: var(--color-bg-3);--n-search-border-radius: 8px;--n-search-max-w: 600px;--n-search-text-highlight: var(--color-text-accent)}.n-search-modal{padding:0;border:none;border-radius:var(--n-search-border-radius);width:min(var(--n-search-max-w),100%);margin:auto}.n-search-container{--mark-bg: var(--n-search-text-highlight);display:grid;width:min(var(--n-search-max-w),100%);min-height:470px;background-color:var(--n-search-color-bg);border-radius:var(--n-search-border-radius);overflow:hidden}.n-search-bar{display:flex;flex-wrap:wrap;align-items:center;overflow:hidden;background:var(--n-search-color-bg);border-bottom:1px solid var(--n-search-color-border)}.n-search-input-wrapper{all:unset;display:flex;width:100%;border-bottom:1px solid var(--n-search-color-border)}.n-search-input{display:inline-flex;box-sizing:border-box;background:var(--n-search-color-bg);inline-size:100%;padding-block:.75rem;padding-inline:var(--n-search-padding-inline);flex:1;border:none;outline:none;font-size:1rem;color:var(--color-text)}.n-search-input::placeholder{color:var(--n-search-color-text)}.n-search-label{display:flex;padding-inline:var(--n-search-padding-inline);align-items:center}.n-search-label>*{display:inline-block;margin:0}.n-search-icon{display:flex;width:var(--n-search-icon-size, .8em);height:var(--n-search-icon-size, .8em);color:var(--n-search-color-text-secondary)}.n-search-term{font-weight:var(--font-medium);font-size:1.1em}.n-search-window{height:400px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;margin-block:0;background:var(--n-search-color-bg)}.n-results-list,ul[role=list]{list-style:none;padding:0}.n-results-list-item{border-bottom:1px solid var(--color-bg-3)}.n-results-list-item:first-of-type{border-top:1px solid var(--color-bg-3)}.n-search-footer{border-top:1px solid var(--n-search-color-border);padding:var(--space-2xs) var(--space-s);background:var(--color-bg-2);display:flex;gap:var(--space-m)}.n-search-footer-tip{color:var(--n-search-color-text-secondary);display:flex;gap:var(--space-2xs);align-items:center;font-size:var(--font-size-text-sm)}.n-search-modal{transition:display .2s allow-discrete,overlay .2s allow-discrete;animation:closeSearch .2s forwards}.n-search-modal[open]{animation:openSearch .2s forwards}@keyframes openSearch{0%{opacity:0;transform:translateY(20px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes closeSearch{0%{opacity:1;transform:translateY(0) scale(1)}50%{opacity:.3}to{opacity:0;transform:translateY(20px) scale(.9)}}.n-search-modal::backdrop{animation:closeSearchBackdrop .2s forwards}.n-search-modal[open]::backdrop{animation:openSearchBackdrop .2s forwards}@keyframes openSearchBackdrop{0%{opacity:0;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}to{opacity:1;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}}@keyframes closeSearchBackdrop{0%{opacity:1;-webkit-backdrop-filter:blur(1.5px);backdrop-filter:blur(1.5px)}50%{opacity:.3}to{opacity:0;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}}

package/dist/assets/SearchToggle.css

@@ -1 +1 @@
-.n-search-toggle{all:unset;outline:revert;cursor:pointer;line-height:normal;padding:var(--space-2xs);transition:opacity .3s ease-in-out;max-width:max-content}.n-search-toggle:disabled{opacity:.3}
+.n-search-toggle{all:unset;outline:revert;display:grid;cursor:pointer;line-height:normal;padding:var(--space-2xs);transition:opacity .3s ease-in-out;max-width:max-content}.n-search-toggle svg{width:1rem;height:1rem}.n-search-toggle:disabled{opacity:.3}

package/dist/chunks/compat.module.DT16W4Wr.js

@@ -0,0 +1,175 @@
+import { Component as f, options as a, createElement as d, Fragment as h, toChildArray as v } from "preact";
+import "./hooks.module.CNV9mxng.js";
+function C(e, t) {
+  for (var r in t) e[r] = t[r];
+  return e;
+}
+function m(e, t) {
+  for (var r in e) if (r !== "__source" && !(r in t)) return !0;
+  for (var o in t) if (o !== "__source" && e[o] !== t[o]) return !0;
+  return !1;
+}
+function y(e, t) {
+  this.props = e, this.context = t;
+}
+(y.prototype = new f()).isPureReactComponent = !0, y.prototype.shouldComponentUpdate = function(e, t) {
+  return m(this.props, e) || m(this.state, t);
+};
+var b = a.__b;
+a.__b = function(e) {
+  e.type && e.type.__f && e.ref && (e.props.ref = e.ref, e.ref = null), b && b(e);
+};
+var x = typeof Symbol < "u" && Symbol.for && Symbol.for("react.forward_ref") || 3911;
+function z(e) {
+  function t(r) {
+    var o = C({}, r);
+    return delete o.ref, e(o, r.ref || null);
+  }
+  return t.$$typeof = x, t.render = t, t.prototype.isReactComponent = t.__f = !0, t.displayName = "ForwardRef(" + (e.displayName || e.name) + ")", t;
+}
+var U = a.__e;
+a.__e = function(e, t, r, o) {
+  if (e.then) {
+    for (var n, l = t; l = l.__; ) if ((n = l.__c) && n.__c) return t.__e == null && (t.__e = r.__e, t.__k = r.__k), n.__c(e, t);
+  }
+  U(e, t, r, o);
+};
+var g = a.unmount;
+function N(e, t, r) {
+  return e && (e.__c && e.__c.__H && (e.__c.__H.__.forEach(function(o) {
+    typeof o.__c == "function" && o.__c();
+  }), e.__c.__H = null), (e = C({}, e)).__c != null && (e.__c.__P === r && (e.__c.__P = t), e.__c.__e = !0, e.__c = null), e.__k = e.__k && e.__k.map(function(o) {
+    return N(o, t, r);
+  })), e;
+}
+function E(e, t, r) {
+  return e && r && (e.__v = null, e.__k = e.__k && e.__k.map(function(o) {
+    return E(o, t, r);
+  }), e.__c && e.__c.__P === t && (e.__e && r.appendChild(e.__e), e.__c.__e = !0, e.__c.__P = r)), e;
+}
+function p() {
+  this.__u = 0, this.o = null, this.__b = null;
+}
+function R(e) {
+  var t = e.__.__c;
+  return t && t.__a && t.__a(e);
+}
+function s() {
+  this.i = null, this.l = null;
+}
+a.unmount = function(e) {
+  var t = e.__c;
+  t && t.__R && t.__R(), t && 32 & e.__u && (e.type = null), g && g(e);
+}, (p.prototype = new f()).__c = function(e, t) {
+  var r = t.__c, o = this;
+  o.o == null && (o.o = []), o.o.push(r);
+  var n = R(o.__v), l = !1, _ = function() {
+    l || (l = !0, r.__R = null, n ? n(i) : i());
+  };
+  r.__R = _;
+  var i = function() {
+    if (!--o.__u) {
+      if (o.state.__a) {
+        var u = o.state.__a;
+        o.__v.__k[0] = E(u, u.__c.__P, u.__c.__O);
+      }
+      var c;
+      for (o.setState({ __a: o.__b = null }); c = o.o.pop(); ) c.forceUpdate();
+    }
+  };
+  o.__u++ || 32 & t.__u || o.setState({ __a: o.__b = o.__v.__k[0] }), e.then(_, _);
+}, p.prototype.componentWillUnmount = function() {
+  this.o = [];
+}, p.prototype.render = function(e, t) {
+  if (this.__b) {
+    if (this.__v.__k) {
+      var r = document.createElement("div"), o = this.__v.__k[0].__c;
+      this.__v.__k[0] = N(this.__b, r, o.__O = o.__P);
+    }
+    this.__b = null;
+  }
+  var n = t.__a && d(h, null, e.fallback);
+  return n && (n.__u &= -33), [d(h, null, t.__a ? null : e.children), n];
+};
+var k = function(e, t, r) {
+  if (++r[1] === r[0] && e.l.delete(t), e.props.revealOrder && (e.props.revealOrder[0] !== "t" || !e.l.size)) for (r = e.i; r; ) {
+    for (; r.length > 3; ) r.pop()();
+    if (r[1] < r[0]) break;
+    e.i = r = r[2];
+  }
+};
+(s.prototype = new f()).__a = function(e) {
+  var t = this, r = R(t.__v), o = t.l.get(e);
+  return o[0]++, function(n) {
+    var l = function() {
+      t.props.revealOrder ? (o.push(n), k(t, e, o)) : n();
+    };
+    r ? r(l) : l();
+  };
+}, s.prototype.render = function(e) {
+  this.i = null, this.l = /* @__PURE__ */ new Map();
+  var t = v(e.children);
+  e.revealOrder && e.revealOrder[0] === "b" && t.reverse();
+  for (var r = t.length; r--; ) this.l.set(t[r], this.i = [1, 0, this.i]);
+  return e.children;
+}, s.prototype.componentDidUpdate = s.prototype.componentDidMount = function() {
+  var e = this;
+  this.l.forEach(function(t, r) {
+    k(e, r, t);
+  });
+};
+var A = typeof Symbol < "u" && Symbol.for && Symbol.for("react.element") || 60103, V = /^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|dominant|fill|flood|font|glyph(?!R)|horiz|image(!S)|letter|lighting|marker(?!H|W|U)|overline|paint|pointer|shape|stop|strikethrough|stroke|text(?!L)|transform|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/, W = /^on(Ani|Tra|Tou|BeforeInp|Compo)/, H = /[A-Z0-9]/g, $ = typeof document < "u", j = function(e) {
+  return (typeof Symbol < "u" && typeof Symbol() == "symbol" ? /fil|che|rad/ : /fil|che|ra/).test(e);
+};
+f.prototype.isReactComponent = {}, ["componentWillMount", "componentWillReceiveProps", "componentWillUpdate"].forEach(function(e) {
+  Object.defineProperty(f.prototype, e, { configurable: !0, get: function() {
+    return this["UNSAFE_" + e];
+  }, set: function(t) {
+    Object.defineProperty(this, e, { configurable: !0, writable: !0, value: t });
+  } });
+});
+var P = a.event;
+function D() {
+}
+function F() {
+  return this.cancelBubble;
+}
+function B() {
+  return this.defaultPrevented;
+}
+a.event = function(e) {
+  return P && (e = P(e)), e.persist = D, e.isPropagationStopped = F, e.isDefaultPrevented = B, e.nativeEvent = e;
+};
+var L = { enumerable: !1, configurable: !0, get: function() {
+  return this.class;
+} }, O = a.vnode;
+a.vnode = function(e) {
+  typeof e.type == "string" && function(t) {
+    var r = t.props, o = t.type, n = {}, l = o.indexOf("-") === -1;
+    for (var _ in r) {
+      var i = r[_];
+      if (!(_ === "value" && "defaultValue" in r && i == null || $ && _ === "children" && o === "noscript" || _ === "class" || _ === "className")) {
+        var u = _.toLowerCase();
+        _ === "defaultValue" && "value" in r && r.value == null ? _ = "value" : _ === "download" && i === !0 ? i = "" : u === "translate" && i === "no" ? i = !1 : u[0] === "o" && u[1] === "n" ? u === "ondoubleclick" ? _ = "ondblclick" : u !== "onchange" || o !== "input" && o !== "textarea" || j(r.type) ? u === "onfocus" ? _ = "onfocusin" : u === "onblur" ? _ = "onfocusout" : W.test(_) && (_ = u) : u = _ = "oninput" : l && V.test(_) ? _ = _.replace(H, "-$&").toLowerCase() : i === null && (i = void 0), u === "oninput" && n[_ = u] && (_ = "oninputCapture"), n[_] = i;
+      }
+    }
+    o == "select" && n.multiple && Array.isArray(n.value) && (n.value = v(r.children).forEach(function(c) {
+      c.props.selected = n.value.indexOf(c.props.value) != -1;
+    })), o == "select" && n.defaultValue != null && (n.value = v(r.children).forEach(function(c) {
+      c.props.selected = n.multiple ? n.defaultValue.indexOf(c.props.value) != -1 : n.defaultValue == c.props.value;
+    })), r.class && !r.className ? (n.class = r.class, Object.defineProperty(n, "className", L)) : (r.className && !r.class || r.class && r.className) && (n.class = n.className = r.className), t.props = n;
+  }(e), e.$$typeof = A, O && O(e);
+};
+var S = a.__r;
+a.__r = function(e) {
+  S && S(e), e.__c;
+};
+var w = a.diffed;
+a.diffed = function(e) {
+  w && w(e);
+  var t = e.props, r = e.__e;
+  r != null && e.type === "textarea" && "value" in t && t.value !== r.value && (r.value = t.value == null ? "" : t.value);
+};
+export {
+  z as D
+};

package/dist/chunks/hooks.module.CNV9mxng.js

@@ -0,0 +1,138 @@
+import { options as x } from "preact";
+var v, n, H, y, m = 0, C = [], u = x, A = u.__b, q = u.__r, F = u.diffed, g = u.__c, k = u.unmount, T = u.__;
+function d(_, t) {
+  u.__h && u.__h(n, _, m || t), m = 0;
+  var r = n.__H || (n.__H = { __: [], __h: [] });
+  return _ >= r.__.length && r.__.push({}), r.__[_];
+}
+function S(_) {
+  return m = 1, z(j, _);
+}
+function z(_, t, r) {
+  var o = d(v++, 2);
+  if (o.t = _, !o.__c && (o.__ = [r ? r(t) : j(void 0, t), function(c) {
+    var e = o.__N ? o.__N[0] : o.__[0], f = o.t(e, c);
+    e !== f && (o.__N = [f, o.__[1]], o.__c.setState({}));
+  }], o.__c = n, !n.__f)) {
+    var a = function(c, e, f) {
+      if (!o.__c.__H) return !0;
+      var l = o.__c.__H.__.filter(function(i) {
+        return !!i.__c;
+      });
+      if (l.every(function(i) {
+        return !i.__N;
+      })) return !h || h.call(this, c, e, f);
+      var E = o.__c.props !== c;
+      return l.forEach(function(i) {
+        if (i.__N) {
+          var w = i.__[0];
+          i.__ = i.__N, i.__N = void 0, w !== i.__[0] && (E = !0);
+        }
+      }), h && h.call(this, c, e, f) || E;
+    };
+    n.__f = !0;
+    var h = n.shouldComponentUpdate, N = n.componentWillUpdate;
+    n.componentWillUpdate = function(c, e, f) {
+      if (this.__e) {
+        var l = h;
+        h = void 0, a(c, e, f), h = l;
+      }
+      N && N.call(this, c, e, f);
+    }, n.shouldComponentUpdate = a;
+  }
+  return o.__N || o.__;
+}
+function G(_, t) {
+  var r = d(v++, 3);
+  !u.__s && W(r.__H, t) && (r.__ = _, r.u = t, n.__H.__h.push(r));
+}
+function I(_) {
+  return m = 5, b(function() {
+    return { current: _ };
+  }, []);
+}
+function b(_, t) {
+  var r = d(v++, 7);
+  return W(r.__H, t) && (r.__ = _(), r.__H = t, r.__h = _), r.__;
+}
+function J(_, t) {
+  return m = 8, b(function() {
+    return _;
+  }, t);
+}
+function B() {
+  for (var _; _ = C.shift(); ) if (_.__P && _.__H) try {
+    _.__H.__h.forEach(s), _.__H.__h.forEach(p), _.__H.__h = [];
+  } catch (t) {
+    _.__H.__h = [], u.__e(t, _.__v);
+  }
+}
+u.__b = function(_) {
+  n = null, A && A(_);
+}, u.__ = function(_, t) {
+  _ && t.__k && t.__k.__m && (_.__m = t.__k.__m), T && T(_, t);
+}, u.__r = function(_) {
+  q && q(_), v = 0;
+  var t = (n = _.__c).__H;
+  t && (H === n ? (t.__h = [], n.__h = [], t.__.forEach(function(r) {
+    r.__N && (r.__ = r.__N), r.u = r.__N = void 0;
+  })) : (t.__h.forEach(s), t.__h.forEach(p), t.__h = [], v = 0)), H = n;
+}, u.diffed = function(_) {
+  F && F(_);
+  var t = _.__c;
+  t && t.__H && (t.__H.__h.length && (C.push(t) !== 1 && y === u.requestAnimationFrame || ((y = u.requestAnimationFrame) || D)(B)), t.__H.__.forEach(function(r) {
+    r.u && (r.__H = r.u), r.u = void 0;
+  })), H = n = null;
+}, u.__c = function(_, t) {
+  t.some(function(r) {
+    try {
+      r.__h.forEach(s), r.__h = r.__h.filter(function(o) {
+        return !o.__ || p(o);
+      });
+    } catch (o) {
+      t.some(function(a) {
+        a.__h && (a.__h = []);
+      }), t = [], u.__e(o, r.__v);
+    }
+  }), g && g(_, t);
+}, u.unmount = function(_) {
+  k && k(_);
+  var t, r = _.__c;
+  r && r.__H && (r.__H.__.forEach(function(o) {
+    try {
+      s(o);
+    } catch (a) {
+      t = a;
+    }
+  }), r.__H = void 0, t && u.__e(t, r.__v));
+};
+var U = typeof requestAnimationFrame == "function";
+function D(_) {
+  var t, r = function() {
+    clearTimeout(o), U && cancelAnimationFrame(t), setTimeout(_);
+  }, o = setTimeout(r, 100);
+  U && (t = requestAnimationFrame(r));
+}
+function s(_) {
+  var t = n, r = _.__c;
+  typeof r == "function" && (_.__c = void 0, r()), n = t;
+}
+function p(_) {
+  var t = n;
+  _.__c = _.__(), n = t;
+}
+function W(_, t) {
+  return !_ || _.length !== t.length || t.some(function(r, o) {
+    return r !== _[o];
+  });
+}
+function j(_, t) {
+  return typeof t == "function" ? t(_) : t;
+}
+export {
+  I as A,
+  b as T,
+  S as d,
+  J as q,
+  G as y
+};

package/dist/chunks/{useTimeout.DYuvQwFN.js → useTimeout.DOkYFG64.js}

@@ -1,4 +1,4 @@
-import { A as t, y as o } from "./hooks.module.DeYLzLnU.js";
+import { A as t, y as o } from "./hooks.module.CNV9mxng.js";
 function f(u, n) {
   const e = t(null), r = t("");
   return o(() => () => {

package/dist/components/index.d.ts

@@ -5,8 +5,4 @@ export { default as SearchLink } from './preact/SearchModal/components/SearchLin
 export { default as SearchHeading } from './preact/SearchModal/components/SearchHeading/SearchHeading';
 export { default as SearchToggle } from './preact/SearchModal/components/SearchToggle/SearchToggle';
 export { default as SearchModal } from './preact/SearchModal/components/SearchModal/SearchModal';
-export { default as ChatApp } from './preact/ChatApp/ChatApp';
 export { type IconName } from './preact/Icon';
-export { default as Button } from './Button.astro';
-export { default as DeployToNetlifyButton } from './DeployToNetlifyButton.astro';
-export { default as Tabs } from './Tabs.astro';

package/dist/components/preact/Modal/Modal.js

@@ -1,5 +1,5 @@
 import { u as l } from "../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
-import { D as d } from "../../../chunks/compat.module.BjTzMHXJ.js";
+import { D as d } from "../../../chunks/compat.module.DT16W4Wr.js";
 const u = d(function({ children: o, className: r, ...a }, t) {
   return /* @__PURE__ */ l("dialog", { ref: t, className: r, role: "dialog", "aria-modal": "true", ...a, children: o });
 });

package/dist/components/preact/SearchModal/components/SearchInput.js

@@ -1,6 +1,6 @@
 import { u as e } from "../../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
-import { d as u, y as h } from "../../../../chunks/hooks.module.DeYLzLnU.js";
-import { u as o } from "../../../../chunks/useTimeout.DYuvQwFN.js";
+import { d as u, y as h } from "../../../../chunks/hooks.module.CNV9mxng.js";
+import { u as o } from "../../../../chunks/useTimeout.DOkYFG64.js";
 import d from "../../Icon/index.js";
 const I = (a) => {
   const [r, t] = u(""), { reset: c, run: i } = o((l) => {

package/dist/components/preact/SearchModal/components/SearchLink/SearchLink.js

@@ -1,5 +1,5 @@
 import { u as a } from "../../../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
-import "../../../../../chunks/hooks.module.DeYLzLnU.js";
+import "../../../../../chunks/hooks.module.CNV9mxng.js";
 import { useSearchLogger as h } from "../../hooks/useSearchLogger.js";
 import c from "../../../Icon/index.js";
 import '../../../../../assets/SearchLink.css';const k = ({ icon: n, label: s, url: r, excerpt: l, resource: e }) => {

package/dist/components/preact/SearchModal/components/SearchModal/SearchModal.js

@@ -1,5 +1,5 @@
 import { u as e } from "../../../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
-import { A as v, y as u, d as S } from "../../../../../chunks/hooks.module.DeYLzLnU.js";
+import { A as v, y as u, d as S } from "../../../../../chunks/hooks.module.CNV9mxng.js";
 import L from "../../../Modal/Modal.js";
 import d from "../../../KeyboardKey/KeyboardKey.js";
 import k from "../SearchWindow.js";

package/dist/components/preact/SearchModal/components/SearchToggle/SearchToggle.js

@@ -1,8 +1,8 @@
 import { u as e } from "../../../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
-import { D as t } from "../../../../../chunks/compat.module.BjTzMHXJ.js";
+import { D as a } from "../../../../../chunks/compat.module.DT16W4Wr.js";
 import o from "../../../Icon/index.js";
-import '../../../../../assets/SearchToggle.css';const s = t(function(r, a) {
-  return /* @__PURE__ */ e("button", { id: r.id, ref: a, class: "n-search-toggle", disabled: !0, "data-ntl-search-toggle": !0, children: [
+import '../../../../../assets/SearchToggle.css';const s = a(function(r, t) {
+  return /* @__PURE__ */ e("button", { id: r.id, ref: t, class: "n-search-toggle button", disabled: !0, "data-ntl-search-toggle": !0, children: [
     /* @__PURE__ */ e("span", { class: "visually-hidden", children: "Search" }),
     /* @__PURE__ */ e(o, { name: r.iconName || "search" })
   ] });

package/dist/components/preact/SearchModal/components/SearchWindow.js

@@ -1,5 +1,5 @@
 import { u as e } from "../../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
-import { T as o } from "../../../../chunks/hooks.module.DeYLzLnU.js";
+import { T as o } from "../../../../chunks/hooks.module.CNV9mxng.js";
 import t from "./SearchHeading/SearchHeading.js";
 import a from "./SearchLink/SearchLink.js";
 const h = ({

package/dist/components/preact/SearchModal/hooks/useKeyboardNav.js

@@ -1,4 +1,4 @@
-import { y as l } from "../../../../chunks/hooks.module.DeYLzLnU.js";
+import { y as l } from "../../../../chunks/hooks.module.CNV9mxng.js";
 function s(r, t, o, c) {
   l(() => {
     if (!r) return;

package/dist/components/preact/SearchModal/hooks/useSearch.js

@@ -1,5 +1,5 @@
-import { d as g, A as w } from "../../../../chunks/hooks.module.DeYLzLnU.js";
-import { u as S } from "../../../../chunks/useTimeout.DYuvQwFN.js";
+import { d as g, A as w } from "../../../../chunks/hooks.module.CNV9mxng.js";
+import { u as S } from "../../../../chunks/useTimeout.DOkYFG64.js";
 function x() {
   const [l, r] = g({
     searchTerm: "",

package/dist/components/preact/SearchModal/hooks/useSearchHotkeys.js

@@ -1,4 +1,4 @@
-import { y as u } from "../../../../chunks/hooks.module.DeYLzLnU.js";
+import { y as u } from "../../../../chunks/hooks.module.CNV9mxng.js";
 function a(t, r, n, o) {
   u(() => {
     if (!t) return;

package/dist/components/preact/SearchModal/hooks/useSearchLogger.js

@@ -1,4 +1,4 @@
-import { A as y, y as h, q as k } from "../../../../chunks/hooks.module.DeYLzLnU.js";
+import { A as y, y as h, q as k } from "../../../../chunks/hooks.module.CNV9mxng.js";
 class s {
   /**
    * Pushes an event payload into the dataLayer.

package/dist/components/preact/SearchModal/hooks/useSearchParams.js

@@ -1,4 +1,4 @@
-import { y as c } from "../../../../chunks/hooks.module.DeYLzLnU.js";
+import { y as c } from "../../../../chunks/hooks.module.CNV9mxng.js";
 function n(r, o, a) {
   c(() => {
     if (typeof location > "u" || r) return;

package/dist/components/preact/SearchModal/hooks/useSearchToggles.js

@@ -1,4 +1,4 @@
-import { y as l } from "../../../../chunks/hooks.module.DeYLzLnU.js";
+import { y as l } from "../../../../chunks/hooks.module.CNV9mxng.js";
 function i(c, r) {
   l(() => {
     if (!c) return;

package/dist/components/preact/index.d.ts

@@ -4,6 +4,5 @@ export { default as Icon } from './Icon';
 export { default as SearchLink } from './SearchModal/components/SearchLink/SearchLink';
 export { default as SearchHeading } from './SearchModal/components/SearchHeading/SearchHeading';
 export { default as SearchToggle } from './SearchModal/components/SearchToggle/SearchToggle';
-export { default as ChatApp } from './ChatApp/ChatApp';
 export { SearchModal } from './SearchModal';
 export { type IconName } from './Icon';

package/dist/components/preact/index.js

@@ -1,20 +1,18 @@
 import { default as t } from "./KeyboardKey/KeyboardKey.js";
 import { default as d } from "./Modal/Modal.js";
-import { default as l } from "./Icon/index.js";
+import { default as m } from "./Icon/index.js";
 import { default as s } from "./SearchModal/components/SearchLink/SearchLink.js";
 import { default as x } from "./SearchModal/components/SearchHeading/SearchHeading.js";
 import { default as h } from "./SearchModal/components/SearchToggle/SearchToggle.js";
-import { default as S } from "./ChatApp/ChatApp.js";
 import "preact";
-import "../../chunks/hooks.module.DeYLzLnU.js";
-import { default as n } from "./SearchModal/components/SearchModal/SearchModal.js";
+import "../../chunks/hooks.module.CNV9mxng.js";
+import { default as S } from "./SearchModal/components/SearchModal/SearchModal.js";
 export {
-  S as ChatApp,
-  l as Icon,
+  m as Icon,
   t as KeyboardKey,
   d as Modal,
   x as SearchHeading,
   s as SearchLink,
-  n as SearchModal,
+  S as SearchModal,
   h as SearchToggle
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@netlify/spark-ui",
   "description": "Assets, design tokens, components, and utilities",
-  "version": "0.0.47-alpha",
+  "version": "1.0.0",
   "type": "module",
   "main": "dist/components/preact/index.js",
   "types": "dist/components/preact/index.d.ts",
@@ -28,15 +28,14 @@
     "./logos/*.svg": "./packages/assets/logos/*.svg",
     "./styles/*.css": "./packages/styles/*.css",
     "./components": "./packages/components/index.ts",
+    "./components/*": "./packages/components/*",
     "./utils": "./packages/utils/index.ts",
     "./analytics": "./packages/analytics/index.ts"
   },
   "dependencies": {
-    "@kapaai/react-sdk": "^0.0.5",
     "@preact/preset-vite": "^2.10.1",
     "@shikijs/transformers": "^3.3.0",
     "glob": "^11.0.1",
-    "marked": "^15.0.11",
     "preact": "^10.26.4",
     "vite": "^6.2.5",
     "vite-plugin-dts": "^4.5.3",
@@ -44,9 +43,13 @@
     "vite-tsconfig-paths": "^5.1.4"
   },
   "devDependencies": {
-    "@terrazzo/cli": "^0.6.3",
-    "@terrazzo/plugin-css": "^0.6.0",
+    "@semantic-release/changelog": "^6.0.3",
+    "@semantic-release/git": "^10.0.1",
+    "@semantic-release/npm": "^12.0.1",
+    "@terrazzo/cli": "^0.7.2",
+    "@terrazzo/plugin-css": "^0.7.2",
     "@types/gtag.js": "^0.0.20",
+    "semantic-release": "^24.2.4",
     "tslib": "^2.8.1",
     "typescript": "^5.8.2"
   },

package/packages/assets/fonts/README.md

@@ -0,0 +1,5 @@
+# Fonts
+
+- [Figtree](https://github.com/erikdkennedy/figtree)
+- [Instrument Sans](https://github.com/Instrument/instrument-sans)
+- [Martian Mono](https://github.com/evilmartians/mono.git)

package/packages/components/Ticker.astro

@@ -48,6 +48,7 @@ const css = {
     overflow: hidden;
     user-select: none;
     gap: var(--_gap);
+    max-width: 100%;
 
     /** Fade out along edges */
     mask-image: linear-gradient(