Merge branch 'dev' of https://github.com/skeletonlabs/skeleton into dev

skeletonlabs · Apr 25, 2023 · df01ba8 · df01ba8
2 parents 1aacddc + 3aafc22
commit df01ba8
Show file tree

Hide file tree

Showing 8 changed files with 17 additions and 9 deletions.
diff --git a/package.json b/package.json
@@ -100,7 +100,6 @@
 		"./src/lib/themes/*",
 		"!./dist/**/*.test.*"
 	],
-	"svelte": "./dist/index.js",
 	"typesVersions": {
 		">4.0": {
 			"index": [

diff --git a/src/docs/layouts/DocsShell/DocsShell.svelte b/src/docs/layouts/DocsShell/DocsShell.svelte
@@ -11,13 +11,13 @@
 	// Partials
 	import Header from '$docs/layouts/DocsShell/partials/Header.svelte';
 	import PanelProps from '$docs/layouts/DocsShell/partials/PanelProps.svelte';
-	import PanelParams from './partials/PanelParams.svelte';
-	import PanelSlots from './partials/PanelSlots.svelte';
 	import PanelClasses from './partials/PanelClasses.svelte';
 	import PanelEvents from './partials/PanelEvents.svelte';
 	import PanelKeyboard from './partials/PanelKeyboard.svelte';
+	import PanelParams from './partials/PanelParams.svelte';
+	import PanelSlots from './partials/PanelSlots.svelte';
 	// Utilities
-	import { docSellDefaults } from '$docs/layouts/DocsShell/defaults';
+	import { docShellDefaults } from '$docs/layouts/DocsShell/defaults';
 
 	// Props
 	export let settings: DocsShellSettings;
@@ -34,7 +34,7 @@
 	// Page Data
 	const pageData: DocsShellSettings = {
 		// Define defaults first
-		...docSellDefaults,
+		...docShellDefaults,
 		// Local Overrides
 		...{ docsPath: $page.url.pathname },
 		// Prop Settings Values

diff --git a/src/docs/layouts/DocsShell/defaults.ts b/src/docs/layouts/DocsShell/defaults.ts
@@ -1,6 +1,6 @@
 import { DocsFeature, type DocsShellSettings } from '$docs/layouts/DocsShell/types';
 
-export let docSellDefaults: DocsShellSettings = {
+export let docShellDefaults: DocsShellSettings = {
 	// Heading
 	feature: DocsFeature.Component,
 	name: '(name)',

diff --git a/src/lib/components/InputChip/InputChip.svelte b/src/lib/components/InputChip/InputChip.svelte
@@ -157,6 +157,8 @@
 				class="input-chip-field {classesInputField}"
 				on:input={onInputHandler}
 				on:input
+				on:focus
+				on:blur
 				disabled={$$restProps.disabled}
 			/>
 		</form>

diff --git a/src/lib/styles/core.css b/src/lib/styles/core.css
@@ -28,6 +28,7 @@
 
 	::-webkit-scrollbar {
 		@apply w-2;
+		@apply h-2;
 	}
 	::-webkit-scrollbar-track {
 		@apply !bg-surface-50-900-token px-[1px];

diff --git a/src/routes/(inner)/docs/introduction/+page.svelte b/src/routes/(inner)/docs/introduction/+page.svelte
@@ -29,7 +29,7 @@
 
 	<iframe
 		class="w-full aspect-video mx-auto rounded-container-token shadow"
-		src="https://www.youtube.com/embed/2OnJYCXJPK4"
+		src="https://www.youtube.com/embed/P_A0qQ7AuK8"
 		title="YouTube video player"
 		frameborder="0"
 		allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"

diff --git a/src/routes/(inner)/docs/tokens/+page.svelte b/src/routes/(inner)/docs/tokens/+page.svelte
@@ -64,8 +64,8 @@
 	const tableText: TableSource = {
 		head: headings,
 		body: [
-			['<code>.font-heading-token</code>', '', "Implements your theme's configured heading text size."],
-			['<code>.font-token</code>', '', "Implements your theme's configured base text size."],
+			['<code>.font-heading-token</code>', '', "Implements your theme's configured heading font family."],
+			['<code>.font-token</code>', '', "Implements your theme's configured base font family."],
 			['<code>.text-token</code>', '', "Implements your theme's configured base text color."],
 			['<code>.text-on-[color]-token</code>', vColorsAll, 'Provides an accessible foreground color.'],
 			['<code>.text-[color]-[pairings]-token</code>', `${vColorsAll}<br>${vPairings}`, descPairings]

diff --git a/src/routes/(inner)/utilities/toasts/+page.svelte b/src/routes/(inner)/utilities/toasts/+page.svelte
@@ -275,6 +275,12 @@ const t: ToastSettings = {
 					/>
 				</svelte:fragment>
 			</DocsPreview>
+			<h3>Positioning</h3>
+			<p>
+				Skeleton takes an opinionated stance on positioning, preferring to keep toast notifications in fixed location on your page. This
+				position can be modified globally the <code>position</code> property on the Toast component. However, we do not allow you to modify this
+				per toast instance as we feel this would provide inconsistent UX.
+			</p>
 		</section>
 		<section class="space-y-4">
 			<h2>Callbacks</h2>