npm - @biffo/cli - Versions diffs - 0.428.0 → 0.429.0 - Mend

@biffo/cli 0.428.0 → 0.429.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.

Files changed (5) hide show

package/_skeletons/plugin-template/web-admin/package.json CHANGED Viewed

@@ -11,7 +11,7 @@
     "test": "vitest run"
   },
   "dependencies": {
-    "@biffo/design-tokens": "^0.152.0",
+    "@biffo/design-tokens": "^0.427.0",
     "amazon-cognito-identity-js": "^6.3.12",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"

package/_skeletons/plugin-template/web-admin/pnpm-lock.yaml CHANGED Viewed

@@ -16,8 +16,8 @@ importers:
   .:
     dependencies:
       '@biffo/design-tokens':
-        specifier: ^0.152.0
-        version: 0.152.0
+        specifier: ^0.427.0
+        version: 0.427.0
       amazon-cognito-identity-js:
         specifier: ^6.3.12
         version: 6.3.20
@@ -184,8 +184,9 @@ packages:
     resolution: {integrity: sha512-Vj1jF3cPfxg7OAfoI7QnVKLoILlm2JF9pnVHrX8qx7AHMiYWT+NDAA7jChlNgRS4WTLc/fD1lXLmPixluj+3Gg==}
     engines: {node: '>=6.9.0'}
-  '@biffo/design-tokens@0.152.0':
-    resolution: {integrity: sha512-GzlSKRqrvVudPuZGO0N/Ge/LcSjXD8+cXAlc/ge6wJHv9a0YOFtG6T21r3UnxJiGD5frwWGv2OSxZBCZ0M1l4w==}
+  '@biffo/design-tokens@0.427.0':
+    resolution: {integrity: sha512-3OjpF0hYAlg3k7ez/25LrkDVz+wgpx1mwaRhVkAtG0XEj0cfNhJ3In9Nk5XCh3JBy7HaIYn9tuILmXmIDYIS6w==}
+    hasBin: true
   '@bramus/specificity@2.4.2':
     resolution: {integrity: sha512-ctxtJ/eA+t+6q2++vj5j7FYX3nRu311q1wfYH3xjlLOsczhlhxAg2FWNUXhpGvAw3BWo1xBcvOV6/YLc2r5FJw==}
@@ -1711,7 +1712,7 @@ snapshots:
       '@babel/helper-string-parser': 7.29.7
       '@babel/helper-validator-identifier': 7.29.7
-  '@biffo/design-tokens@0.152.0': {}
+  '@biffo/design-tokens@0.427.0': {}
   '@bramus/specificity@2.4.2':
     dependencies:

package/_skeletons/plugin-template/web-admin/src/App.tsx CHANGED Viewed

@@ -1,11 +1,16 @@
 import { useEffect, useState } from 'react'
+import { statusBadgeClass, statusLabel } from '@biffo/design-tokens/status.mjs'
 import { getCurrentSession } from './lib/auth'
 /**
  * Starter admin surface. It proves the SHARED-SESSION INVARIANT works — reads
- * the portal's Cognito session, shows a signed-in/signed-out state, nothing
- * more — and is meant to be replaced with this plugin's own admin UI.
+ * the portal's Cognito session, shows a signed-in/signed-out state — and shows
+ * the shared kit's controls (heading, primary button, status badge, delete with
+ * an in-page confirm). Replace the sample row with this plugin's own admin UI.
+ *
+ * Style with the kit's `biffo-*` classes (see @biffo/design-tokens/kit.css),
+ * never `window.confirm` and never local colour/font overrides.
  *
  * Wire real screens against `./lib/api`'s starter `request()` helper, which
  * already carries the `Authorization: Bearer` header and error handling this
@@ -13,6 +18,8 @@ import { getCurrentSession } from './lib/auth'
  */
 export default function App() {
   const [signedIn, setSignedIn] = useState<boolean | null>(null)
+  const [confirming, setConfirming] = useState(false)
+  const [deleted, setDeleted] = useState(false)
   useEffect(() => {
     let cancelled = false
@@ -27,23 +34,67 @@ export default function App() {
   if (signedIn === false) {
     return (
-      <main className="page">
-        <h1>example-plugin — Admin</h1>
-        <p className="error">Not signed in. Open this from the Biffo portal.</p>
+      <main className="biffo-kit layout">
+        <h1 className="biffo-heading">example-plugin — Admin</h1>
+        <p role="alert" className="biffo-badge biffo-badge--negative">
+          Not signed in. Open this from the Biffo portal.
+        </p>
       </main>
     )
   }
   return (
-    <main className="page">
-      <h1>example-plugin — Admin</h1>
+    <main className="biffo-kit layout">
+      <h1 className="biffo-heading">example-plugin — Admin</h1>
       {signedIn === null ? (
-        <p className="muted">Loading…</p>
+        <p>Loading…</p>
       ) : (
-        <p className="muted">
-          Signed in via the shared portal session. Replace this screen with the plugin's own admin
-          UI.
-        </p>
+        <>
+          <p>
+            Signed in via the shared portal session. Replace this screen with the plugin's own admin
+            UI.
+          </p>
+          {deleted ? (
+            <p>Sample item deleted.</p>
+          ) : (
+            <div className="row">
+              <span>Sample item</span>
+              <span className={statusBadgeClass('active')}>{statusLabel('active')}</span>
+              <button type="button" className="biffo-btn-primary">
+                Edit
+              </button>
+              {confirming ? (
+                <span className="biffo-confirm">
+                  <span className="biffo-confirm__prompt">
+                    Delete this item? This action cannot be undone.
+                  </span>
+                  <button
+                    type="button"
+                    className="biffo-btn-delete biffo-confirm__yes"
+                    onClick={() => setDeleted(true)}
+                  >
+                    Delete
+                  </button>
+                  <button
+                    type="button"
+                    className="biffo-confirm__no"
+                    onClick={() => setConfirming(false)}
+                  >
+                    Cancel
+                  </button>
+                </span>
+              ) : (
+                <button
+                  type="button"
+                  className="biffo-btn-delete"
+                  onClick={() => setConfirming(true)}
+                >
+                  Delete
+                </button>
+              )}
+            </div>
+          )}
+        </>
       )}
     </main>
   )

package/_skeletons/plugin-template/web-admin/src/index.css CHANGED Viewed

@@ -1,7 +1,9 @@
-/* Shares the design tokens the rest of the estate uses so a plugin admin panel
-   does not become its own brand blue (the drift @biffo/design-tokens was
-   created to end). */
+/* Look comes from the shared kit (#2495): headings, buttons, delete, status
+   badges and the in-page confirm are the kit's classes. Do not add local
+   colour, font, heading or button overrides here; change the kit instead.
+   tokens.css must load before kit.css. */
 @import '@biffo/design-tokens/tokens.css';
+@import '@biffo/design-tokens/kit.css';
 * {
   box-sizing: border-box;
@@ -9,32 +11,23 @@
 body {
   margin: 0;
-  font-family: var(--font-sans, system-ui, sans-serif);
-  color: var(--text, #1b1c1f);
-  background: var(--bg, #f7f8fa);
 }
-.page {
-  max-width: 60rem;
-  margin: 0 auto;
+/* Layout only. */
+.layout {
+  min-height: 100vh;
   padding: 2rem 1.5rem 4rem;
 }
-h1 {
-  font-size: 1.55rem;
-  margin: 0 0 0.35rem;
+.layout > * {
+  max-width: 80rem;
+  margin-left: auto;
+  margin-right: auto;
 }
-.muted {
-  color: var(--text-muted, #5b6070);
-  font-size: 0.9rem;
-  margin: 0 0 1.25rem;
-}
-.error {
-  background: var(--state-negative-soft, #fdeaea);
-  color: var(--state-negative, #8c2b2b);
-  padding: 0.6rem 0.8rem;
-  border-radius: 6px;
-  font-size: 0.9rem;
+.row {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  margin: 0.75rem auto;
 }

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@biffo/cli",
-  "version": "0.428.0",
+  "version": "0.429.0",
   "description": "Biffo project scaffolding CLI",
   "license": "MIT",
   "type": "module",