@happyvertical/smrt-content 0.34.6 → 0.34.7

package/dist/svelte/components/ContentContributionTypeManager.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+import { Form, Input, Select, Textarea } from '@happyvertical/smrt-ui/forms';
 import { useI18n } from '@happyvertical/smrt-ui/i18n';
 import { Button } from '@happyvertical/smrt-ui/ui';
 import type { ContentContributionTypeData } from '../../mock-smrt-client';
@@ -138,103 +139,128 @@ function handleSubmit() {
       {/each}
     </div>
 
-    <form
-      class="editor"
-      onsubmit={(event) => {
-        event.preventDefault();
-        handleSubmit();
-      }}
-    >
-      <label>
-        Key
-        <input type="text" bind:value={draft.key} required />
-      </label>
-      <label>
-        Label
-        <input type="text" bind:value={draft.label} required />
-      </label>
+    <div class="editor-shell">
+      <Form
+        class="editor"
+        onsubmit={(event) => {
+          event.preventDefault();
+          handleSubmit();
+        }}
+      >
+        <label>
+          Key
+          <Input type="text" bind:value={draft.key} required />
+        </label>
+        <label>
+          Label
+          <Input type="text" bind:value={draft.label} required />
+        </label>
+
+        <div class="checkbox-grid">
+          <label>
+            <!-- raw-primitive-allow: native checkbox; no Provider-free checkbox primitive (Toggle is a switch with different semantics, CheckboxInput requires a Provider) -->
+            <input type="checkbox" bind:checked={draft.enabled} /> Enabled
+          </label>
+          <label>
+            <!-- raw-primitive-allow: native checkbox; no Provider-free checkbox primitive (Toggle is a switch with different semantics, CheckboxInput requires a Provider) -->
+            <input type="checkbox" bind:checked={draft.allowText} /> {t(M['content.contribution_type_manager.allow_text'])}
+          </label>
+          <label>
+            <!-- raw-primitive-allow: native checkbox; no Provider-free checkbox primitive (Toggle is a switch with different semantics, CheckboxInput requires a Provider) -->
+            <input type="checkbox" bind:checked={draft.allowFiles} /> {t(M['content.contribution_type_manager.allow_files'])}
+          </label>
+          <label>
+            <!-- raw-primitive-allow: native checkbox; no Provider-free checkbox primitive (Toggle is a switch with different semantics, CheckboxInput requires a Provider) -->
+            <input type="checkbox" bind:checked={draft.allowEmptyText} /> {t(M['content.contribution_type_manager.allow_empty_text'])}
+          </label>
+        </div>
 
-      <div class="checkbox-grid">
-        <label><input type="checkbox" bind:checked={draft.enabled} /> Enabled</label>
-        <label><input type="checkbox" bind:checked={draft.allowText} /> {t(M['content.contribution_type_manager.allow_text'])}</label>
-        <label><input type="checkbox" bind:checked={draft.allowFiles} /> {t(M['content.contribution_type_manager.allow_files'])}</label>
-        <label><input type="checkbox" bind:checked={draft.allowEmptyText} /> {t(M['content.contribution_type_manager.allow_empty_text'])}</label>
-      </div>
+        <div class="checkbox-grid">
+          <label>
+            <!-- raw-primitive-allow: native checkbox; no Provider-free checkbox primitive (Toggle is a switch with different semantics, CheckboxInput requires a Provider) -->
+            <input
+              type="checkbox"
+              checked={draft.allowedChannels.includes('web')}
+              onchange={() => toggleChannel('web')}
+            />
+            Web
+          </label>
+          <label>
+            <!-- raw-primitive-allow: native checkbox; no Provider-free checkbox primitive (Toggle is a switch with different semantics, CheckboxInput requires a Provider) -->
+            <input
+              type="checkbox"
+              checked={draft.allowedChannels.includes('email')}
+              onchange={() => toggleChannel('email')}
+            />
+            Email
+          </label>
+        </div>
 
-      <div class="checkbox-grid">
         <label>
-          <input
-            type="checkbox"
-            checked={draft.allowedChannels.includes('web')}
-            onchange={() => toggleChannel('web')}
-          />
-          Web
+          {t(M['content.contribution_type_manager.promotion_content_type'])}
+          <Input type="text" bind:value={draft.promotion.targetContentType} required />
         </label>
         <label>
-          <input
-            type="checkbox"
-            checked={draft.allowedChannels.includes('email')}
-            onchange={() => toggleChannel('email')}
-          />
-          Email
+          {t(M['content.contribution_type_manager.promotion_variant'])}
+          <Input type="text" bind:value={draft.promotion.targetContentVariant} />
+        </label>
+        <label>
+          {t(M['content.contribution_type_manager.promotion_status'])}
+          <Select bind:value={draft.promotion.targetContentStatus}>
+            <option value="draft">draft</option>
+            <option value="review">review</option>
+          </Select>
         </label>
-      </div>
-
-      <label>
-        {t(M['content.contribution_type_manager.promotion_content_type'])}
-        <input type="text" bind:value={draft.promotion.targetContentType} required />
-      </label>
-      <label>
-        {t(M['content.contribution_type_manager.promotion_variant'])}
-        <input type="text" bind:value={draft.promotion.targetContentVariant} />
-      </label>
-      <label>
-        {t(M['content.contribution_type_manager.promotion_status'])}
-        <select bind:value={draft.promotion.targetContentStatus}>
-          <option value="draft">draft</option>
-          <option value="review">review</option>
-        </select>
-      </label>
 
-      <div class="checkbox-grid">
-        <label><input type="checkbox" bind:checked={draft.promotion.autoPromoteTrusted} /> {t(M['content.contribution_type_manager.auto_promote_trusted'])}</label>
-        <label><input type="checkbox" bind:checked={draft.promotion.createAssets} /> {t(M['content.contribution_type_manager.create_assets_on_promotion'])}</label>
-        <label><input type="checkbox" bind:checked={draft.intakeRules.trustedOnly} /> {t(M['content.contribution_type_manager.trusted_contributors_only'])}</label>
-      </div>
+        <div class="checkbox-grid">
+          <label>
+            <!-- raw-primitive-allow: native checkbox; no Provider-free checkbox primitive (Toggle is a switch with different semantics, CheckboxInput requires a Provider) -->
+            <input type="checkbox" bind:checked={draft.promotion.autoPromoteTrusted} /> {t(M['content.contribution_type_manager.auto_promote_trusted'])}
+          </label>
+          <label>
+            <!-- raw-primitive-allow: native checkbox; no Provider-free checkbox primitive (Toggle is a switch with different semantics, CheckboxInput requires a Provider) -->
+            <input type="checkbox" bind:checked={draft.promotion.createAssets} /> {t(M['content.contribution_type_manager.create_assets_on_promotion'])}
+          </label>
+          <label>
+            <!-- raw-primitive-allow: native checkbox; no Provider-free checkbox primitive (Toggle is a switch with different semantics, CheckboxInput requires a Provider) -->
+            <input type="checkbox" bind:checked={draft.intakeRules.trustedOnly} /> {t(M['content.contribution_type_manager.trusted_contributors_only'])}
+          </label>
+        </div>
 
-      <label>
-        {t(M['content.contribution_type_manager.max_files'])}
-        <input type="number" min="0" bind:value={draft.intakeRules.maxFiles} />
-      </label>
-      <label>
-        {t(M['content.contribution_type_manager.max_total_bytes'])}
-        <input type="number" min="0" bind:value={draft.intakeRules.maxTotalBytes} />
-      </label>
-      <label>
-        {t(M['content.contribution_type_manager.allowed_mime_patterns'])}
-        <input type="text" bind:value={draft.intakeRules.allowedMimePatterns} placeholder={t(M['content.contribution_type_manager.allowed_mime_patterns_placeholder'])} />
-      </label>
-      <label>
-        {t(M['content.contribution_type_manager.blocked_mime_patterns'])}
-        <input type="text" bind:value={draft.intakeRules.blockedMimePatterns} />
-      </label>
-      <label>
-        {t(M['content.contribution_type_manager.quarantine_mime_patterns'])}
-        <input type="text" bind:value={draft.intakeRules.quarantineMimePatterns} />
-      </label>
-      <label>
-        {t(M['content.contribution_type_manager.blocked_text_patterns'])}
-        <textarea bind:value={draft.intakeRules.blockedTextPatterns} rows="2"></textarea>
-      </label>
-      <label>
-        {t(M['content.contribution_type_manager.quarantine_text_patterns'])}
-        <textarea bind:value={draft.intakeRules.quarantineTextPatterns} rows="2"></textarea>
-      </label>
+        <label>
+          {t(M['content.contribution_type_manager.max_files'])}
+          <Input type="number" min="0" bind:value={draft.intakeRules.maxFiles} />
+        </label>
+        <label>
+          {t(M['content.contribution_type_manager.max_total_bytes'])}
+          <Input type="number" min="0" bind:value={draft.intakeRules.maxTotalBytes} />
+        </label>
+        <label>
+          {t(M['content.contribution_type_manager.allowed_mime_patterns'])}
+          <Input type="text" bind:value={draft.intakeRules.allowedMimePatterns} placeholder={t(M['content.contribution_type_manager.allowed_mime_patterns_placeholder'])} />
+        </label>
+        <label>
+          {t(M['content.contribution_type_manager.blocked_mime_patterns'])}
+          <Input type="text" bind:value={draft.intakeRules.blockedMimePatterns} />
+        </label>
+        <label>
+          {t(M['content.contribution_type_manager.quarantine_mime_patterns'])}
+          <Input type="text" bind:value={draft.intakeRules.quarantineMimePatterns} />
+        </label>
+        <label>
+          {t(M['content.contribution_type_manager.blocked_text_patterns'])}
+          <Textarea bind:value={draft.intakeRules.blockedTextPatterns} rows={2}></Textarea>
+        </label>
+        <label>
+          {t(M['content.contribution_type_manager.quarantine_text_patterns'])}
+          <Textarea bind:value={draft.intakeRules.quarantineTextPatterns} rows={2}></Textarea>
+        </label>
 
-      <div class="actions">
-        <Button variant="primary" type="submit">{t(M['content.contribution_type_manager.save_type'])}</Button>
-      </div>
-    </form>
+        <div class="actions">
+          <Button variant="primary" type="submit">{t(M['content.contribution_type_manager.save_type'])}</Button>
+        </div>
+      </Form>
+    </div>
   </div>
 </section>
 
@@ -242,7 +268,7 @@ function handleSubmit() {
   .manager,
   .layout,
   .list,
-  .editor {
+  .editor-shell :global(.editor) {
     display: grid;
     gap: 1rem;
   }
@@ -252,7 +278,7 @@ function handleSubmit() {
   }
 
   .card,
-  .editor {
+  .editor-shell :global(.editor) {
     border: 1px solid var(--smrt-color-outline-variant);
     border-radius: 0.75rem;
     padding: 0.9rem;
@@ -269,7 +295,7 @@ function handleSubmit() {
     flex-wrap: wrap;
   }
 
-  .editor label {
+  .editor-shell label {
     display: grid;
     gap: 0.35rem;
   }

package/dist/svelte/components/ContentContributionTypeManager.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContentContributionTypeManager.svelte.d.ts","sourceRoot":"","sources":["../../../src/svelte/components/ContentContributionTypeManager.svelte.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,wBAAwB,CAAC;AAI1E,MAAM,WAAW,KAAK;IACpB,KAAK,CAAC,EAAE,2BAA2B,EAAE,CAAC;IACtC,MAAM,EAAE,CAAC,IAAI,EAAE,OAAO,CAAC,2BAA2B,CAAC,KAAK,IAAI,CAAC;IAC7D,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,2BAA2B,KAAK,IAAI,CAAC;CACxD;AAqOD,QAAA,MAAM,8BAA8B,2CAAwC,CAAC;AAC7E,KAAK,8BAA8B,GAAG,UAAU,CAAC,OAAO,8BAA8B,CAAC,CAAC;AACxF,eAAe,8BAA8B,CAAC"}
+{"version":3,"file":"ContentContributionTypeManager.svelte.d.ts","sourceRoot":"","sources":["../../../src/svelte/components/ContentContributionTypeManager.svelte.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,wBAAwB,CAAC;AAI1E,MAAM,WAAW,KAAK;IACpB,KAAK,CAAC,EAAE,2BAA2B,EAAE,CAAC;IACtC,MAAM,EAAE,CAAC,IAAI,EAAE,OAAO,CAAC,2BAA2B,CAAC,KAAK,IAAI,CAAC;IAC7D,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,2BAA2B,KAAK,IAAI,CAAC;CACxD;AA+PD,QAAA,MAAM,8BAA8B,2CAAwC,CAAC;AAC7E,KAAK,8BAA8B,GAAG,UAAU,CAAC,OAAO,8BAA8B,CAAC,CAAC;AACxF,eAAe,8BAA8B,CAAC"}

package/dist/svelte/components/ContentContributorManager.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+import { Form, Input, Select } from '@happyvertical/smrt-ui/forms';
 import { useI18n } from '@happyvertical/smrt-ui/i18n';
 import { Button } from '@happyvertical/smrt-ui/ui';
 import type { ContentContributorData } from '../../mock-smrt-client';
@@ -67,34 +68,36 @@ function handleSubmit() {
       {/each}
     </div>
 
-    <form
-      class="editor"
-      onsubmit={(event) => {
-        event.preventDefault();
-        handleSubmit();
-      }}
-    >
-      <label>
-        Email
-        <input type="email" bind:value={draft.email} required />
-      </label>
-      <label>
-        Name
-        <input type="text" bind:value={draft.name} />
-      </label>
-      <label>
-        {t(M['content.contributor_manager.trust_level'])}
-        <select bind:value={draft.trustLevel}>
-          <option value="standard">standard</option>
-          <option value="trusted">trusted</option>
-          <option value="blocked">blocked</option>
-        </select>
-      </label>
-
-      <div class="actions">
-        <Button variant="primary" type="submit">{t(M['content.contributor_manager.save_contributor'])}</Button>
-      </div>
-    </form>
+    <div class="editor-shell">
+      <Form
+        class="editor"
+        onsubmit={(event) => {
+          event.preventDefault();
+          handleSubmit();
+        }}
+      >
+        <label>
+          Email
+          <Input type="email" bind:value={draft.email} required />
+        </label>
+        <label>
+          Name
+          <Input type="text" bind:value={draft.name} />
+        </label>
+        <label>
+          {t(M['content.contributor_manager.trust_level'])}
+          <Select bind:value={draft.trustLevel}>
+            <option value="standard">standard</option>
+            <option value="trusted">trusted</option>
+            <option value="blocked">blocked</option>
+          </Select>
+        </label>
+
+        <div class="actions">
+          <Button variant="primary" type="submit">{t(M['content.contributor_manager.save_contributor'])}</Button>
+        </div>
+      </Form>
+    </div>
   </div>
 </section>
 
@@ -102,7 +105,7 @@ function handleSubmit() {
   .manager,
   .layout,
   .list,
-  .editor {
+  .editor-shell :global(.editor) {
     display: grid;
     gap: 1rem;
   }
@@ -112,7 +115,7 @@ function handleSubmit() {
   }
 
   .card,
-  .editor {
+  .editor-shell :global(.editor) {
     border: 1px solid var(--smrt-color-outline-variant);
     border-radius: 0.75rem;
     padding: 0.9rem;
@@ -128,7 +131,7 @@ function handleSubmit() {
     flex-wrap: wrap;
   }
 
-  .editor label {
+  .editor-shell label {
     display: grid;
     gap: 0.35rem;
   }

package/dist/svelte/components/ContentContributorManager.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContentContributorManager.svelte.d.ts","sourceRoot":"","sources":["../../../src/svelte/components/ContentContributorManager.svelte.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAIrE,MAAM,WAAW,KAAK;IACpB,YAAY,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACxC,MAAM,EAAE,CAAC,WAAW,EAAE,OAAO,CAAC,sBAAsB,CAAC,KAAK,IAAI,CAAC;IAC/D,QAAQ,CAAC,EAAE,CAAC,WAAW,EAAE,sBAAsB,KAAK,IAAI,CAAC;CAC1D;AAiGD,QAAA,MAAM,yBAAyB,2CAAwC,CAAC;AACxE,KAAK,yBAAyB,GAAG,UAAU,CAAC,OAAO,yBAAyB,CAAC,CAAC;AAC9E,eAAe,yBAAyB,CAAC"}
+{"version":3,"file":"ContentContributorManager.svelte.d.ts","sourceRoot":"","sources":["../../../src/svelte/components/ContentContributorManager.svelte.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAIrE,MAAM,WAAW,KAAK;IACpB,YAAY,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACxC,MAAM,EAAE,CAAC,WAAW,EAAE,OAAO,CAAC,sBAAsB,CAAC,KAAK,IAAI,CAAC;IAC/D,QAAQ,CAAC,EAAE,CAAC,WAAW,EAAE,sBAAsB,KAAK,IAAI,CAAC;CAC1D;AAoGD,QAAA,MAAM,yBAAyB,2CAAwC,CAAC;AACxE,KAAK,yBAAyB,GAAG,UAAU,CAAC,OAAO,yBAAyB,CAAC,CAAC;AAC9E,eAAe,yBAAyB,CAAC"}

package/dist/svelte/components/ContentCorrectionsTool.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+import { Input, Select, Textarea } from '@happyvertical/smrt-ui/forms';
 import { useI18n } from '@happyvertical/smrt-ui/i18n';
 import { Button } from '@happyvertical/smrt-ui/ui';
 import type { ContentCorrectionData, FactData } from '../../mock-smrt-client';
@@ -173,7 +174,7 @@ async function issueCorrection() {
   {:else}
     <label class="workflow-field">
       Summary
-      <input
+      <Input
         type="text"
         bind:value={correctionSummary}
         placeholder={t(M['content.corrections_tool.what_was_wrong'])}
@@ -182,33 +183,34 @@ async function issueCorrection() {
 
     <label class="workflow-field">
       {t(M['content.corrections_tool.related_fact'])}
-      <select bind:value={correctionFactId}>
+      <Select bind:value={correctionFactId}>
         <option value="">{t(M['content.corrections_tool.general_correction'])}</option>
         {#each facts as fact (fact.id)}
           <option value={fact.id ?? ''}>{fact.textRefined}</option>
         {/each}
-      </select>
+      </Select>
     </label>
 
     <label class="workflow-field">
       {t(M['content.corrections_tool.corrected_fact_text'])}
-      <textarea
-        rows="4"
+      <Textarea
+        rows={4}
         bind:value={correctedFactText}
         placeholder={t(M['content.corrections_tool.provide_corrected_wording'])}
-      ></textarea>
+      ></Textarea>
     </label>
 
     <label class="workflow-field">
       {t(M['content.corrections_tool.public_note'])}
-      <textarea
-        rows="3"
+      <Textarea
+        rows={3}
         bind:value={correctionPublicNote}
         placeholder={t(M['content.corrections_tool.optional_public_correction_note'])}
-      ></textarea>
+      ></Textarea>
     </label>
 
     <label class="checkbox-row">
+      <!-- raw-primitive-allow: native checkbox; no Provider-free checkbox primitive (Toggle is a switch with different semantics, CheckboxInput requires a Provider) -->
       <input type="checkbox" bind:checked={publishCorrection} />
       {t(M['content.corrections_tool.publish_immediately'])}
     </label>
@@ -260,19 +262,6 @@ async function issueCorrection() {
     font-weight: var(--smrt-typography-weight-medium, 500);
   }
 
-  .workflow-field input,
-  .workflow-field textarea,
-  .workflow-field select {
-    width: 100%;
-    box-sizing: border-box;
-    padding: 0.75rem;
-    border-radius: 0.5rem;
-    border: 1px solid var(--smrt-color-outline);
-    background: var(--smrt-color-surface);
-    color: var(--smrt-color-on-surface);
-    font-family: inherit;
-  }
-
   .tool-card {
     display: flex;
     flex-direction: column;

package/dist/svelte/components/ContentCorrectionsTool.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContentCorrectionsTool.svelte.d.ts","sourceRoot":"","sources":["../../../src/svelte/components/ContentCorrectionsTool.svelte.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,qBAAqB,EAAY,MAAM,wBAAwB,CAAC;AAM9E,MAAM,WAAW,KAAK;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,qBAAqB,EAAE,KAAK,IAAI,CAAC;CACtE;AAqOD,QAAA,MAAM,sBAAsB,2CAAwC,CAAC;AACrE,KAAK,sBAAsB,GAAG,UAAU,CAAC,OAAO,sBAAsB,CAAC,CAAC;AACxE,eAAe,sBAAsB,CAAC"}
+{"version":3,"file":"ContentCorrectionsTool.svelte.d.ts","sourceRoot":"","sources":["../../../src/svelte/components/ContentCorrectionsTool.svelte.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,qBAAqB,EAAY,MAAM,wBAAwB,CAAC;AAM9E,MAAM,WAAW,KAAK;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,qBAAqB,EAAE,KAAK,IAAI,CAAC;CACtE;AAuOD,QAAA,MAAM,sBAAsB,2CAAwC,CAAC;AACrE,KAAK,sBAAsB,GAAG,UAAU,CAAC,OAAO,sBAAsB,CAAC,CAAC;AACxE,eAAe,sBAAsB,CAAC"}