svelte-meta-tags 3.1.4 → 4.0.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.
- package/README.md +128 -11
- package/dist/JsonLd.svelte +29 -11
- package/dist/JsonLd.svelte.d.ts +5 -17
- package/dist/MetaTags.svelte +93 -36
- package/dist/MetaTags.svelte.d.ts +2 -29
- package/dist/deepMerge.d.ts +1 -0
- package/dist/deepMerge.js +36 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -0
- package/dist/types.d.ts +48 -4
- package/package.json +17 -14
package/README.md
CHANGED
|
@@ -9,7 +9,7 @@ Svelte Meta Tags provides components designed to help you manage SEO for Svelte
|
|
|
9
9
|
|
|
10
10
|
[Demo](https://svelte.dev/repl/ffd783c9b8e54d97b6b7cac6eadace42)
|
|
11
11
|
|
|
12
|
-
**Note: If you are migrating from
|
|
12
|
+
**Note: If you are migrating from v3 to v4, [Please Read Migration Guide](https://github.com/oekazuma/svelte-meta-tags/issues/1015)**
|
|
13
13
|
|
|
14
14
|
**Table of Contents**
|
|
15
15
|
|
|
@@ -109,7 +109,7 @@ pnpm add -D svelte-meta-tags
|
|
|
109
109
|
siteName: 'SiteName'
|
|
110
110
|
}}
|
|
111
111
|
twitter={{
|
|
112
|
-
|
|
112
|
+
creator: '@handle',
|
|
113
113
|
site: '@site',
|
|
114
114
|
cardType: 'summary_large_image',
|
|
115
115
|
title: 'Using More of Config',
|
|
@@ -131,18 +131,17 @@ pnpm add -D svelte-meta-tags
|
|
|
131
131
|
|
|
132
132
|
```svelte
|
|
133
133
|
<script>
|
|
134
|
-
import { MetaTags } from 'svelte-meta-tags';
|
|
135
134
|
import { page } from '$app/stores';
|
|
136
|
-
import
|
|
135
|
+
import { MetaTags, deepMerge } from 'svelte-meta-tags';
|
|
137
136
|
|
|
138
|
-
|
|
137
|
+
let { data, children } = $props();
|
|
139
138
|
|
|
140
|
-
|
|
139
|
+
let metaTags = $derived(deepMerge(data.baseMetaTags, $page.data.pageMetaTags));
|
|
141
140
|
</script>
|
|
142
141
|
|
|
143
142
|
<MetaTags {...metaTags} />
|
|
144
143
|
|
|
145
|
-
|
|
144
|
+
{@render children()}
|
|
146
145
|
```
|
|
147
146
|
|
|
148
147
|
`+layout.ts`
|
|
@@ -221,11 +220,24 @@ export const load = () => {
|
|
|
221
220
|
| `additionalLinkTags` | array | Allows you to add a link tag that is not documented here [More Info](#additional-link-tags) |
|
|
222
221
|
| `twitter.cardType` | string | The card type, which will be one of `summary`, `summary_large_image`, `app`, or `player` |
|
|
223
222
|
| `twitter.site` | string | @username for the website used in the card footer |
|
|
224
|
-
| `twitter.
|
|
223
|
+
| `twitter.creator` | string | @username for the creator of the content (output as `twitter:creator`) |
|
|
225
224
|
| `twitter.title` | string | The concise title for the related content |
|
|
226
225
|
| `twitter.description` | string | The description that concisely summarizes the content in a manner suitable for presentation within a Tweet. You should not reuse the title as the description or use this field to describe the general services provided by the website |
|
|
227
226
|
| `twitter.image` | string | The URL to a unique image that represents the content of the page. You should not use a generic image such as your site logo, author photo, or other image that spans multiple pages. Images for this card support a 1:1 aspect ratio with a minimum size of 144x144 pixels or a maximum size of 4096x4096 pixels. Images must be less than 5MB in size. The image will be cropped to a square on all platforms. JPG, PNG, WEBP, and GIF formats are supported. Only the first frame of an animated GIF is used. SVG is not supported |
|
|
228
227
|
| `twitter.imageAlt` | string | The textual description of the image that conveys the essence of the image to visually impaired users. Maximum 420 characters |
|
|
228
|
+
| `twitter.player` | string | HTTPS URL of a video player for this content |
|
|
229
|
+
| `twitter.playerWidth` | number | Width of the player in pixels |
|
|
230
|
+
| `twitter.playerHeight` | number | Height of the player in pixels |
|
|
231
|
+
| `twitter.playerStream` | string | URL to raw video or audio stream |
|
|
232
|
+
| `twitter.appNameIPhone` | string | Name of your iPhone app |
|
|
233
|
+
| `twitter.appIdIPhone` | string | Your iPhone app ID |
|
|
234
|
+
| `twitter.appUrlIPhone` | string | Your iPhone app URL |
|
|
235
|
+
| `twitter.appNameIPad` | string | Name of your iPad app |
|
|
236
|
+
| `twitter.appIdIPad` | string | Your iPad app ID |
|
|
237
|
+
| `twitter.appUrlIPad` | string | Your iPad app URL |
|
|
238
|
+
| `twitter.appNameGooglePlay` | string | Name of your Android app |
|
|
239
|
+
| `twitter.appIdGooglePlay` | string | Your Android app ID |
|
|
240
|
+
| `twitter.appUrlGooglePlay` | string | Your Android app URL |
|
|
229
241
|
| `facebook.appId` | string | For Facebook Insights, you will need to add a Facebook app ID to your page in order to use it |
|
|
230
242
|
| `openGraph.url` | string | The canonical URL of your object, which will be used as its permanent ID in the graph |
|
|
231
243
|
| `openGraph.type` | string | The type of your object. Depending on the type you specify, other properties may also be required [More Info](#open-graph) |
|
|
@@ -271,7 +283,7 @@ titleTemplate = '%s | Svelte Meta Tags'
|
|
|
271
283
|
|
|
272
284
|
```js
|
|
273
285
|
twitter={{
|
|
274
|
-
|
|
286
|
+
creator: '@handle',
|
|
275
287
|
site: '@site',
|
|
276
288
|
cardType: 'summary_large_image',
|
|
277
289
|
title: 'Twitter',
|
|
@@ -928,6 +940,87 @@ This plugin uses [schema-dts](https://github.com/google/schema-dts), so it provi
|
|
|
928
940
|
/>
|
|
929
941
|
```
|
|
930
942
|
|
|
943
|
+
## Deep Merge function
|
|
944
|
+
|
|
945
|
+
Provides a function to deeply merge the enumerable properties of two or more objects.
|
|
946
|
+
|
|
947
|
+
Use this when you want to override the default values on child pages, as in the following example.
|
|
948
|
+
|
|
949
|
+
`+layout.svelte`
|
|
950
|
+
|
|
951
|
+
```svelte
|
|
952
|
+
<script>
|
|
953
|
+
import { page } from '$app/stores';
|
|
954
|
+
import { MetaTags, deepMerge } from 'svelte-meta-tags';
|
|
955
|
+
|
|
956
|
+
let { data, children } = $props();
|
|
957
|
+
|
|
958
|
+
let metaTags = $derived(deepMerge(data.baseMetaTags, $page.data.pageMetaTags));
|
|
959
|
+
</script>
|
|
960
|
+
|
|
961
|
+
<MetaTags {...metaTags} />
|
|
962
|
+
|
|
963
|
+
{@render children()}
|
|
964
|
+
```
|
|
965
|
+
|
|
966
|
+
`+layout.ts`
|
|
967
|
+
|
|
968
|
+
```ts
|
|
969
|
+
import type { MetaTagsProps } from 'svelte-meta-tags';
|
|
970
|
+
|
|
971
|
+
export const load = ({ url }) => {
|
|
972
|
+
const baseMetaTags = Object.freeze({
|
|
973
|
+
title: 'Default',
|
|
974
|
+
titleTemplate: '%s | Svelte Meta Tags',
|
|
975
|
+
description: 'Svelte Meta Tags is a Svelte component for managing meta tags and SEO in your Svelte applications.',
|
|
976
|
+
canonical: new URL(url.pathname, url.origin).href,
|
|
977
|
+
openGraph: {
|
|
978
|
+
type: 'website',
|
|
979
|
+
url: new URL(url.pathname, url.origin).href,
|
|
980
|
+
locale: 'en_IE',
|
|
981
|
+
title: 'Open Graph Title',
|
|
982
|
+
description: 'Open Graph Description',
|
|
983
|
+
siteName: 'SiteName',
|
|
984
|
+
images: [
|
|
985
|
+
{
|
|
986
|
+
url: 'https://www.example.ie/og-image.jpg',
|
|
987
|
+
alt: 'Og Image Alt',
|
|
988
|
+
width: 800,
|
|
989
|
+
height: 600,
|
|
990
|
+
secureUrl: 'https://www.example.ie/og-image.jpg',
|
|
991
|
+
type: 'image/jpeg'
|
|
992
|
+
}
|
|
993
|
+
]
|
|
994
|
+
}
|
|
995
|
+
}) satisfies MetaTagsProps;
|
|
996
|
+
|
|
997
|
+
return {
|
|
998
|
+
baseMetaTags
|
|
999
|
+
};
|
|
1000
|
+
};
|
|
1001
|
+
```
|
|
1002
|
+
|
|
1003
|
+
`+page.ts`
|
|
1004
|
+
|
|
1005
|
+
```ts
|
|
1006
|
+
import type { MetaTagsProps } from 'svelte-meta-tags';
|
|
1007
|
+
|
|
1008
|
+
export const load = () => {
|
|
1009
|
+
const pageMetaTags = Object.freeze({
|
|
1010
|
+
title: 'TOP',
|
|
1011
|
+
description: 'Description TOP',
|
|
1012
|
+
openGraph: {
|
|
1013
|
+
title: 'Open Graph Title TOP',
|
|
1014
|
+
description: 'Open Graph Description TOP'
|
|
1015
|
+
}
|
|
1016
|
+
}) satisfies MetaTagsProps;
|
|
1017
|
+
|
|
1018
|
+
return {
|
|
1019
|
+
pageMetaTags
|
|
1020
|
+
};
|
|
1021
|
+
};
|
|
1022
|
+
```
|
|
1023
|
+
|
|
931
1024
|
## Types
|
|
932
1025
|
|
|
933
1026
|
The following types can be imported from `svelte-meta-tags`
|
|
@@ -1000,7 +1093,7 @@ interface LanguageAlternate {
|
|
|
1000
1093
|
interface Twitter {
|
|
1001
1094
|
cardType?: 'summary' | 'summary_large_image' | 'app' | 'player';
|
|
1002
1095
|
site?: string;
|
|
1003
|
-
|
|
1096
|
+
creator?: string;
|
|
1004
1097
|
title?: string;
|
|
1005
1098
|
description?: string;
|
|
1006
1099
|
image?: string;
|
|
@@ -1053,7 +1146,31 @@ interface LinkTag {
|
|
|
1053
1146
|
sizes?: string;
|
|
1054
1147
|
type?: string;
|
|
1055
1148
|
color?: string;
|
|
1056
|
-
as?:
|
|
1149
|
+
as?:
|
|
1150
|
+
| 'fetch'
|
|
1151
|
+
| 'audio'
|
|
1152
|
+
| 'audioworklet'
|
|
1153
|
+
| 'document'
|
|
1154
|
+
| 'embed'
|
|
1155
|
+
| 'font'
|
|
1156
|
+
| 'frame'
|
|
1157
|
+
| 'iframe'
|
|
1158
|
+
| 'image'
|
|
1159
|
+
| 'json'
|
|
1160
|
+
| 'manifest'
|
|
1161
|
+
| 'object'
|
|
1162
|
+
| 'paintworklet'
|
|
1163
|
+
| 'report'
|
|
1164
|
+
| 'script'
|
|
1165
|
+
| 'serviceworker'
|
|
1166
|
+
| 'sharedworker'
|
|
1167
|
+
| 'style'
|
|
1168
|
+
| 'track'
|
|
1169
|
+
| 'video'
|
|
1170
|
+
| 'webidentity'
|
|
1171
|
+
| 'worker'
|
|
1172
|
+
| 'xslt'
|
|
1173
|
+
| '';
|
|
1057
1174
|
crossOrigin?: string;
|
|
1058
1175
|
referrerPolicy?: string;
|
|
1059
1176
|
}
|
package/dist/JsonLd.svelte
CHANGED
|
@@ -1,14 +1,32 @@
|
|
|
1
|
-
<script
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
};
|
|
11
|
-
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import type { JsonLdProps } from './types';
|
|
3
|
+
import type { Thing, WithContext } from 'schema-dts';
|
|
4
|
+
|
|
5
|
+
interface Props {
|
|
6
|
+
output?: JsonLdProps['output'];
|
|
7
|
+
schema?: JsonLdProps['schema'];
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
let { output = 'head', schema = undefined }: Props = $props();
|
|
11
|
+
|
|
12
|
+
type OmitContext<T> = Omit<T, '@context'>;
|
|
13
|
+
|
|
14
|
+
let isValid = $derived(schema && typeof schema === 'object');
|
|
15
|
+
|
|
16
|
+
const createSchema = (schema: JsonLdProps['schema']) => {
|
|
17
|
+
const addContext = (context: OmitContext<Thing> | OmitContext<WithContext<Thing>>) => ({
|
|
18
|
+
'@context': 'https://schema.org',
|
|
19
|
+
...context
|
|
20
|
+
});
|
|
21
|
+
|
|
22
|
+
return Array.isArray(schema)
|
|
23
|
+
? schema.map((context) => addContext(context as OmitContext<Thing>))
|
|
24
|
+
: addContext(schema as OmitContext<WithContext<Thing>>);
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
let json = $derived(
|
|
28
|
+
`${'<scri' + 'pt type="application/ld+json">'}${JSON.stringify(createSchema(schema))}${'</scri' + 'pt>'}`
|
|
29
|
+
);
|
|
12
30
|
</script>
|
|
13
31
|
|
|
14
32
|
<svelte:head>
|
package/dist/JsonLd.svelte.d.ts
CHANGED
|
@@ -1,18 +1,6 @@
|
|
|
1
|
-
import { SvelteComponentTyped } from "svelte";
|
|
2
1
|
import type { JsonLdProps } from './types';
|
|
3
|
-
declare const
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
events: {
|
|
9
|
-
[evt: string]: CustomEvent<any>;
|
|
10
|
-
};
|
|
11
|
-
slots: {};
|
|
12
|
-
};
|
|
13
|
-
type JsonLdProps_ = typeof __propDef.props;
|
|
14
|
-
export { JsonLdProps_ as JsonLdProps };
|
|
15
|
-
export type JsonLdEvents = typeof __propDef.events;
|
|
16
|
-
export type JsonLdSlots = typeof __propDef.slots;
|
|
17
|
-
export default class JsonLd extends SvelteComponentTyped<JsonLdProps_, JsonLdEvents, JsonLdSlots> {
|
|
18
|
-
}
|
|
2
|
+
declare const JsonLd: import("svelte").Component<{
|
|
3
|
+
output?: JsonLdProps["output"];
|
|
4
|
+
schema?: JsonLdProps["schema"];
|
|
5
|
+
}, {}, "">;
|
|
6
|
+
export default JsonLd;
|
package/dist/MetaTags.svelte
CHANGED
|
@@ -1,35 +1,50 @@
|
|
|
1
|
-
<script
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import type { MetaTagsProps } from './types';
|
|
3
|
+
|
|
4
|
+
let {
|
|
5
|
+
title = '',
|
|
6
|
+
titleTemplate = '',
|
|
7
|
+
robots = 'index,follow',
|
|
8
|
+
additionalRobotsProps = undefined,
|
|
9
|
+
description = undefined,
|
|
10
|
+
mobileAlternate = undefined,
|
|
11
|
+
languageAlternates = undefined,
|
|
12
|
+
twitter = undefined,
|
|
13
|
+
facebook = undefined,
|
|
14
|
+
openGraph = undefined,
|
|
15
|
+
canonical = undefined,
|
|
16
|
+
keywords = undefined,
|
|
17
|
+
additionalMetaTags = undefined,
|
|
18
|
+
additionalLinkTags = undefined
|
|
19
|
+
}: Partial<MetaTagsProps> = $props();
|
|
20
|
+
|
|
21
|
+
let updatedTitle = $derived(titleTemplate ? (title ? titleTemplate.replace(/%s/g, title) : title) : title);
|
|
22
|
+
|
|
23
|
+
let robotsParams = $state('');
|
|
24
|
+
if (additionalRobotsProps) {
|
|
25
|
+
const {
|
|
26
|
+
nosnippet,
|
|
27
|
+
maxSnippet,
|
|
28
|
+
maxImagePreview,
|
|
29
|
+
maxVideoPreview,
|
|
30
|
+
noarchive,
|
|
31
|
+
noimageindex,
|
|
32
|
+
notranslate,
|
|
33
|
+
unavailableAfter
|
|
34
|
+
} = additionalRobotsProps;
|
|
35
|
+
|
|
36
|
+
robotsParams = `${nosnippet ? ',nosnippet' : ''}${maxSnippet ? `,max-snippet:${maxSnippet}` : ''}${
|
|
37
|
+
maxImagePreview ? `,max-image-preview:${maxImagePreview}` : ''
|
|
38
|
+
}${noarchive ? ',noarchive' : ''}${unavailableAfter ? `,unavailable_after:${unavailableAfter}` : ''}${
|
|
39
|
+
noimageindex ? ',noimageindex' : ''
|
|
40
|
+
}${maxVideoPreview ? `,max-video-preview:${maxVideoPreview}` : ''}${notranslate ? ',notranslate' : ''}`;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
$effect(() => {
|
|
44
|
+
if (!robots && additionalRobotsProps) {
|
|
45
|
+
console.warn('additionalRobotsProps cannot be used when robots is set to false');
|
|
46
|
+
}
|
|
47
|
+
});
|
|
33
48
|
</script>
|
|
34
49
|
|
|
35
50
|
<svelte:head>
|
|
@@ -72,21 +87,63 @@ $: if (!robots && additionalRobotsProps) {
|
|
|
72
87
|
{#if twitter.site}
|
|
73
88
|
<meta name="twitter:site" content={twitter.site} />
|
|
74
89
|
{/if}
|
|
75
|
-
{#if twitter.handle}
|
|
76
|
-
<meta name="twitter:creator" content={twitter.handle} />
|
|
77
|
-
{/if}
|
|
78
90
|
{#if twitter.title}
|
|
79
91
|
<meta name="twitter:title" content={twitter.title} />
|
|
80
92
|
{/if}
|
|
81
93
|
{#if twitter.description}
|
|
82
94
|
<meta name="twitter:description" content={twitter.description} />
|
|
83
95
|
{/if}
|
|
96
|
+
{#if twitter.creator}
|
|
97
|
+
<meta name="twitter:creator" content={twitter.creator} />
|
|
98
|
+
{/if}
|
|
99
|
+
{#if twitter.creatorId}
|
|
100
|
+
<meta name="twitter:creator:id" content={twitter.creatorId} />
|
|
101
|
+
{/if}
|
|
84
102
|
{#if twitter.image}
|
|
85
103
|
<meta name="twitter:image" content={twitter.image} />
|
|
86
104
|
{/if}
|
|
87
105
|
{#if twitter.imageAlt}
|
|
88
106
|
<meta name="twitter:image:alt" content={twitter.imageAlt} />
|
|
89
107
|
{/if}
|
|
108
|
+
{#if twitter.player}
|
|
109
|
+
<meta name="twitter:player" content={twitter.player} />
|
|
110
|
+
{/if}
|
|
111
|
+
{#if twitter.playerWidth}
|
|
112
|
+
<meta name="twitter:player:width" content={twitter.playerWidth.toString()} />
|
|
113
|
+
{/if}
|
|
114
|
+
{#if twitter.playerHeight}
|
|
115
|
+
<meta name="twitter:player:height" content={twitter.playerHeight.toString()} />
|
|
116
|
+
{/if}
|
|
117
|
+
{#if twitter.playerStream}
|
|
118
|
+
<meta name="twitter:player:stream" content={twitter.playerStream} />
|
|
119
|
+
{/if}
|
|
120
|
+
{#if twitter.appNameIphone}
|
|
121
|
+
<meta name="twitter:app:name:iphone" content={twitter.appNameIphone} />
|
|
122
|
+
{/if}
|
|
123
|
+
{#if twitter.appIdIphone}
|
|
124
|
+
<meta name="twitter:app:id:iphone" content={twitter.appIdIphone} />
|
|
125
|
+
{/if}
|
|
126
|
+
{#if twitter.appUrlIphone}
|
|
127
|
+
<meta name="twitter:app:url:iphone" content={twitter.appUrlIphone} />
|
|
128
|
+
{/if}
|
|
129
|
+
{#if twitter.appNameIpad}
|
|
130
|
+
<meta name="twitter:app:name:ipad" content={twitter.appNameIpad} />
|
|
131
|
+
{/if}
|
|
132
|
+
{#if twitter.appIdIpad}
|
|
133
|
+
<meta name="twitter:app:id:ipad" content={twitter.appIdIpad} />
|
|
134
|
+
{/if}
|
|
135
|
+
{#if twitter.appUrlIpad}
|
|
136
|
+
<meta name="twitter:app:url:ipad" content={twitter.appUrlIpad} />
|
|
137
|
+
{/if}
|
|
138
|
+
{#if twitter.appNameGoogleplay}
|
|
139
|
+
<meta name="twitter:app:name:googleplay" content={twitter.appNameGoogleplay} />
|
|
140
|
+
{/if}
|
|
141
|
+
{#if twitter.appIdGoogleplay}
|
|
142
|
+
<meta name="twitter:app:id:googleplay" content={twitter.appIdGoogleplay} />
|
|
143
|
+
{/if}
|
|
144
|
+
{#if twitter.appUrlGoogleplay}
|
|
145
|
+
<meta name="twitter:app:url:googleplay" content={twitter.appUrlGoogleplay} />
|
|
146
|
+
{/if}
|
|
90
147
|
{/if}
|
|
91
148
|
|
|
92
149
|
{#if facebook}
|
|
@@ -278,7 +335,7 @@ $: if (!robots && additionalRobotsProps) {
|
|
|
278
335
|
|
|
279
336
|
{#if additionalMetaTags && Array.isArray(additionalMetaTags)}
|
|
280
337
|
{#each additionalMetaTags as tag}
|
|
281
|
-
<meta {...tag} />
|
|
338
|
+
<meta {...tag.httpEquiv ? { ...tag, 'http-equiv': tag.httpEquiv } : tag} />
|
|
282
339
|
{/each}
|
|
283
340
|
{/if}
|
|
284
341
|
|
|
@@ -1,30 +1,3 @@
|
|
|
1
|
-
import { SvelteComponentTyped } from "svelte";
|
|
2
1
|
import type { MetaTagsProps } from './types';
|
|
3
|
-
declare const
|
|
4
|
-
|
|
5
|
-
title?: MetaTagsProps["title"];
|
|
6
|
-
titleTemplate?: MetaTagsProps["titleTemplate"];
|
|
7
|
-
robots?: MetaTagsProps["robots"];
|
|
8
|
-
additionalRobotsProps?: MetaTagsProps["additionalRobotsProps"];
|
|
9
|
-
description?: MetaTagsProps["description"];
|
|
10
|
-
mobileAlternate?: MetaTagsProps["mobileAlternate"];
|
|
11
|
-
languageAlternates?: MetaTagsProps["languageAlternates"];
|
|
12
|
-
twitter?: MetaTagsProps["twitter"];
|
|
13
|
-
facebook?: MetaTagsProps["facebook"];
|
|
14
|
-
openGraph?: MetaTagsProps["openGraph"];
|
|
15
|
-
canonical?: MetaTagsProps["canonical"];
|
|
16
|
-
keywords?: MetaTagsProps["keywords"];
|
|
17
|
-
additionalMetaTags?: MetaTagsProps["additionalMetaTags"];
|
|
18
|
-
additionalLinkTags?: MetaTagsProps["additionalLinkTags"];
|
|
19
|
-
};
|
|
20
|
-
events: {
|
|
21
|
-
[evt: string]: CustomEvent<any>;
|
|
22
|
-
};
|
|
23
|
-
slots: {};
|
|
24
|
-
};
|
|
25
|
-
type MetaTagsProps_ = typeof __propDef.props;
|
|
26
|
-
export { MetaTagsProps_ as MetaTagsProps };
|
|
27
|
-
export type MetaTagsEvents = typeof __propDef.events;
|
|
28
|
-
export type MetaTagsSlots = typeof __propDef.slots;
|
|
29
|
-
export default class MetaTags extends SvelteComponentTyped<MetaTagsProps_, MetaTagsEvents, MetaTagsSlots> {
|
|
30
|
-
}
|
|
2
|
+
declare const MetaTags: import("svelte").Component<Partial<MetaTagsProps>, {}, "">;
|
|
3
|
+
export default MetaTags;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function deepMerge(target: any, source: any): any;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
2
|
+
export function deepMerge(target, source) {
|
|
3
|
+
const sourceKeys = Object.keys(source);
|
|
4
|
+
for (let i = 0; i < sourceKeys.length; i++) {
|
|
5
|
+
const key = sourceKeys[i];
|
|
6
|
+
const sourceValue = source[key];
|
|
7
|
+
const targetValue = target[key];
|
|
8
|
+
if (Array.isArray(sourceValue)) {
|
|
9
|
+
if (Array.isArray(targetValue)) {
|
|
10
|
+
target[key] = deepMerge(targetValue, sourceValue);
|
|
11
|
+
}
|
|
12
|
+
else {
|
|
13
|
+
target[key] = deepMerge([], sourceValue);
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
else if (isPlainObject(sourceValue)) {
|
|
17
|
+
if (isPlainObject(targetValue)) {
|
|
18
|
+
target[key] = deepMerge(targetValue, sourceValue);
|
|
19
|
+
}
|
|
20
|
+
else {
|
|
21
|
+
target[key] = deepMerge({}, sourceValue);
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
else if (targetValue === undefined || sourceValue !== undefined) {
|
|
25
|
+
target[key] = sourceValue;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
return target;
|
|
29
|
+
}
|
|
30
|
+
function isPlainObject(object) {
|
|
31
|
+
if (typeof object !== 'object' || object === null) {
|
|
32
|
+
return false;
|
|
33
|
+
}
|
|
34
|
+
const proto = Object.getPrototypeOf(object);
|
|
35
|
+
return proto === Object.prototype || proto === null;
|
|
36
|
+
}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
export { default as MetaTags } from './MetaTags.svelte';
|
|
2
2
|
export { default as JsonLd } from './JsonLd.svelte';
|
|
3
|
+
export { deepMerge } from './deepMerge';
|
|
3
4
|
export type { MetaTagsProps, JsonLdProps, AdditionalRobotsProps, MobileAlternate, LanguageAlternate, Twitter, Facebook, OpenGraph, MetaTag, LinkTag } from './types';
|
package/dist/index.js
CHANGED
package/dist/types.d.ts
CHANGED
|
@@ -21,14 +21,32 @@ export interface AdditionalRobotsProps {
|
|
|
21
21
|
notranslate?: boolean;
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
+
/**
|
|
25
|
+
* Twitter card types
|
|
26
|
+
* @see https://developer.x.com/en/docs/x-for-websites/cards/overview/markup
|
|
27
|
+
*/
|
|
24
28
|
export interface Twitter {
|
|
25
29
|
cardType?: 'summary' | 'summary_large_image' | 'app' | 'player';
|
|
26
30
|
site?: string;
|
|
27
|
-
handle?: string;
|
|
28
31
|
title?: string;
|
|
29
32
|
description?: string;
|
|
33
|
+
creator?: string;
|
|
34
|
+
creatorId?: string;
|
|
30
35
|
image?: string;
|
|
31
36
|
imageAlt?: string;
|
|
37
|
+
player?: string;
|
|
38
|
+
playerWidth?: number;
|
|
39
|
+
playerHeight?: number;
|
|
40
|
+
playerStream?: string;
|
|
41
|
+
appNameIphone?: string;
|
|
42
|
+
appIdIphone?: string;
|
|
43
|
+
appUrlIphone?: string;
|
|
44
|
+
appNameIpad?: string;
|
|
45
|
+
appIdIpad?: string;
|
|
46
|
+
appUrlIpad?: string;
|
|
47
|
+
appNameGoogleplay?: string;
|
|
48
|
+
appIdGoogleplay?: string;
|
|
49
|
+
appUrlGoogleplay?: string;
|
|
32
50
|
}
|
|
33
51
|
|
|
34
52
|
export interface Facebook {
|
|
@@ -145,9 +163,35 @@ export interface LinkTag {
|
|
|
145
163
|
sizes?: string;
|
|
146
164
|
type?: string;
|
|
147
165
|
color?: string;
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
166
|
+
imagesrcset?: string;
|
|
167
|
+
imagesizes?: string;
|
|
168
|
+
integrity?: string;
|
|
169
|
+
as?:
|
|
170
|
+
| 'fetch'
|
|
171
|
+
| 'audio'
|
|
172
|
+
| 'audioworklet'
|
|
173
|
+
| 'document'
|
|
174
|
+
| 'embed'
|
|
175
|
+
| 'font'
|
|
176
|
+
| 'frame'
|
|
177
|
+
| 'iframe'
|
|
178
|
+
| 'image'
|
|
179
|
+
| 'json'
|
|
180
|
+
| 'manifest'
|
|
181
|
+
| 'object'
|
|
182
|
+
| 'paintworklet'
|
|
183
|
+
| 'report'
|
|
184
|
+
| 'script'
|
|
185
|
+
| 'serviceworker'
|
|
186
|
+
| 'sharedworker'
|
|
187
|
+
| 'style'
|
|
188
|
+
| 'track'
|
|
189
|
+
| 'video'
|
|
190
|
+
| 'webidentity'
|
|
191
|
+
| 'worker'
|
|
192
|
+
| 'xslt';
|
|
193
|
+
crossOrigin?: 'anonymous' | 'use-credentials';
|
|
194
|
+
referrerPolicy?: ReferrerPolicy;
|
|
151
195
|
}
|
|
152
196
|
|
|
153
197
|
export interface MetaTagsProps {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "svelte-meta-tags",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "4.0.0",
|
|
4
4
|
"description": "Svelte Meta Tags provides components designed to help you manage SEO for Svelte projects",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -15,25 +15,27 @@
|
|
|
15
15
|
],
|
|
16
16
|
"repository": {
|
|
17
17
|
"type": "git",
|
|
18
|
-
"url": "https://github.com/oekazuma/svelte-meta-tags"
|
|
18
|
+
"url": "git+https://github.com/oekazuma/svelte-meta-tags.git",
|
|
19
|
+
"directory": "packages/svelte-meta-tags"
|
|
19
20
|
},
|
|
20
21
|
"dependencies": {
|
|
21
22
|
"schema-dts": "^1.1.2"
|
|
22
23
|
},
|
|
23
24
|
"devDependencies": {
|
|
24
|
-
"@sveltejs/adapter-auto": "^3.
|
|
25
|
-
"@sveltejs/kit": "^2.
|
|
26
|
-
"@sveltejs/package": "^2.3.
|
|
27
|
-
"@sveltejs/vite-plugin-svelte": "^
|
|
28
|
-
"publint": "^0.2.
|
|
29
|
-
"svelte": "^
|
|
30
|
-
"svelte-check": "^
|
|
31
|
-
"tslib": "^2.
|
|
32
|
-
"typescript": "^5.
|
|
33
|
-
"vite": "^5.4.
|
|
25
|
+
"@sveltejs/adapter-auto": "^3.3.0",
|
|
26
|
+
"@sveltejs/kit": "^2.7.2",
|
|
27
|
+
"@sveltejs/package": "^2.3.6",
|
|
28
|
+
"@sveltejs/vite-plugin-svelte": "^4.0.0",
|
|
29
|
+
"publint": "^0.2.11",
|
|
30
|
+
"svelte": "^5.0.5",
|
|
31
|
+
"svelte-check": "^4.0.5",
|
|
32
|
+
"tslib": "^2.8.0",
|
|
33
|
+
"typescript": "^5.6.3",
|
|
34
|
+
"vite": "^5.4.10",
|
|
35
|
+
"vitest": "^2.1.3"
|
|
34
36
|
},
|
|
35
37
|
"peerDependencies": {
|
|
36
|
-
"svelte": "^
|
|
38
|
+
"svelte": "^5.0.0"
|
|
37
39
|
},
|
|
38
40
|
"exports": {
|
|
39
41
|
"./JsonLd.svelte": {
|
|
@@ -60,6 +62,7 @@
|
|
|
60
62
|
"preview": "vite preview",
|
|
61
63
|
"package": "svelte-kit sync && svelte-package && publint",
|
|
62
64
|
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
|
|
63
|
-
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch"
|
|
65
|
+
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
|
|
66
|
+
"test": "vitest run"
|
|
64
67
|
}
|
|
65
68
|
}
|