storyloco 2.0.1 → 2.2.0

package/README.md

@@ -15,6 +15,7 @@ A collection of slick Storyblok field plugins built with Svelte 5, TypeScript, a
 - **🏗️ Plans** - Floor plan manager with drag-and-drop sorting for types, floors, dimensions, and rooms
 - **📝 Input** - Comprehensive form input field with support for all HTML input types, checkboxes, radio buttons, selects, and textareas
 - **⏰ Time** - Simple time input field with step control
+- **💷 Currency** - Amount input with a currency selector; configure allowed codes via the `currencies` and `default_currency` options
 
 ### Vite Plugins
 
@@ -185,6 +186,14 @@ Your params are spread last, so any default can be overridden:
 await storyblok.story('layout', { resolve_assets: 0 })
 ```
 
+`story` treats a missing story as a 404. Where a slug is allowed not to exist, `find` returns
+`null` instead — the miss is then neither raised nor logged:
+
+```typescript
+const product = await storyblok.find<Product>(`products/${slug}`)
+if (!product) error(404, 'Product not found')
+```
+
 It's callable too, for anything the methods don't cover:
 
 ```typescript
@@ -258,6 +267,7 @@ export interface StoryblokCustomPlugins {
 		twitter_description: string
 	}
 	'loco-time': string
+	'loco-currency': import('storyloco/currency').Currency
 	'loco-asset': import('storyloco/asset').Asset
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "storyloco",
-	"version": "2.0.1",
+	"version": "2.2.0",
 	"description": "A collection of slick Storyblok field plugins built with Svelte 5, TypeScript, and Tailwind CSS",
 	"keywords": [
 		"storyblok",
@@ -33,7 +33,8 @@
 		"packages/input/types.ts",
 		"packages/time/types.ts",
 		"packages/seo/types.ts",
-		"packages/hubspot_form/types.ts"
+		"packages/hubspot_form/types.ts",
+		"packages/currency/types.ts"
 	],
 	"exports": {
 		".": {
@@ -93,6 +94,10 @@
 		"./hubspot_form": {
 			"types": "./packages/hubspot_form/types.ts",
 			"svelte": "./packages/hubspot_form/src/app.svelte.ts"
+		},
+		"./currency": {
+			"types": "./packages/currency/types.ts",
+			"svelte": "./packages/currency/src/app.svelte.ts"
 		}
 	},
 	"devDependencies": {

package/packages/currency/types.ts

@@ -0,0 +1,11 @@
+/**
+ * Narrow `Code` to the codes configured in the field's `currencies` option,
+ * e.g. `Currency<'GBP' | 'USD'>`.
+ */
+export interface Currency<Code extends string = Uppercase<string>> {
+	/** ISO 4217 code, e.g. `GBP` */
+	currency: Code
+	amount: number | null
+	/** `amount` formatted for display, e.g. `£130,000.00`; `null` when there's no amount */
+	formatted: string | null
+}

package/packages/vite/dist/schema/plugin.js

@@ -176,6 +176,23 @@ import type { ISbStoryData } from '@storyblok/js';`, "");
             // determine how many folders are in output_path
             const output_path_parts = out_dir.split("/");
             const import_path = output_path_parts.map(() => `..`).join("/");
+            // Replicates the storyblok CLI's `getComponentType` (no prefix/suffix), so these
+            // entries reference the interface names it generates below.
+            const type_name = (component) => {
+                const sanitized = component
+                    .replace(/[^a-z0-9]/gi, "_")
+                    .replace(/_+/g, "_")
+                    .replace(/^_+|_+$/g, "");
+                const camel = sanitized
+                    .replace(/_([a-z])/g, (_, letter) => letter.toUpperCase())
+                    .replace(/_/g, "");
+                const pascal = camel ? camel[0].toUpperCase() + camel.slice(1) : camel;
+                return /^\d/.test(pascal) ? `_${pascal}` : pascal;
+            };
+            const content_types = new_components
+                .filter((component) => component.is_root)
+                .map((component) => component.name)
+                .sort();
             const header = `
 			               /**
 			                * AUTO-GENERATED FILE. DO NOT EDIT.
@@ -184,9 +201,23 @@ import type { ISbStoryData } from '@storyblok/js';`, "");
 			                */
 
 			               import type { StoryblokCustomPlugins } from "${import_path}/vite.config.js"
-			               import type { SbBlokData } from "@storyblok/svelte"
 
-			               export type Blok<T> = SbBlokData & T
+			               /**
+			                * No \`SbBlokData\` intersection: its string index signature would reject the
+			                * generated interfaces, which (deliberately) declare no index signature.
+			                */
+			               export type Blok<T> = T & { component?: string; _uid?: string; _editable?: string }
+
+			               /**
+			                * Content-type (root) components keyed by component name — the bloks a story
+			                * can be. The CLI types every component identically, so this comes from the
+			                * space's component list instead.
+			                */
+			               export interface ContentTypes {
+			               ${content_types.map((name) => `"${name}": ${type_name(name)}`).join("\n")}
+			               }
+
+			               export type ContentType = ContentTypes[keyof ContentTypes]
 			             `;
             let content = component_types.replace(`// This file was generated by the storyblok CLI.
 // DO NOT MODIFY THIS FILE BY HAND.`, header);

package/packages/vite/dist/server.d.ts

@@ -19,6 +19,7 @@ export declare function version(): Version;
  *
  * // anywhere on the server
  * await storyblok.story("layout")
+ * await storyblok.find<Product>(`products/${slug}`) // null when missing
  * await storyblok.stories<Blog>({ content_type: "blog", per_page: 2 })
  *
  * const { client, version } = storyblok()
@@ -29,15 +30,12 @@ export declare function setup(client: StoryblokClient): (() => {
     client: StoryblokClient;
     version: Version;
 }) & {
-    /**
-     * A single story by full slug. Resolves the client's `relations`, unlike `stories`.
-     *
-     * `T` is the story's content type; it defaults to the SDK's permissive one, so an
-     * unparameterised call behaves as before.
-     */
-    story<T = import("storyblok-js-client").ISbComponentType<string> & {
+    story: <T = import("storyblok-js-client").ISbComponentType<string> & {
+        [index: string]: any;
+    }>(slug: string, params?: ISbStoryParams) => Promise<ISbStoryData<T>>;
+    find: <T = import("storyblok-js-client").ISbComponentType<string> & {
         [index: string]: any;
-    }>(slug: string, params?: ISbStoryParams): Promise<ISbStoryData<T>>;
+    }>(slug: string, params?: ISbStoryParams) => Promise<ISbStoryData<T> | null>;
     /**
      * The link tree as a flat array — Storyblok returns it keyed by uuid, which is
      * almost never what you want. Filtering and ordering are left to the caller.

package/packages/vite/dist/server.js

@@ -1,5 +1,9 @@
 import { getRequestEvent } from "$app/server";
+import { error } from "@sveltejs/kit";
 import { handle_error } from "./storyblok.svelte.js";
+function is_not_found(err) {
+    return typeof err === "object" && err !== null && "status" in err && err.status === 404;
+}
 /** The content version for the current request, as set by the `version` hook. */
 export function version() {
     return getRequestEvent().locals.version;
@@ -20,6 +24,7 @@ export function version() {
  *
  * // anywhere on the server
  * await storyblok.story("layout")
+ * await storyblok.find<Product>(`products/${slug}`) // null when missing
  * await storyblok.stories<Blog>({ content_type: "blog", per_page: 2 })
  *
  * const { client, version } = storyblok()
@@ -28,25 +33,37 @@ export function version() {
  */
 export function setup(client) {
     const context = () => ({ client, version: version() });
+    /**
+     * A single story by full slug, or `null` when there isn't one. Resolves the client's
+     * `relations`, unlike `stories`. For slugs that are allowed not to exist — a miss is
+     * routine, so it's neither raised nor logged. `T` is the story's content type.
+     */
+    async function find(slug, params = {}) {
+        const response = await client
+            .get(`cdn/stories/${slug}`, {
+            version: version(),
+            resolve_links: "url",
+            resolve_relations: client.relations,
+            resolve_assets: 1,
+            ...params,
+        })
+            .catch((err) => {
+            if (is_not_found(err))
+                return null;
+            return handle_error(err);
+        });
+        return (response?.data.story ?? null);
+    }
+    /** A single story by full slug; a missing one is a 404. `find` for stories that may not exist. */
+    async function story(slug, params = {}) {
+        const found = await find(slug, params);
+        if (!found)
+            error(404, "Story not found");
+        return found;
+    }
     return Object.assign(context, {
-        /**
-         * A single story by full slug. Resolves the client's `relations`, unlike `stories`.
-         *
-         * `T` is the story's content type; it defaults to the SDK's permissive one, so an
-         * unparameterised call behaves as before.
-         */
-        async story(slug, params = {}) {
-            const response = await client
-                .get(`cdn/stories/${slug}`, {
-                version: version(),
-                resolve_links: "url",
-                resolve_relations: client.relations,
-                resolve_assets: 1,
-                ...params,
-            })
-                .catch(handle_error);
-            return response.data.story;
-        },
+        story,
+        find,
         /**
          * The link tree as a flat array — Storyblok returns it keyed by uuid, which is
          * almost never what you want. Filtering and ordering are left to the caller.

package/packages/vite/dist/storyblok.svelte.d.ts

@@ -196,7 +196,10 @@ interface BlokFields {
  * </section>
  * ```
  */
-export declare function attrs<T extends BlokFields>(blok: SbBlokData & T): {
+export declare function attrs<T extends BlokFields>(blok: T & {
+    _uid?: string;
+    _editable?: string;
+}): {
     [x: symbol]: (node: HTMLElement) => void;
     id: string | undefined;
 };

package/packages/vite/dist/storyblok.svelte.js

@@ -186,6 +186,7 @@ export function handle_error(err) {
 export function attrs(blok) {
     return {
         [attach()](node) {
+            // SbBlokData is nominal ceremony here — editable only reads `_editable`.
             editable(node, blok);
         },
         id: blok.anchor || blok._uid,