@pontive/pontkit-core 1.1.3 → 1.2.0

package/dist/primitives/components/ui/select/select-trigger.d.ts

@@ -2,6 +2,18 @@ import { BaseElement } from '../../../helpers';
 import { PropertyValues } from 'lit';
 import { Select } from './select';
 declare class SelectTrigger extends BaseElement {
+    /**
+     * A unique id for the trigger, placed on the inner <button>.
+     *
+     * Mirrors what pont-input and pont-textarea already do with `id`, and for the
+     * same reason: a <label for> can only point at the focusable control, which
+     * lives inside. Without it a select is the one field in a form that cannot be
+     * labelled, and screen readers announce it unnamed.
+     *
+     * The attribute is moved off the host so the id is not duplicated in the DOM.
+     */
+    id: string;
+    private _triggerId;
     get _select(): Select;
     private classObserver?;
     private parentObserver?;
@@ -10,6 +22,9 @@ declare class SelectTrigger extends BaseElement {
     private onStoreChange;
     get _containerElement(): HTMLSpanElement | null;
     protected firstUpdated(_changedProperties: PropertyValues): void;
+    protected updated(_changedProperties: PropertyValues): void;
+    /** Takes `id` off the host and keeps it for the inner button. */
+    private _adoptId;
     handleClick: (e: Event) => void;
     protected createRenderRoot(): HTMLElement | DocumentFragment;
     protected getAttributesToExclude(): string[];

package/dist/service/http/fetch.d.ts

@@ -10,9 +10,9 @@ export interface RequestOptions extends RequestInit {
  * Calls the management API on `apiBaseUrl` with the signed-in user's access
  * token.
  *
- * No project header is sent. The token's issuer is the project's own auth
- * domain, and that is what the gateway resolves the project from — a header
- * naming any other project would be refused. What the browser sends is exactly
+ * No instance header is sent. The token's issuer is the instance's own auth
+ * domain, and that is what the gateway resolves the instance from — a header
+ * naming any other instance would be refused. What the browser sends is exactly
  * the bearer, so the request needs no cookies and no credentialed CORS.
  */
 export declare function apiFetch<T>(endpoint: string, options?: RequestOptions): Promise<T>;

package/dist/service/http/user/index.d.ts

@@ -1,7 +1,7 @@
 import { UpdateUserRequest, User } from '../../../types';
 /**
  * The signed-in user's own profile. `/me` is the one management route a
- * project user's token may reach: the subject is the caller, so there is no
+ * instance user's token may reach: the subject is the caller, so there is no
  * identifier to pass and nothing to authorize beyond "you are you".
  */
 export declare function getUser(): Promise<User>;

package/dist/styles.css

@@ -10286,15 +10286,26 @@ pont-scroll-area > [data-slot=scroll-area] {
   --pont-watermark-color-text: currentColor;
   --pont-watermark-muted-color-text: hsl(var(--pont-sem-color-text-secondary));
 
+  /* The lockup's HEIGHT; its width follows the ~5:1 aspect ratio. */
   --pont-watermark-logo-space-size: var(--pont-ref-space-4);
 
-  --pont-watermark-logo-rect-color: currentColor;
-  --pont-watermark-brand-logo-rect-color: var(--pont-color-pontive);
-  --pont-watermark-brand-logo-path-color: var(--pont-color-on-pontive);
-  --pont-watermark-theme-logo-path-color: hsl(var(--pont-sem-color-bg));
-  --pont-watermark-muted-logo-path-color: hsl(
-    var(--pont-sem-color-bg-fill-secondary)
+  /*
+   * The old tile/glyph pair (*-logo-rect-color / *-logo-path-color) is gone
+   * with the tile. `brand-logo-path-color` was --pont-color-on-pontive, i.e.
+   * white, which only ever made sense knocked out of an indigo square; there is
+   * nothing for it to sit on now.
+   *
+   * The mark keeps --pont-color-pontive, the indigo the tile carried. The
+   * wordmark defaults to currentColor so it reads as part of the label.
+   */
+  --pont-watermark-logo-mark-color: currentColor;
+  --pont-watermark-brand-logo-mark-color: var(--pont-color-pontive);
+  --pont-watermark-theme-logo-mark-color: currentColor;
+  --pont-watermark-muted-logo-mark-color: hsl(
+    var(--pont-sem-color-text-secondary)
   );
+
+  --pont-watermark-logo-wordmark-color: currentColor;
 }
 
 /* 
@@ -10367,7 +10378,22 @@ DIVIDER
     var(--pont-sem-color-bg-fill-secondary)
   );
 
-  --pont-account-settings-page-color-bg: hsl(
+  /*
+   * PAGE mode inherits the host page's ground.
+   *
+   * This was bg-surface-secondary — the very token pont-card reads — so the
+   * cards and the slab behind them resolved to one colour at every brand and
+   * in both themes, and only the card's 1px ring separated them. An embedded
+   * widget has no business painting a ground anyway: it is dropped into
+   * someone else's layout, with square corners against their rounded one.
+   *
+   * A brand that does want a distinct panel sets this token; the default is to
+   * stay out of the way.
+   */
+  --pont-account-settings-page-color-bg: transparent;
+
+  /* The modal is a surface over a scrim, so it keeps a real ground. */
+  --pont-account-settings-modal-content-color-bg: hsl(
     var(--pont-sem-color-bg-surface-secondary)
   );
 
@@ -10382,10 +10408,14 @@ DIVIDER
   --pont-account-settings-vertical-content-space-mb: var(--pont-ref-space-16);
   --pont-account-settings-close-button-space: var(--pont-ref-space-8);
   --pont-account-settings-watermark-space-py: var(--pont-ref-space-4);
-  --pont-account-settings-content-offset-ml: var(0);
+  /* Was `var(0)` — not a valid var() call, so the margin-left that reads it was
+   * dropped and computed 0px. Stated as the 0 it has always effectively been. */
+  --pont-account-settings-content-offset-ml: 0;
   --pont-account-settings-overlay-color: hsl(var(--pont-ref-color-base-900) / 0.5);
   --pont-account-settings-overlay-z: 9998;
-  --pont-account-settings-title-font-size: 18px;
+  /* Was a hardcoded 18px, so a brand moving the type scale left the card
+   * titles behind. --pont-sem-font-size-lg is the 18px step. */
+  --pont-account-settings-title-font-size: var(--pont-sem-font-size-lg);
   --pont-account-settings-title-gap: var(--pont-ref-space-2);
   --pont-account-settings-card-header-space-px: var(--pont-ref-space-4);
   --pont-account-settings-card-header-space-py: var(--pont-ref-space-2);
@@ -10406,7 +10436,9 @@ DIVIDER
   --pont-account-settings-sidebar-tab-spacing-bottom: var(--pont-ref-space-2);
   --pont-account-settings-sidebar-burger-padding: var(--pont-ref-space-2);
   --pont-account-settings-sidebar-burger-label-left: var(--pont-ref-space-2);
-  --pont-account-settings-sidebar-burger-label-font-size: 18px;
+  --pont-account-settings-sidebar-burger-label-font-size: var(
+    --pont-sem-font-size-lg
+  );
   --pont-account-settings-sidebar-drawer-body-space: var(--pont-ref-space-4);
   --pont-account-settings-sidebar-body-height: 100%;
   --pont-account-settings-security-panel-max-width: 42rem;
@@ -10446,7 +10478,18 @@ DIVIDER
     var(--pont-sem-color-bg-fill-secondary)
   );
   --pont-sidebar-tab-trigger-burger-default-color-bg-active: inherit;
-  --pont-account-settings-card-radius: 0.5rem;
+  /*
+   * There is deliberately no --pont-account-settings-card-radius here. It was a
+   * hardcoded 0.5rem overriding --pont-card-radius, which normally reads
+   * --pont-sem-radius-layout off the single --pont-ref-radius that branding-svc
+   * drives — so these cards were the one place in the widget a brand's radius
+   * could not reach.
+   */
+
+  --pont-account-settings-edit-card-shadow: var(--pont-sem-shadow-form);
+  --pont-account-settings-skeleton-sidebar-width: 110px;
+  --pont-account-settings-skeleton-tab-height: var(--pont-ref-space-8);
+  --pont-account-settings-skeleton-card-height: calc(var(--pont-ref-space-1) * 40);
   --pont-account-settings-info-card-button-space-px-lg: var(--pont-ref-space-4);
   --pont-account-settings-modal-content-space-py: var(--pont-ref-space-2);
   --pont-account-settings-modal-content-space-px: var(--pont-ref-space-4);
@@ -10455,7 +10498,10 @@ DIVIDER
   --pont-account-settings-modal-radius: var(--pont-modal-radius);
   --pont-account-settings-modal-space-min-width: var(--pont-modal-space-min-width);
   --pont-account-settings-modal-color-bg: var(--pont-modal-color-bg);
-  --pont-account-settings-modal-content-max-height: calc(100vh-100px);
+  /* calc() needs whitespace around the operator; `100vh-100px` parsed as a
+   * single bad token, so the whole value was invalid and the modal's
+   * max-height constraint never applied. */
+  --pont-account-settings-modal-content-max-height: calc(100vh - 100px);
   --pont-account-settings-modal-content-height: 864px;
   --pont-member-management-modal-content-min-height: 50vh;
   --pont-account-settings-modal-width-border: var(--pont-modal-width-border);
@@ -10481,9 +10527,12 @@ DIVIDER
   --pont-account-info-verification-form-card-color-bg: hsl(
     var(--pont-sem-color-bg-fill-secondary)
   );
-  --pont-account-info-avatar-space-size: calc(var(--pont-ref-space-1) * 37);
+  /* 72px. Was 148px (space-1 * 37), sized for a standalone avatar column; as a
+   * row in the field list that dwarfed the card. */
+  --pont-account-info-avatar-space-size: calc(var(--pont-ref-space-1) * 18);
   --pont-account-info-avatar-color-border: hsl(var(--pont-sem-color-border));
-  --pont-account-info-avatar-width-border: 1px;
+  --pont-account-info-avatar-width-border: var(--pont-sem-width-border);
+  --pont-account-info-avatar-shadow: var(--pont-sem-shadow-overlay);
 }
 
 /* Sidebar */
@@ -10493,13 +10542,13 @@ DIVIDER
   --pont-sidebar-color-text: hsl(var(--pont-sem-color-text));
 }
 
-/* nav-user */
+/* account-menu */
 :root {
-  --pont-nav-user-button-space-py: var(--pont-ref-space-2);
-  --pont-nav-user-popover-item-color-bg-hover: hsl(
+  --pont-account-menu-button-space-py: var(--pont-ref-space-2);
+  --pont-account-menu-popover-item-color-bg-hover: hsl(
     var(--pont-sem-color-bg-fill-secondary)
   );
-  --pont-nav-user-dropdown-menu-content-space-p: var(--pont-ref-space-2);
+  --pont-account-menu-dropdown-menu-content-space-p: var(--pont-ref-space-2);
 }
 
 /* account info */
@@ -11549,47 +11598,58 @@ pont-watermark > [part="watermark"][data-variant="muted"] {
  * ----------------------------------------
  */
 
+/*
+ * Sized by HEIGHT, not as a square.
+ *
+ * The old mark was an 800x800 tile and this rule set width and height to the
+ * same token. The lockup is ~5:1, so keeping that would squash the wordmark
+ * into an unreadable 16px box.
+ */
 pont-watermark [part="watermark-logo"] {
-  width: var(--pont-watermark-logo-space-size);
   height: var(--pont-watermark-logo-space-size);
+  width: auto;
 }
 
-pont-watermark > [part="watermark"] [part="watermark-logo"] > .pontive-logo-rect {
-  fill: var(--pont-watermark-logo-rect-color);
+/* The mark carries the brand colour the old tile did. */
+pont-watermark > [part="watermark"] [part="watermark-logo"] .pontive-logo-mark {
+  fill: var(--pont-watermark-logo-mark-color);
 }
 
 pont-watermark
   > [part="watermark"][data-variant="brand"]
   [part="watermark-logo"]
-  > .pontive-logo-rect {
-  fill: var(--pont-watermark-brand-logo-rect-color);
+  .pontive-logo-mark {
+  fill: var(--pont-watermark-brand-logo-mark-color);
 }
 
 pont-watermark
-  > [part="watermark"][data-variant="brand"]
+  > [part="watermark"][data-variant="theme"]
   [part="watermark-logo"]
-  > .pontive-logo-path {
-  fill: var(--pont-watermark-brand-logo-path-color);
+  .pontive-logo-mark {
+  fill: var(--pont-watermark-theme-logo-mark-color);
 }
 
 pont-watermark
-  > [part="watermark"][data-variant="theme"]
+  > [part="watermark"][data-variant="muted"]
   [part="watermark-logo"]
-  > .pontive-logo-path {
-  fill: var(--pont-watermark-theme-logo-path-color);
+  .pontive-logo-mark {
+  fill: var(--pont-watermark-muted-logo-mark-color);
 }
 
+/*
+ * The wordmark tracks the label. Its default is currentColor, so "Powered by"
+ * and "Pontive" stay one line of text in every variant — including the muted
+ * one, where the root already sets a dimmer colour.
+ */
 pont-watermark
-  > [part="watermark"][data-variant="muted"]
+  > [part="watermark"]
   [part="watermark-logo"]
-  > .pontive-logo-path {
-  fill: var(--pont-watermark-muted-logo-path-color);
+  .pontive-logo-wordmark {
+  fill: var(--pont-watermark-logo-wordmark-color);
 }
-
 pont-paginator pont-input input {
   width: 36px !important;
 }
-
 pont-multi-email-input div[part="input-wrapper"] {
   display: flex;
   flex-wrap: wrap;
@@ -11833,10 +11893,26 @@ pont-multi-select-filter .pont-py-dropdown-menu-label-space-py {
   box-shadow: none !important;
 }
 
-pont-account-settings {
-  --pont-card-radius: var(--pont-account-settings-card-radius);
-}
+/*
+ * No --pont-card-radius override here.
+ *
+ * It used to be pinned to --pont-account-settings-card-radius, a hardcoded
+ * 0.5rem, which took these cards OUT of the brand radius scale: pont-card
+ * normally reads --pont-sem-radius-layout, and that scale derives from the
+ * single --pont-ref-radius that branding-svc's ReferenceTokens.Radius drives.
+ * A project asking for square or extra-round corners got 8px here regardless.
+ */
 
+/*
+ * PAGE mode paints no ground of its own.
+ *
+ * The widget is embedded in the host's page, so a background here is a slab of
+ * Pontive colour dropped into someone else's layout — and it was
+ * bg-surface-secondary, the SAME token pont-card reads, so the four cards came
+ * out exactly their own container's colour in every theme and at every brand.
+ * No brand value could separate them. The cards carry the surface; the host
+ * carries the ground.
+ */
 pont-account-settings[mode="PAGE"] {
   background-color: var(--pont-account-settings-page-color-bg);
 }
@@ -11941,7 +12017,7 @@ pont-profile pont-card[part="personal-info-card"][editing="true"] {
 pont-profile
   pont-card[part="personal-info-card"][editing="true"]
   > [data-slot="card"] {
-  box-shadow: 0 4px 4px -2px hsla(0, 0%, 0%, 0.1);
+  box-shadow: var(--pont-account-settings-edit-card-shadow);
   border: var(--pont-card-width-ring) solid var(--pont-card-color-ring);
 }
 
@@ -11960,7 +12036,7 @@ pont-profile pont-popover[part="account-info-popover"] {
 pont-profile
   pont-card[part="urls-info-card"][editing="true"]
   > [data-slot="card"] {
-  box-shadow: 0 4px 4px -2px hsla(0, 0%, 0%, 0.1);
+  box-shadow: var(--pont-account-settings-edit-card-shadow);
   border: var(--pont-card-width-ring) solid var(--pont-card-color-ring);
 }
 
@@ -11985,7 +12061,7 @@ pont-profile pont-card[part="location-info-card"][editing="true"] {
 pont-profile
   pont-card[part="location-info-card"][editing="true"]
   > [data-slot="card"] {
-  box-shadow: 0 4px 4px -2px hsla(0, 0%, 0%, 0.1);
+  box-shadow: var(--pont-account-settings-edit-card-shadow);
   border: var(--pont-card-width-ring) solid var(--pont-card-color-ring);
 }
 
@@ -11998,14 +12074,32 @@ pont-account-settings div[part="page-content"] {
   background-color: var(--pont-account-settings-page-color-bg);
 }
 
+/*
+ * The modal DOES own its ground — it is a surface floating over a scrim, not
+ * something embedded in a host layout — so it reads its own token rather than
+ * the page one. They used to share --pont-account-settings-page-color-bg,
+ * which is why the page container could not be quietened without also
+ * stripping the modal's background.
+ *
+ * No border declaration: the duplicate of this rule further down set
+ * `border: none`, so the modal border here never applied. Kept the surviving
+ * behaviour, dropped the rule that pretended otherwise.
+ */
 pont-account-settings div[part="page-content-modal"] {
-  background-color: var(--pont-account-settings-page-color-bg);
-  border: var(--pont-modal-width-border) solid var(--pont-modal-color-border);
+  background-color: var(--pont-account-settings-modal-content-color-bg);
+  border: none;
 }
 
+/*
+ * The colour slot held the WIDTH token, so the shorthand read
+ * `1px solid 1px` — invalid, dropped whole, computed `0px none`. The divider
+ * has never rendered, and --pont-account-settings-card-header-color-border
+ * (wired to --pont-sem-color-border) had no consumer, so a brand's border
+ * colour could not reach card headers either.
+ */
 pont-account-settings pont-card-header {
   border-bottom: var(--pont-account-settings-card-header-width-border) solid
-    var(--pont-account-settings-card-header-width-border);
+    var(--pont-account-settings-card-header-color-border);
 }
 
 pont-account-settings {
@@ -12186,10 +12280,19 @@ pont-account-settings .pont-account-settings-display-row-action {
   justify-self: end;
 }
 
+/*
+ * A row, not a grid.
+ *
+ * This declared `grid-template-columns: var(--pont-account-settings-account-display-grid)`
+ * against a token that is defined nowhere, so the value was invalid and the
+ * grid collapsed to one implicit column — the label/value alignment came from
+ * the inner flex row and the label's min-width all along. Saying that outright
+ * beats a grid that only appeared to work.
+ */
 pont-account-settings .pont-account-settings-account-grid {
-  display: grid;
-  grid-template-columns: var(--pont-account-settings-account-display-grid);
+  display: flex;
   align-items: center;
+  width: 100%;
   gap: var(--pont-account-settings-card-input-gap);
 }
 
@@ -12206,13 +12309,29 @@ pont-account-settings .pont-account-settings-account-details {
   flex: 1;
 }
 
+/*
+ * The avatar sits in the value column of its own row now, so it no longer
+ * centres itself (`margin-inline: auto`) or reserves padding for a button
+ * pinned 20px in from an edge it did not know the size of. It is just an
+ * inline-block box the edit button anchors to.
+ */
 pont-account-settings .pont-account-settings-avatar-wrapper {
   position: relative;
-  display: flex;
-  margin-inline: auto;
-  padding-inline: var(--pont-account-settings-avatar-wrapper-space-px);
-  padding-bottom: var(--pont-account-settings-avatar-wrapper-space-pb);
-  margin-block: var(--pont-account-settings-avatar-wrapper-space-my);
+  display: inline-flex;
+  width: -moz-fit-content;
+  width: fit-content;
+}
+
+/*
+ * Anchored to the disc's bottom-right and pulled half onto it, so the offset
+ * holds at any avatar size. The old `bottom-5 right-5` was measured against a
+ * 148px disc and landed off the edge as soon as that changed.
+ */
+pont-account-settings .pont-account-settings-avatar-edit {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  transform: translate(25%, 25%);
 }
 
 pont-account-settings .pont-account-settings-avatar-menu-item {
@@ -12296,19 +12415,12 @@ pont-account-settings .pont-account-settings-avatar-menu-item:last-child {
   margin-bottom: 0;
 }
 
-pont-profile .pont-account-settings-row-layout {
-  display: grid;
-  grid-template-columns: var(--pont-account-settings-form-grid-template);
-  align-items: center;
-  -moz-column-gap: var(--pont-account-settings-card-input-gap);
-       column-gap: var(--pont-account-settings-card-input-gap);
-}
-
-@media (min-width: 768px) {
-  pont-profile .pont-account-settings-row-layout {
-    grid-template-columns: var(--pont-account-settings-form-grid-template-md);
-  }
-}
+/*
+ * .pont-account-settings-row-layout is gone. It set display:grid with a
+ * grid-template-columns token that was never defined, on the same element as
+ * .pont-account-settings-form-body — which sets display:flex and wins on
+ * specificity. Neither half of the rule ever took effect.
+ */
 
 pont-profile .pont-account-settings-column-layout {
   display: flex;
@@ -12365,15 +12477,11 @@ pont-security-settings .pont-account-settings-security-icon {
   height: var(--pont-account-settings-security-icon-size);
 }
 
-pont-account-settings div[part="page-content-modal"] {
-  background-color: var(--pont-account-settings-page-color-bg);
-  border: none;
-}
-
-pont-account-settings pont-card-header {
-  border-bottom: var(--pont-account-settings-card-header-width-border) solid
-    var(--pont-account-settings-card-header-width-border);
-}
+/*
+ * The page-content-modal and pont-card-header rules that used to sit here were
+ * verbatim duplicates of the ones above. Both are declared once now, near the
+ * other container and card rules.
+ */
 
 pont-account-settings .pont-account-settings-link-icon {
   color: var(--pont-account-settings-label-color-text);
@@ -12421,6 +12529,40 @@ pont-account-settings pont-modal {
   --pont-modal-radius: var(--pont-account-settings-modal-radius);
 }
 
+/* ---- loading skeleton ---------------------------------------------------- */
+/*
+ * Mirrors the loaded layout closely enough that nothing jumps when the profile
+ * arrives: a sidebar column of two tab-sized blocks beside three card-sized
+ * ones. Sizes come from the same tokens the real thing uses.
+ */
+pont-account-settings div[part="loading"] {
+  gap: var(--pont-ref-space-4);
+}
+
+pont-account-settings .pont-account-settings-skeleton-sidebar {
+  display: flex;
+  flex-direction: column;
+  gap: var(--pont-account-settings-card-input-gap);
+  width: var(--pont-account-settings-skeleton-sidebar-width);
+  flex-shrink: 0;
+}
+
+pont-account-settings .pont-account-settings-skeleton-tab {
+  height: var(--pont-account-settings-skeleton-tab-height);
+  border-radius: var(--pont-sem-radius-action-sm);
+}
+
+pont-account-settings .pont-account-settings-skeleton-cards {
+  display: flex;
+  flex-direction: column;
+  gap: var(--pont-account-settings-card-content-gap-xl);
+}
+
+pont-account-settings .pont-account-settings-skeleton-card {
+  height: var(--pont-account-settings-skeleton-card-height);
+  border-radius: var(--pont-sem-radius-layout);
+}
+
 /* SideBar */
 pont-profile-sidebar div[part="tab-trigger"]:hover {
   background-color: var(--pont-sidebar-color-bg-hover);
@@ -12652,7 +12794,7 @@ pont-account-info pont-card[part="edit-form"] {
 }
 
 pont-account-info pont-card[part="edit-form"] > [data-slot="card"] {
-  box-shadow: 0 4px 4px -2px hsla(0, 0%, 0%, 0.1);
+  box-shadow: var(--pont-account-settings-edit-card-shadow);
   border: var(--pont-card-width-ring) solid var(--pont-card-color-ring);
 }
 
@@ -12676,7 +12818,7 @@ pont-button[part="upload-image-button"] {
 pont-account-info pont-avatar > [data-slot="avatar"][data-size="lg"] {
   border: var(--pont-account-info-avatar-width-border) solid
     var(--pont-account-info-avatar-color-border);
-  box-shadow: 0 4px 6px -1px hsla(0, 0%, 0%, 0.1);
+  box-shadow: var(--pont-account-info-avatar-shadow);
 }
 
 /* @media (max-width: 768px) {
@@ -12944,19 +13086,19 @@ pont-members-action-modal [part="highlight-name"] {
   color: hsl(var(--pont-sem-color-text-brand));
 }
 
-pont-nav-user pont-dropdown-menu-trigger pont-button[part="trigger-button"] {
-  padding-bottom: var(--pont-nav-user-button-space-py);
-  padding-top: var(--pont-nav-user-button-space-py);
+pont-account-menu pont-dropdown-menu-trigger pont-button[part="trigger-button"] {
+  padding-bottom: var(--pont-account-menu-button-space-py);
+  padding-top: var(--pont-account-menu-button-space-py);
   height: auto !important;
 }
 
-pont-nav-user pont-dropdown-menu-group {
+pont-account-menu pont-dropdown-menu-group {
   --pont-dropdown-menu-label-space-py: var(--pont-ref-space-0);
 }
 
-pont-nav-user pont-dropdown-menu-content {
+pont-account-menu pont-dropdown-menu-content {
   --pont-dropdown-menu-content-space-p: var(
-    --pont-nav-user-dropdown-menu-content-space-p
+    --pont-account-menu-dropdown-menu-content-space-p
   );
 }
 
@@ -13553,9 +13695,6 @@ video {
 .pont-bottom-0{
   bottom: 0px;
 }
-.pont-bottom-5{
-  bottom: 1.25rem;
-}
 .pont-left-1\/2{
   left: 50%;
 }
@@ -13622,9 +13761,6 @@ video {
 .pont-row-span-3{
   grid-row: span 3 / span 3;
 }
-.pont-m-2{
-  margin: 0.5rem;
-}
 .pont-m-auto{
   margin: auto;
 }

package/dist/types/core/index.d.ts

@@ -22,7 +22,7 @@ export interface EnvConfig {
     /**
      * Language for the sign-in UI: space-separated BCP-47 tags in descending
      * preference, e.g. `"de-DE fr-FR"`. Omit to let the server negotiate from the
-     * browser's `Accept-Language` and then the project's default locale.
+     * browser's `Accept-Language` and then the instance's default locale.
      */
     locales?: string;
     /**
@@ -31,11 +31,4 @@ export interface EnvConfig {
      * `/mgmt/v1` prefix itself.
      */
     apiBaseUrl: string;
-    /**
-     * @deprecated Not read by the SDK. The project is carried by the access
-     * token's issuer, so nothing here needs to name it. Kept optional so
-     * consumers built against earlier typings still compile; remove when the
-     * framework packages are rebuilt from this core.
-     */
-    projectId?: string;
 }

package/dist/types/service/http/member/index.d.ts

@@ -15,7 +15,7 @@ export interface Member {
     organization_id: string;
     organization_name: string;
     organization_slug: string;
-    project_id: string;
+    instance_id: string;
     roles: {
         key: string;
         name: string;

package/dist/types/service/http/user/index.d.ts

@@ -19,7 +19,7 @@ export interface User {
     picture?: string;
     private_metadata?: Record<string, unknown>;
     profile?: string;
-    project_id?: string;
+    instance_id?: string;
     status?: string;
     updated_at?: number;
     username?: string;

package/dist/utils/format.d.ts

@@ -37,4 +37,16 @@ export declare const formatDate: (dateString: string | number) => {
  * @returns Human-readable relative time string
  */
 export declare function formatRelativeTime(timestamp: number): string;
+/**
+ * Up to two initials for an avatar fallback.
+ *
+ * First letter of the first and last word, so "Mehdi Soltany" is MS. This used
+ * to be `slice(0, 2)`, which took the first two letters of whatever it was
+ * handed: "ME" for that name, and for an email the first two letters of the
+ * local part, so colleagues with similar addresses all collided.
+ *
+ * An email is reduced to its local part first — the domain is shared by every
+ * colleague and says nothing about who this is.
+ */
 export declare function getInitials(str?: string): string;
+export declare function errorMessage(error: unknown, fallback: string): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pontive/pontkit-core",
-  "version": "1.1.3",
+  "version": "1.2.0",
   "license": "MIT",
   "description": "A collection of core components for Pontive",
   "main": "dist/index.js",
@@ -27,7 +27,7 @@
     "stamp:catalog": "node scripts/stamp-catalog.mjs",
     "check:catalog": "node scripts/check-catalog.mjs",
     "integrity": "node scripts/integrity.mjs",
-    "prepublishOnly": "node scripts/guard-publish.mjs && npm run check:names && npm run check:catalog && npm run stamp:catalog",
+    "prepublishOnly": "node scripts/guard-publish.mjs && npm run check:names && npm run check:catalog && npm run build && npm run stamp:catalog",
     "preview": "vite preview",
     "test": "vitest run",
     "lint": "eslint 'src/**/*.{ts,tsx}' --fix",

package/dist/components/widgets/pont-nav-user/index.d.ts

@@ -1 +0,0 @@
-export * from './pont-nav-user';