studio-engine 0.132.0 → 0.133.0

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: studio-engine
 version: !ruby/object:Gem::Version
-  version: 0.132.0
+  version: 0.133.0
 platform: ruby
 authors:
 - Alex McRitchie
@@ -543,6 +543,7 @@ files:
 - app/javascript/studio/host_fetchers.js
 - app/javascript/studio/identity_mini.js
 - app/javascript/studio/image_upload.js
+- app/javascript/studio/in_page_links.js
 - app/javascript/studio/infinite_scroll.js
 - app/javascript/studio/knowledge_transcript.js
 - app/javascript/studio/lazy_controllers.js
@@ -671,6 +672,9 @@ files:
 - app/views/studio/agent_chat/_turn.html.erb
 - app/views/studio/agent_chat/_typing.html.erb
 - app/views/studio/agent_chat/_voice.html.erb
+- app/views/studio/auth/_sign_in_body.html.erb
+- app/views/studio/auth/_sign_in_card.html.erb
+- app/views/studio/auth/_sign_in_modal.html.erb
 - app/views/studio/banners/_app_banner.html.erb
 - app/views/studio/banners/_button.html.erb
 - app/views/studio/banners/_dev_mode_button.html.erb
@@ -818,6 +822,7 @@ files:
 - app/views/style/_specimen.html.erb
 - app/views/style/_tasks.html.erb
 - app/views/style/_theme.html.erb
+- app/views/style/_trick_label.html.erb
 - app/views/style/_tricks.html.erb
 - app/views/style/_type_ladder.html.erb
 - app/views/style/board/_demo_card.html.erb
@@ -826,9 +831,7 @@ files:
 - app/views/style/modals/_age_gate.html.erb
 - app/views/style/modals/_birthday.html.erb
 - app/views/style/modals/_ds_close_x.html.erb
-- app/views/style/modals/_ds_email_field.html.erb
 - app/views/style/modals/_ds_rail_row.html.erb
-- app/views/style/modals/_ds_resend_footer.html.erb
 - app/views/style/modals/_ds_stack_demo.html.erb
 - app/views/style/modals/_email_change_pending.html.erb
 - app/views/style/modals/_it_begins.html.erb
@@ -840,6 +843,7 @@ files:
 - app/views/user_mailer/magic_link.html.erb
 - app/views/user_mailer/magic_link.text.erb
 - config/importmap.rb
+- config/studio_tricks.yml
 - db/migrate/20260614000000_create_studio_email_deliveries.rb
 - db/migrate/20260620000001_create_studio_links.rb
 - db/migrate/20260620000002_allow_null_image_cache_owner.rb
@@ -944,6 +948,7 @@ files:
 - lib/studio/node_tooling/playwright_base.js
 - lib/studio/node_tooling/versions.json
 - lib/studio/oauth_identity.rb
+- lib/studio/page_header.rb
 - lib/studio/partial_block.rb
 - lib/studio/profile_image.rb
 - lib/studio/profile_sections.rb
@@ -963,6 +968,7 @@ files:
 - lib/studio/survey/export.rb
 - lib/studio/tailwind_entry.rb
 - lib/studio/theme_resolver.rb
+- lib/studio/tricks.rb
 - lib/studio/type_scale.rb
 - lib/studio/ui_primitives.rb
 - lib/studio/username_generator.rb

data/app/views/style/modals/_ds_email_field.html.erb

@@ -1,58 +0,0 @@
-<%#
-  Living style guide specimen — the modal family's email input,
-  studio/modals/shared/_email_field.
-
-  THIS IS A BLOCK DEMO, NOT A CARD. The engine does not own an auth MODAL — the
-  sign-in card is each app's, mounted on that app's own host and reviewed on that
-  app's own section of this guide. What the engine owns is the PIECES that card
-  is built from, and this is the one every app's auth card renders. It had no
-  specimen of its own until 2026-09-09 because style/modals/_auth, a mirror of
-  turf-monster's card, happened to render it — so retiring the mirror is what
-  made the gap visible.
-
-  BOTH FACES ARE SHOWN because `validator` is a real fork, not a flag. Off, the
-  partial is self-contained and the SERVER stays the only boundary; on, it wraps
-  itself in x-data="emailValidator()" and paints a right-edge spinner / check / X
-  that only works if the CONSUMER ships that factory. An app that passes
-  validator: true without the factory gets an Alpine scope error and a dead
-  indicator, so the two are drawn side by side to make the dependency legible.
-  This page ships no emailValidator, which is why the right-hand field's
-  indicator stays blank — that is the demo, not a defect.
-
-  Single root: the outer <div> is the host's required root.
-%>
-<div class="relative">
-  <%= render "studio/modals/blocks/close_x", modal_store: "dsModals" %>
-
-  <div class="text-center pt-1 mb-4">
-    <h3 class="text-heading font-bold text-lg leading-tight">Email field</h3>
-    <p class="text-xs text-muted mt-1">studio/modals/shared/_email_field</p>
-  </div>
-
-  <div class="space-y-4" x-data="{ email: '' }">
-    <div>
-      <p class="text-2xs font-bold text-secondary uppercase tracking-wide mb-1.5">Plain</p>
-      <%= render "studio/modals/shared/email_field",
-            name: nil, x_model: "email", required: true %>
-      <p class="text-2xs text-muted mt-1.5">
-        No dependency beyond the theme. <code class="font-mono">x_model</code>
-        resolves in the ENCLOSING scope, so the value lands on the host component
-        rather than on the field.
-      </p>
-    </div>
-
-    <div>
-      <p class="text-2xs font-bold text-secondary uppercase tracking-wide mb-1.5">With validator</p>
-      <%= render "studio/modals/shared/email_field",
-            name: nil, x_model: "email", required: true, validator: true %>
-      <p class="text-2xs text-muted mt-1.5">
-        Adds <code class="font-mono">x-data="emailValidator()"</code> and the
-        right-edge indicator. <strong>The factory is the consumer&rsquo;s to
-        ship</strong> &mdash; this guide does not, so the indicator stays blank here.
-      </p>
-    </div>
-  </div>
-
-  <button type="button" @click="$store.dsModals.close()"
-          class="btn btn-primary btn-lg w-full mt-5">Done</button>
-</div>

data/app/views/style/modals/_ds_resend_footer.html.erb

@@ -1,70 +0,0 @@
-<%#
-  Living style guide specimen — the magic-link resend footer,
-  studio/modals/auth/_resend_footer.
-
-  A BLOCK DEMO, for the same reason as _ds_email_field: the engine owns this
-  fragment, not the auth card that renders it. Both of the auth card's
-  link-sent steps render it, and they are identical — which is the whole reason
-  it was extracted.
-
-  IT NEEDS A HOST, AND THAT IS THE POINT. The footer reads props.submitting,
-  props.resendCooldown and props.resendError, and calls resendMagicLink(), all
-  resolved from the ENCLOSING x-data — never from a store. So the x-data below
-  is a stand-in for the auth card's own component, and it is the contract this
-  specimen documents: drop this partial into a scope that supplies none of those
-  and nothing errors, the link simply never enables and the cooldown never
-  counts. The stub here drives a real 5s cooldown so all three states are
-  reachable: idle, in-flight, counting down.
-
-  THE COOLDOWN IS SHORTENED ON PURPOSE. Production counts 60s; a reviewer will
-  not wait 60s to watch a number tick, and a specimen nobody watches documents
-  nothing. The partial does not own the duration — the host does.
-
-  Single root: the outer <div> is the host's required root.
-%>
-<div class="relative"
-     x-data="{
-       props: { submitting: null, resendCooldown: 0, resendError: '' },
-       _timer: null,
-       resendMagicLink() {
-         if (this.props.submitting || this.props.resendCooldown > 0) return;
-         this.props.resendError = '';
-         this.props.submitting = 'magic-link';
-         setTimeout(() => {
-           this.props.submitting = null;
-           this.props.resendCooldown = 5;
-           this._timer = setInterval(() => {
-             this.props.resendCooldown -= 1;
-             if (this.props.resendCooldown <= 0) clearInterval(this._timer);
-           }, 1000);
-         }, 900);
-       },
-       fail() {
-         this.props.submitting = null;
-         this.props.resendCooldown = 0;
-         this.props.resendError = 'That link could not be sent. Try again in a moment.';
-       },
-       // Alpine calls destroy() when the component leaves the DOM. Without it the
-       // interval outlives the closed card and keeps decrementing a dead object.
-       destroy() { clearInterval(this._timer); }
-     }">
-  <%= render "studio/modals/blocks/close_x", modal_store: "dsModals" %>
-
-  <div class="text-center pt-1 mb-4">
-    <div class="text-2xl leading-none mb-2">📬</div>
-    <h3 class="text-heading font-bold text-lg leading-tight">Check your email</h3>
-    <p class="text-xs text-body mt-1">
-      The footer below is the shared piece &mdash; everything above it belongs to
-      the app&rsquo;s own card.
-    </p>
-  </div>
-
-  <div class="border-t border-subtle pt-4">
-    <%= render "studio/modals/auth/resend_footer", modal_store: "dsModals" %>
-  </div>
-
-  <button type="button" @click="fail()"
-          class="block mx-auto mt-4 text-2xs text-muted hover:text-secondary underline underline-offset-2">
-    Show the error line
-  </button>
-</div>