@datocms/svelte 1.2.1 → 1.2.2

package/README.md

@@ -1,3 +1,9 @@
+<!--datocms-autoinclude-header start-->
+<a href="https://www.datocms.com/"><img src="https://www.datocms.com/images/full_logo.svg" height="60"></a>
+
+👉 [Visit the DatoCMS homepage](https://www.datocms.com) or see [What is DatoCMS?](#what-is-datocms)
+<!--datocms-autoinclude-header end-->
+
 # @datocms/svelte
 
 ![MIT](https://img.shields.io/npm/l/@datocms/svelte?style=for-the-badge) ![NPM](https://img.shields.io/npm/v/@datocms/svelte?style=for-the-badge) [![Build Status](https://img.shields.io/github/actions/workflow/status/datocms/datocms-svelte/node.js.yml?branch=main&style=for-the-badge)](https://github.com/datocms/datocms-svelte/actions/workflows/node.js.yml)
@@ -8,12 +14,6 @@ A set of components to work faster with [DatoCMS](https://www.datocms.com/) in S
 - Written in TypeScript;
 - Usable both client and server side;
 
-<br /><br />
-<a href="https://www.datocms.com/">
-<img src="https://www.datocms.com/images/full_logo.svg" height="60">
-</a>
-<br /><br />
-
 ## Table of Contents
 
 - [Features](#features)
@@ -49,3 +49,30 @@ To create a production version of this library:
 ```bash
 npm run build
 ```
+
+<!--datocms-autoinclude-footer start-->
+-----------------
+# What is DatoCMS?
+<a href="https://www.datocms.com/"><img src="https://www.datocms.com/images/full_logo.svg" height="60"></a>
+
+[DatoCMS](https://www.datocms.com/) is the REST & GraphQL Headless CMS for the modern web.
+
+Trusted by over 25,000 enterprise businesses, agency partners, and individuals across the world, DatoCMS users create online content at scale from a central hub and distribute it via API. We ❤️ our [developers](https://www.datocms.com/team/best-cms-for-developers), [content editors](https://www.datocms.com/team/content-creators) and [marketers](https://www.datocms.com/team/cms-digital-marketing)!
+
+**Quick links:**
+
+- ⚡️ Get started with a [free DatoCMS account](https://dashboard.datocms.com/signup)
+- 🔖 Go through the [docs](https://www.datocms.com/docs)
+- ⚙️ Get [support from us and the community](https://community.datocms.com/)
+- 🆕 Stay up to date on new features and fixes on the [changelog](https://www.datocms.com/product-updates)
+
+**Our featured repos:**
+- [datocms/react-datocms](https://github.com/datocms/react-datocms): React helper components for images, Structured Text rendering, and more
+- [datocms/js-rest-api-clients](https://github.com/datocms/js-rest-api-clients): Node and browser JavaScript clients for updating and administering your content. For frontend fetches, we recommend using our [GraphQL Content Delivery API](https://www.datocms.com/docs/content-delivery-api) instead.
+- [datocms/cli](https://github.com/datocms/cli): Command-line interface that includes our [Contentful importer](https://github.com/datocms/cli/tree/main/packages/cli-plugin-contentful) and [Wordpress importer](https://github.com/datocms/cli/tree/main/packages/cli-plugin-wordpress)
+- [datocms/plugins](https://github.com/datocms/plugins): Example plugins we've made that extend the editor/admin dashboard
+- [datocms/gatsby-source-datocms](https://github.com/datocms/gatsby-source-datocms): Our Gatsby source plugin to pull data from DatoCMS
+- Frontend examples in different frameworks: [Next.js](https://github.com/datocms/nextjs-demo), [Vue](https://github.com/datocms/vue-datocms) and [Nuxt](https://github.com/datocms/nuxtjs-demo), [Svelte](https://github.com/datocms/datocms-svelte) and [SvelteKit](https://github.com/datocms/sveltekit-demo), [Astro](https://github.com/datocms/datocms-astro-blog-demo), [Remix](https://github.com/datocms/remix-example). See [all our starter templates](https://www.datocms.com/marketplace/starters).
+
+Or see [all our public repos](https://github.com/orgs/datocms/repositories?q=&type=public&language=&sort=stargazers)
+<!--datocms-autoinclude-footer end-->

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datocms/svelte",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "A set of components and utilities to work faster with DatoCMS in Svelte",
   "license": "MIT",
   "repository": {
@@ -16,7 +16,7 @@
   "devDependencies": {
     "@sveltejs/adapter-auto": "^1.0.3",
     "@sveltejs/kit": "^1.30.3",
-    "@sveltejs/package": "^1.0.2",
+    "@sveltejs/package": "^1.0.0",
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/svelte": "^3.2.2",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
@@ -37,36 +37,181 @@
     "vite": "^4.5.1",
     "vitest": "^0.25.8"
   },
+  "peerDependencies": {
+    "svelte": "^3.59.2"
+  },
   "type": "module",
   "dependencies": {
     "datocms-structured-text-utils": "^2.0.4",
-    "svelte-intersection-observer": "^0.10.1",
+    "svelte-intersection-observer": "^1.0.0",
     "universal-base64": "^2.1.0"
   },
   "exports": {
     "./package.json": "./package.json",
-    "./components/Head/Head.svelte": "./components/Head/Head.svelte",
+    "./components/Head/Head.svelte": {
+      "types": "./package/components/Head/Head.svelte.d.ts",
+      "svelte": "./package/components/Head/Head.svelte",
+      "default": "./package/components/Head/Head.svelte"
+    },
+    "./components/Image/Image.svelte": {
+      "types": "./package/components/Image/Image.svelte.d.ts",
+      "svelte": "./package/components/Image/Image.svelte",
+      "default": "./package/components/Image/Image.svelte"
+    },
+    "./components/Image/Placeholder.svelte": {
+      "types": "./package/components/Image/Placeholder.svelte.d.ts",
+      "svelte": "./package/components/Image/Placeholder.svelte",
+      "default": "./package/components/Image/Placeholder.svelte"
+    },
+    "./components/Image/Sizer.svelte": {
+      "types": "./package/components/Image/Sizer.svelte.d.ts",
+      "svelte": "./package/components/Image/Sizer.svelte",
+      "default": "./package/components/Image/Sizer.svelte"
+    },
+    "./components/Image/Source.svelte": {
+      "types": "./package/components/Image/Source.svelte.d.ts",
+      "svelte": "./package/components/Image/Source.svelte",
+      "default": "./package/components/Image/Source.svelte"
+    },
+    "./components/StructuredText/Node.svelte": {
+      "types": "./package/components/StructuredText/Node.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/Node.svelte",
+      "default": "./package/components/StructuredText/Node.svelte"
+    },
+    "./components/StructuredText/StructuredText.svelte": {
+      "types": "./package/components/StructuredText/StructuredText.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/StructuredText.svelte",
+      "default": "./package/components/StructuredText/StructuredText.svelte"
+    },
+    "./components/StructuredText/nodes/Blockquote.svelte": {
+      "types": "./package/components/StructuredText/nodes/Blockquote.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/nodes/Blockquote.svelte",
+      "default": "./package/components/StructuredText/nodes/Blockquote.svelte"
+    },
+    "./components/StructuredText/nodes/Code.svelte": {
+      "types": "./package/components/StructuredText/nodes/Code.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/nodes/Code.svelte",
+      "default": "./package/components/StructuredText/nodes/Code.svelte"
+    },
+    "./components/StructuredText/nodes/Heading.svelte": {
+      "types": "./package/components/StructuredText/nodes/Heading.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/nodes/Heading.svelte",
+      "default": "./package/components/StructuredText/nodes/Heading.svelte"
+    },
+    "./components/StructuredText/nodes/Link.svelte": {
+      "types": "./package/components/StructuredText/nodes/Link.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/nodes/Link.svelte",
+      "default": "./package/components/StructuredText/nodes/Link.svelte"
+    },
+    "./components/StructuredText/nodes/List.svelte": {
+      "types": "./package/components/StructuredText/nodes/List.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/nodes/List.svelte",
+      "default": "./package/components/StructuredText/nodes/List.svelte"
+    },
+    "./components/StructuredText/nodes/ListItem.svelte": {
+      "types": "./package/components/StructuredText/nodes/ListItem.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/nodes/ListItem.svelte",
+      "default": "./package/components/StructuredText/nodes/ListItem.svelte"
+    },
+    "./components/StructuredText/nodes/Paragraph.svelte": {
+      "types": "./package/components/StructuredText/nodes/Paragraph.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/nodes/Paragraph.svelte",
+      "default": "./package/components/StructuredText/nodes/Paragraph.svelte"
+    },
+    "./components/StructuredText/nodes/Root.svelte": {
+      "types": "./package/components/StructuredText/nodes/Root.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/nodes/Root.svelte",
+      "default": "./package/components/StructuredText/nodes/Root.svelte"
+    },
+    "./components/StructuredText/nodes/Span.svelte": {
+      "types": "./package/components/StructuredText/nodes/Span.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/nodes/Span.svelte",
+      "default": "./package/components/StructuredText/nodes/Span.svelte"
+    },
+    "./components/StructuredText/nodes/ThematicBreak.svelte": {
+      "types": "./package/components/StructuredText/nodes/ThematicBreak.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/nodes/ThematicBreak.svelte",
+      "default": "./package/components/StructuredText/nodes/ThematicBreak.svelte"
+    },
+    "./components/StructuredText/utils/Lines.svelte": {
+      "types": "./package/components/StructuredText/utils/Lines.svelte.d.ts",
+      "svelte": "./package/components/StructuredText/utils/Lines.svelte",
+      "default": "./package/components/StructuredText/utils/Lines.svelte"
+    },
+    ".": {
+      "types": "./package/index.d.ts",
+      "svelte": "./package/index.js",
+      "default": "./package/index.js"
+    },
+    "./.DS_Store": "./.DS_Store",
+    "./components/.DS_Store": "./components/.DS_Store",
     "./components/Head/README.md": "./components/Head/README.md",
-    "./components/Image/Image.svelte": "./components/Image/Image.svelte",
-    "./components/Image/Placeholder.svelte": "./components/Image/Placeholder.svelte",
     "./components/Image/README.md": "./components/Image/README.md",
-    "./components/Image/Sizer.svelte": "./components/Image/Sizer.svelte",
-    "./components/Image/Source.svelte": "./components/Image/Source.svelte",
-    "./components/StructuredText/Node.svelte": "./components/StructuredText/Node.svelte",
-    "./components/StructuredText/README.md": "./components/StructuredText/README.md",
-    "./components/StructuredText/StructuredText.svelte": "./components/StructuredText/StructuredText.svelte",
-    "./components/StructuredText/nodes/Blockquote.svelte": "./components/StructuredText/nodes/Blockquote.svelte",
-    "./components/StructuredText/nodes/Code.svelte": "./components/StructuredText/nodes/Code.svelte",
-    "./components/StructuredText/nodes/Heading.svelte": "./components/StructuredText/nodes/Heading.svelte",
-    "./components/StructuredText/nodes/Link.svelte": "./components/StructuredText/nodes/Link.svelte",
-    "./components/StructuredText/nodes/List.svelte": "./components/StructuredText/nodes/List.svelte",
-    "./components/StructuredText/nodes/ListItem.svelte": "./components/StructuredText/nodes/ListItem.svelte",
-    "./components/StructuredText/nodes/Paragraph.svelte": "./components/StructuredText/nodes/Paragraph.svelte",
-    "./components/StructuredText/nodes/Root.svelte": "./components/StructuredText/nodes/Root.svelte",
-    "./components/StructuredText/nodes/Span.svelte": "./components/StructuredText/nodes/Span.svelte",
-    "./components/StructuredText/nodes/ThematicBreak.svelte": "./components/StructuredText/nodes/ThematicBreak.svelte",
-    "./components/StructuredText/utils/Lines.svelte": "./components/StructuredText/utils/Lines.svelte",
-    ".": "./index.js"
+    "./components/StructuredText/README.md": "./components/StructuredText/README.md"
   },
-  "svelte": "./index.js"
+  "files": [
+    "package"
+  ],
+  "svelte": "./package/index.js",
+  "typesVersions": {
+    ">4.0": {
+      "components/Head/Head.svelte": [
+        "./package/components/Head/Head.svelte.d.ts"
+      ],
+      "components/Image/Image.svelte": [
+        "./package/components/Image/Image.svelte.d.ts"
+      ],
+      "components/Image/Placeholder.svelte": [
+        "./package/components/Image/Placeholder.svelte.d.ts"
+      ],
+      "components/Image/Sizer.svelte": [
+        "./package/components/Image/Sizer.svelte.d.ts"
+      ],
+      "components/Image/Source.svelte": [
+        "./package/components/Image/Source.svelte.d.ts"
+      ],
+      "components/StructuredText/Node.svelte": [
+        "./package/components/StructuredText/Node.svelte.d.ts"
+      ],
+      "components/StructuredText/StructuredText.svelte": [
+        "./package/components/StructuredText/StructuredText.svelte.d.ts"
+      ],
+      "components/StructuredText/nodes/Blockquote.svelte": [
+        "./package/components/StructuredText/nodes/Blockquote.svelte.d.ts"
+      ],
+      "components/StructuredText/nodes/Code.svelte": [
+        "./package/components/StructuredText/nodes/Code.svelte.d.ts"
+      ],
+      "components/StructuredText/nodes/Heading.svelte": [
+        "./package/components/StructuredText/nodes/Heading.svelte.d.ts"
+      ],
+      "components/StructuredText/nodes/Link.svelte": [
+        "./package/components/StructuredText/nodes/Link.svelte.d.ts"
+      ],
+      "components/StructuredText/nodes/List.svelte": [
+        "./package/components/StructuredText/nodes/List.svelte.d.ts"
+      ],
+      "components/StructuredText/nodes/ListItem.svelte": [
+        "./package/components/StructuredText/nodes/ListItem.svelte.d.ts"
+      ],
+      "components/StructuredText/nodes/Paragraph.svelte": [
+        "./package/components/StructuredText/nodes/Paragraph.svelte.d.ts"
+      ],
+      "components/StructuredText/nodes/Root.svelte": [
+        "./package/components/StructuredText/nodes/Root.svelte.d.ts"
+      ],
+      "components/StructuredText/nodes/Span.svelte": [
+        "./package/components/StructuredText/nodes/Span.svelte.d.ts"
+      ],
+      "components/StructuredText/nodes/ThematicBreak.svelte": [
+        "./package/components/StructuredText/nodes/ThematicBreak.svelte.d.ts"
+      ],
+      "components/StructuredText/utils/Lines.svelte": [
+        "./package/components/StructuredText/utils/Lines.svelte.d.ts"
+      ],
+      "index.d.ts": [
+        "./package/index.d.ts"
+      ]
+    }
+  }
 }

package/components/Head/Head.svelte

@@ -1,14 +0,0 @@
-<script context="module"></script>
-
-<script>export let data = [];
-</script>
-
-<svelte:head>
-	{#each data as { tag, attributes, content }}
-		{#if content}
-			<svelte:element this={tag} {...attributes}>{content}</svelte:element>
-		{:else}
-			<svelte:element this={tag} {...attributes} />
-		{/if}
-	{/each}
-</svelte:head>

package/components/Head/Head.svelte.d.ts

@@ -1,61 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-export interface TitleMetaLinkTag {
-    /** the tag for the meta information */
-    tag: "title" | "meta" | "link";
-    /** the inner content of the meta tag */
-    content?: string | null | undefined;
-    /** the HTML attributes to attach to the meta tag */
-    attributes?: Record<string, string> | null | undefined;
-}
-export interface SeoTitleTag {
-    tag: 'title';
-    content: string | null;
-    attributes?: null;
-}
-export interface RegularMetaAttributes {
-    name: string;
-    content: string;
-}
-export interface OgMetaAttributes {
-    property: string;
-    content: string;
-}
-export interface SeoMetaTag {
-    tag: 'meta';
-    content?: null;
-    attributes: RegularMetaAttributes | OgMetaAttributes;
-}
-export interface FaviconAttributes {
-    sizes: string;
-    type: string;
-    rel: string;
-    href: string;
-}
-export interface AppleTouchIconAttributes {
-    sizes: string;
-    rel: 'apple-touch-icon';
-    href: string;
-}
-export interface SeoLinkTag {
-    tag: 'link';
-    content?: null;
-    attributes: FaviconAttributes | AppleTouchIconAttributes;
-}
-export type SeoTag = SeoTitleTag | SeoMetaTag;
-export type FaviconTag = SeoMetaTag | SeoLinkTag;
-export type SeoOrFaviconTag = SeoTag | FaviconTag;
-declare const __propDef: {
-    props: {
-        data?: (TitleMetaLinkTag | SeoOrFaviconTag)[] | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type HeadProps = typeof __propDef.props;
-export type HeadEvents = typeof __propDef.events;
-export type HeadSlots = typeof __propDef.slots;
-export default class Head extends SvelteComponentTyped<HeadProps, HeadEvents, HeadSlots> {
-}
-export {};

package/components/Head/README.md

@@ -1,68 +0,0 @@
-## Social share, SEO and Favicon meta tags
-
-Just like the image component, `<Head />` is a component specially designed to work seamlessly with DatoCMS’s [`_seoMetaTags` and `faviconMetaTags` GraphQL queries](https://www.datocms.com/docs/content-delivery-api/seo) so that you can handle proper SEO in your pages.
-
-You can use `<Head />` your components, and it will inject title, meta and link tags in the document's `<head></head>` tag.
-
-### Table of contents
-
-- [Usage](#usage)
-- [Example](#example)
-
-### Usage
-
-`<Head />`'s `data` prop takes an array of `Tag`s in the exact form they're returned by the following [DatoCMS GraphQL API](https://www.datocms.com/docs/content-delivery-api/seo) queries:
-
-- `_seoMetaTags` query on any record, or
-- `faviconMetaTags` on the global `_site` object.
-
-### Example
-
-Here is an example:
-
-```svelte
-<script>
-  import { onMount } from 'svelte';
-
-  import { Head } from '@datocms/svelte';
-
-  const query = `
-    query {
-      page: homepage {
-        title
-        seo: _seoMetaTags {
-          attributes
-          content
-          tag
-        }
-      }
-      site: _site {
-        favicon: faviconMetaTags {
-          attributes
-          content
-          tag
-        }
-      }
-    }
-  `;
-
-  export let data = null;
-
-  onMount(async () => {
-    const response = await fetch('https://graphql.datocms.com/', {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-        Authorization: 'Bearer faeb9172e232a75339242faafb9e56de8c8f13b735f7090964'
-      },
-      body: JSON.stringify({ query })
-    });
-
-    const json = await response.json();
-
-    data = [...json.data.page.seo, ...json.data.site.favicon];
-  });
-</script>
-
-<Head {data} />
-```

package/components/Head/__tests__/Head.test.d.ts

@@ -1 +0,0 @@
-import '@testing-library/jest-dom';

package/components/Head/__tests__/Head.test.js

@@ -1,11 +0,0 @@
-import { describe, expect, it } from 'vitest';
-import '@testing-library/jest-dom';
-import { render, } from '@testing-library/svelte';
-import { Head } from '../../..';
-import { metaTags } from './__fixtures__/head';
-describe('Head', () => {
-    it('renders meta tags', () => {
-        const { container } = render(Head, { props: { data: metaTags } });
-        expect(container.ownerDocument.head).toMatchSnapshot();
-    });
-});

package/components/Head/__tests__/__fixtures__/head.d.ts

@@ -1,2 +0,0 @@
-import type { TitleMetaLinkTag } from '../../Head.svelte';
-export declare const metaTags: TitleMetaLinkTag[];