({
+ key: 'svelteColor',
+ description: 'Use the Svelte color for the headline', // optional
+ origin: 'https://example.com/#svelteColor', // optional
+ options: [{ value: true }, { value: false }], // optional
+ // can be async and has access to the event
+ decide(event) {
+ // Very simple example to show how to use the URL to determine the flag.
+ // In real live you would probably query an external source such as
+ // Vercel Edge Config (https://vercel.com/docs/storage/edge-config)
+ return event.url.searchParams.has('svelteColor')
+ },
+})
diff --git a/toolbar/toolbar-feature-flags-sveltekit/src/lib/index.ts b/toolbar/toolbar-feature-flags-sveltekit/src/lib/index.ts
new file mode 100644
index 0000000000..856f2b6c38
--- /dev/null
+++ b/toolbar/toolbar-feature-flags-sveltekit/src/lib/index.ts
@@ -0,0 +1 @@
+// place files you want to import through the `$lib` alias in this folder.
diff --git a/toolbar/toolbar-feature-flags-sveltekit/src/routes/+layout.svelte b/toolbar/toolbar-feature-flags-sveltekit/src/routes/+layout.svelte
new file mode 100644
index 0000000000..4d10d3aee5
--- /dev/null
+++ b/toolbar/toolbar-feature-flags-sveltekit/src/routes/+layout.svelte
@@ -0,0 +1,45 @@
+
+
+
+
+
+
+
+
diff --git a/toolbar/toolbar-feature-flags-sveltekit/src/routes/+page.server.ts b/toolbar/toolbar-feature-flags-sveltekit/src/routes/+page.server.ts
new file mode 100644
index 0000000000..2acd4cc973
--- /dev/null
+++ b/toolbar/toolbar-feature-flags-sveltekit/src/routes/+page.server.ts
@@ -0,0 +1,8 @@
+import { svelteColor } from '$lib/flags'
+
+export async function load() {
+ return {
+ // Requests the feature flag and returns its value
+ svelteColor: await svelteColor(),
+ }
+}
diff --git a/toolbar/toolbar-feature-flags-sveltekit/src/routes/+page.svelte b/toolbar/toolbar-feature-flags-sveltekit/src/routes/+page.svelte
new file mode 100644
index 0000000000..87819786ff
--- /dev/null
+++ b/toolbar/toolbar-feature-flags-sveltekit/src/routes/+page.svelte
@@ -0,0 +1,82 @@
+
+
+SvelteKit + Vercel Feature Flags
+
+
+ SvelteKit offers seamless integration with the Vercel Toolbar
+ and
+ Feature Flags.
+
+
+ This page's headline can take a different color depending on the value of a
+ feature flag.
+
+
+
+ For demo purposes the feature flag depends on a URL query parameter, so you
+ can toggle it from the browser. When you clone the example and link it to a
+ project on Vercel, you can use the Vercel toolbar to override the feature flag
+ value.
+
+
+
diff --git a/toolbar/toolbar-feature-flags-sveltekit/src/routes/Footer.svelte b/toolbar/toolbar-feature-flags-sveltekit/src/routes/Footer.svelte
new file mode 100644
index 0000000000..c3e2fe11b1
--- /dev/null
+++ b/toolbar/toolbar-feature-flags-sveltekit/src/routes/Footer.svelte
@@ -0,0 +1,149 @@
+
+
+
diff --git a/toolbar/toolbar-feature-flags-sveltekit/static/favicon.png b/toolbar/toolbar-feature-flags-sveltekit/static/favicon.png
new file mode 100644
index 0000000000000000000000000000000000000000..825b9e65af7c104cfb07089bb28659393b4f2097
GIT binary patch
literal 1571
zcmV+;2Hg3HP)Px)-AP12RCwC$UE6KzI1p6{F2N
z1VK2vi|pOpn{~#djwYcWXTI_im_u^TJgMZ4JMOsSj!0ma>B?-(Hr@X&W@|R-$}W@Z
zgj#$x=!~7LGqHW?IO8+*oE1MyDp!G=L0#^lUx?;!fXv@l^6SvTnf^ac{5OurzC#ZMYc20lI%HhX816AYVs1T3heS1*WaWH
z%;x>)-J}YB5#CLzU@GBR6sXYrD>Vw(Fmt#|JP;+}<#6b63Ike{Fuo!?M{yEffez;|
zp!PfsuaC)>h>-AdbnwN13g*1LowNjT5?+lFVd#9$!8Z9HA|$*6dQ8EHLu}U|obW6f
z2%uGv?vr=KNq7YYa2Roj;|zooo<)lf=&2yxM@e`kM$CmCR#x>gI>I|*Ubr({5Y^rb
zghxQU22N}F51}^yfDSt786oMTc!W&V;d?76)9KXX1
z+6Okem(d}YXmmOiZq$!IPk5t8nnS{%?+vDFz3BevmFNgpIod~R{>@#@5x9zJKEHLHv!gHeK~n)Ld!M8DB|Kfe%~123&Hz1Z(86nU7*G5chmyDe
ziV7$pB7pJ=96hpxHv9rCR29%bLOXlKU<_13_M8x)6;P8E1Kz6G<&P?$P^%c!M5`2`
zfY2zg;VK5~^>TJGQzc+33-n~gKt{{of8GzUkWmU110IgI0DLxRIM>0US|TsM=L|@F
z0Bun8U!cRB7-2apz=y-7*UxOxz@Z0)@QM)9wSGki1AZ38ceG7Q72z5`i;i=J`ILzL
z@iUO?SBBG-0cQuo+an4TsLy-g-x;8P4UVwk|D8{W@U1Zi
z!M)+jqy@nQ$p?5tsHp-6J304Q={v-B>66$P0IDx&YT(`IcZ~bZfmn11#rXd7<5s}y
zBi9eim&zQc0Dk|2>$bs0PnLmDfMP5lcXRY&cvJ=zKxI^f0%-d$tD!`LBf9^jMSYUA
zI8U?CWdY@}cRq6{5~y+)#h1!*-HcGW@+gZ4B};0OnC~`xQOyH19z*TA!!BJ%9s0V3F?CAJ{hTd#*tf+ur-W9MOURF-@B77_-OshsY}6
zOXRY=5%C^*26z?l)1=$bz30!so5tfABdSYzO+H=CpV~aaUefmjvfZ3Ttu9W&W3Iu6
zROlh0MFA5h;my}8lB0tAV-Rvc2Zs_CCSJnx@d`**$idgy-iMob4dJWWw|21b4NB=LfsYp0Aeh{Ov)yztQi;eL4y5
zMi>8^SzKqk8~k?UiQK^^-5d8c%bV?$F8%X~czyiaKCI2=UH