@lavalogic/scoria 0.38.15 → 0.39.0

package/README.md

@@ -1,58 +1,58 @@
-# Svelte library
-
-Everything you need to build a Svelte library, powered by [`sv`](https://npmjs.com/package/sv).
-
-Read more about creating a library [in the docs](https://svelte.dev/docs/kit/packaging).
-
-## Creating a project
-
-If you're seeing this, you've probably already done this step. Congrats!
-
-```sh
-# create a new project in the current directory
-npx sv create
-
-# create a new project in my-app
-npx sv create my-app
-```
-
-## Developing
-
-Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
-
-```sh
-npm run dev
-
-# or start the server and open the app in a new browser tab
-npm run dev -- --open
-```
-
-Everything inside `src/lib` is part of your library, everything inside `src/routes` can be used as a showcase or preview app.
-
-## Building
-
-To build your library:
-
-```sh
-npm pack
-```
-
-To create a production version of your showcase app:
-
-```sh
-npm run build
-```
-
-You can preview the production build with `npm run preview`.
-
-> To deploy your app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment.
-
-## Publishing
-
-Go into the `package.json` and give your package the desired name through the `"name"` option. Also consider adding a `"license"` field and point it to a `LICENSE` file which you can create from a template (one popular option is the [MIT license](https://opensource.org/license/mit/)).
-
-To publish your library to [npm](https://www.npmjs.com):
-
-```sh
-npm publish
-```
+# Svelte library
+
+Everything you need to build a Svelte library, powered by [`sv`](https://npmjs.com/package/sv).
+
+Read more about creating a library [in the docs](https://svelte.dev/docs/kit/packaging).
+
+## Creating a project
+
+If you're seeing this, you've probably already done this step. Congrats!
+
+```sh
+# create a new project in the current directory
+npx sv create
+
+# create a new project in my-app
+npx sv create my-app
+```
+
+## Developing
+
+Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
+
+```sh
+npm run dev
+
+# or start the server and open the app in a new browser tab
+npm run dev -- --open
+```
+
+Everything inside `src/lib` is part of your library, everything inside `src/routes` can be used as a showcase or preview app.
+
+## Building
+
+To build your library:
+
+```sh
+npm pack
+```
+
+To create a production version of your showcase app:
+
+```sh
+npm run build
+```
+
+You can preview the production build with `npm run preview`.
+
+> To deploy your app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment.
+
+## Publishing
+
+Go into the `package.json` and give your package the desired name through the `"name"` option. Also consider adding a `"license"` field and point it to a `LICENSE` file which you can create from a template (one popular option is the [MIT license](https://opensource.org/license/mit/)).
+
+To publish your library to [npm](https://www.npmjs.com):
+
+```sh
+npm publish
+```

package/dist/Components/AppointmentCalendar/AppointmentCalendar.svelte

@@ -229,7 +229,12 @@
 	let dragStartSlotIndex: number | null = $state(null);
 	let dragEndSlotIndex: number | null = $state(null);
 
-	function onSlotMouseDown(doorId: number, slotIndex: number): void {
+	function onSlotMouseDown(doorId: number, slotIndex: number, e: MouseEvent): void {
+		// Only start a drag-create on the primary (left) button. Otherwise a
+		// middle-click (autoscroll) or right-click would open the create modal.
+		if (e.button !== 0) {
+			return;
+		}
 		if (!ondragcreate || appointmentDragStarted) {
 			return;
 		}
@@ -371,6 +376,11 @@
 	let moveTargetSlotIndex: number | null = $state(null);
 
 	function onAppointmentMouseDown(apt: CalendarAppointment, e: MouseEvent): void {
+		// Only react to the primary (left) button so middle/right clicks don't
+		// start a move or register as an appointment click.
+		if (e.button !== 0) {
+			return;
+		}
 		if (!onappointmentmove) {
 			return;
 		}
@@ -664,8 +674,8 @@
 						class:drag-selected={isSlotInDragRange(door.id, slotIdx)}
 						class:move-target={isSlotInMoveTarget(door.id, slotIdx)}
 						class:row-hover={hoveredSlotIndex === slotIdx}
-						onmousedown={() => {
-							onSlotMouseDown(door.id, slotIdx);
+						onmousedown={(e) => {
+							onSlotMouseDown(door.id, slotIdx, e);
 						}}
 						onmouseenter={() => {
 							hoveredSlotIndex = slotIdx;

package/dist/Components/Table/Types/DataRepository/BuiltInRemoteRepository.svelte.d.ts

@@ -131,6 +131,14 @@ export declare class CustomRemoteRepository<TRow extends object> extends TableDa
     readonly setFilterMode: (id: string, mode: FilterMode | undefined) => void;
     readonly filterBy: (id: string, value: unknown) => void;
     readonly resetFilters: () => void;
+    /**
+     * Reset the current page to page 1 without touching `pageSize`. Used
+     * by every filter-mutation entrypoint so a fresh filter never leaves
+     * the user stranded on a page index that no longer exists once the
+     * remote re-query returns a smaller result set. Mirror of the helper
+     * on `BuiltInRemoteRepository`.
+     */
+    private resetToFirstPage;
     /** Jumps to the given 1-based page number, clamped at >= 1. */
     readonly setPage: (page: number) => void;
     /** Advances to the next page. */

package/dist/Components/Table/Types/DataRepository/BuiltInRemoteRepository.svelte.js

@@ -403,6 +403,7 @@ export class CustomRemoteRepository extends TableDataRepository {
         else {
             this._filterModes.set(id, mode);
         }
+        this.resetToFirstPage();
         void this.reload();
     };
     filterBy = (id, value) => {
@@ -423,12 +424,34 @@ export class CustomRemoteRepository extends TableDataRepository {
             }
         }
         this._filtering = next;
+        // Any filter change should drop the user back on page 1; otherwise
+        // when typing in a filter while on page 2+ the new (smaller) result
+        // set leaves the pagination on an out-of-range page index. The user
+        // then sees "1 row" in the footer but the body is blank because
+        // the request still asks for `page=3` of a 1-page result set.
+        this.resetToFirstPage();
         void this.reload();
     };
     resetFilters = () => {
         this._filtering = [];
+        this.resetToFirstPage();
         void this.reload();
     };
+    /**
+     * Reset the current page to page 1 without touching `pageSize`. Used
+     * by every filter-mutation entrypoint so a fresh filter never leaves
+     * the user stranded on a page index that no longer exists once the
+     * remote re-query returns a smaller result set. Mirror of the helper
+     * on `BuiltInRemoteRepository`.
+     */
+    resetToFirstPage() {
+        if (this.paginationState.pageIndex !== 0) {
+            this.paginationState = {
+                ...this.paginationState,
+                pageIndex: 0,
+            };
+        }
+    }
     /** Jumps to the given 1-based page number, clamped at >= 1. */
     setPage = (page) => {
         this.paginationState = {

package/dist/Components/Test/TestContextConsumer.svelte

@@ -1,13 +1,13 @@
-<svelte:options runes />
-
-<script lang="ts">
-	import { TestContext } from '../../Contexts/TestContext.svelte.js';
-	import { getContext } from 'svelte';
-
-	const testContext = getContext<TestContext>(TestContext.identifier);
-</script>
-
-<h1>counter 1: {testContext.value1.value}</h1>
-<p>Ref wrapper 1 is incremented every time you click the button</p>
-<h2>counter 2: {testContext.value2.value}</h2>
-<p>ref wrapper 2 adds ref wrapper 1's value every time ref wrapper 1's value is divisible by 3</p>
+<svelte:options runes />
+
+<script lang="ts">
+	import { TestContext } from '../../Contexts/TestContext.svelte.js';
+	import { getContext } from 'svelte';
+
+	const testContext = getContext<TestContext>(TestContext.identifier);
+</script>
+
+<h1>counter 1: {testContext.value1.value}</h1>
+<p>Ref wrapper 1 is incremented every time you click the button</p>
+<h2>counter 2: {testContext.value2.value}</h2>
+<p>ref wrapper 2 adds ref wrapper 1's value every time ref wrapper 1's value is divisible by 3</p>

package/dist/scss/_basics.scss

@@ -1,12 +1,12 @@
-@use './colours.scss';
-
-//border
-$border: solid 1px colours.$ui-blue-4;
-$border-mid: solid 2px colours.$ui-blue-4;
-$border-thick: solid 3px colours.$ui-blue-4;
-
-//box-shadow
-$table-focus: 0px 0px 1px 1px colours.$brand-primary inset;
-
-$box-shadow: 0px 0px 5px 0px #0002;
-$error-box-shadow: 0px 0px 5px 0px #aa141422;
+@use './colours.scss';
+
+//border
+$border: solid 1px colours.$ui-blue-4;
+$border-mid: solid 2px colours.$ui-blue-4;
+$border-thick: solid 3px colours.$ui-blue-4;
+
+//box-shadow
+$table-focus: 0px 0px 1px 1px colours.$brand-primary inset;
+
+$box-shadow: 0px 0px 5px 0px #0002;
+$error-box-shadow: 0px 0px 5px 0px #aa141422;

package/dist/scss/_colours.scss

@@ -1,134 +1,134 @@
-$transparent-0: rgba(0, 0, 0, 0);
-$transparent-10: rgba(0, 0, 0, 0.1);
-$transparent-20: rgba(0, 0, 0, 0.2);
-
-$ui-black: #000000;
-$ui-white: #ffffff;
-$purple: #9b51e0; // For Testing
-
-$ui-blue-1: #f4f7f9;
-$ui-blue-2: #e9ecf1;
-$ui-blue-3: #dae0e5;
-$ui-blue-4: #cbd4da; // Standard Border Colour
-$ui-blue-5: #bcc8d0;
-$ui-blue-6: #adbbc5;
-$ui-blue-7: #9eafba;
-$ui-blue-8: #8fa3b0;
-$ui-blue-9: #8096a5; // Font Disabled
-$ui-blue-10: #718a9b;
-$ui-blue-11: #647d8e; // Font Secondary
-$ui-blue-12: #5a707f;
-$ui-blue-13: #4f6370;
-$ui-blue-14: #455661;
-$ui-blue-15: #3a4952; // Font Primary
-$ui-blue-16: #2f3b43;
-$ui-blue-17: #252e34;
-$ui-blue-18: #1a2125;
-$ui-blue-19: #101416;
-$ui-blue-20: #050707;
-
-$primary-blue-1: #f4fbfd;
-$primary-blue-2: #e6f8fd;
-$primary-blue-3: #caeaf5;
-$primary-blue-4: #b4e2f0;
-$primary-blue-5: #9fdaec;
-$primary-blue-6: #8ad1e8;
-$primary-blue-7: #74c9e4;
-$primary-blue-8: #5fc1e0;
-$primary-blue-9: #49b8dc;
-$primary-blue-10: #34b0d8;
-$primary-blue-11: #259fc7; // Brand Primary
-$primary-blue-12: #2392b5;
-$primary-blue-13: #1f81a0; // Brand Dark
-$primary-blue-14: #1b708b;
-$primary-blue-15: #175f75;
-$primary-blue-16: #134d60;
-$primary-blue-17: #0f3c4b;
-$primary-blue-18: #0a2b35;
-$primary-blue-19: #061a20;
-$primary-blue-20: #02090b;
-
-$primary-background: #edfaff;
-$brand-primary: #259fc7;
-$brand-dark: #1f81a0;
-$brand-dark-transparent-20: rgba(31, 129, 160, 0.2);
-$brand-dark-transparent-40: rgba(31, 129, 160, 0.4);
-
-$font-primary: #3a4952;
-$font-secondary-heading: #46525b;
-$font-secondary: #647d8e;
-$font-disabled: #8096a5;
-
-$error: #c31818;
-$error-border: #aa1414;
-$error-background: #f9e9e9;
-$warning: #f8eab8;
-$warning-border: #e7b500;
-
-$allocated-background: #e7b100;
-$in-picking-background: #ec58c3;
-$in-picking-colour: #720653;
-$picked-background: #bd2e95;
-$in-sorting-background: #b259ea;
-$in-sorting-colour: #560985;
-$sorted-background: #9032ca;
-$in-kitting-background: #9d85fc;
-$in-kitting-colour: #4129a4;
-$kitted-background: #6e51e0;
-$in-packing-background: #8ab1df;
-$in-packing-colour: #103977;
-$packed-background: #3e6eb5;
-$in-marshalling-background: #8ad0df;
-$in-marshalling-colour: #13758a;
-$marshalled-background: #3ea0b5;
-$in-loading-background: #8adfc8;
-$in-loading-colour: #126a51;
-$loaded-background: #3eb592;
-$in-despatch-background: #7bbc6f;
-$in-despatch-colour: #104c05;
-$despatched-background: #2f921d;
-
-// Borders are $ui-blue-4
-
-// $ui-two: #ececec;
-// $ui-three: #c0c0c0;
-// $ui-four: #515b65;
-// $ui-four: #9B51E0;
-// $ui-seven: #d5dbe0;
-// $ui-eight: #fcfcfc;
-// $ui-grey: #c0c8ce;
-// $main: #54636d;
-$alt: #8f989e;
-// $background-light: #dce1e5;
-// $background: #f6f7f8;
-// $background-dark: #e8ebed;
-// $dark-blue: #3888c1;
-// $primary: #2f97ba;
-// $info-text: #0e82ae;
-// $info-light-text: #6ac1e8;
-// $primary-dark: #0e7598;
-// $primary-hover: hsl(205, 55%, 35%);
-// $brand-one: #4db0da;
-// $brand-two: #18769d;
-// $shipments: #129acd;
-// $progress: #259abf;
-
-// $dark-blue-transparent: rgba(56, 136, 193, 0.2);
-// $dark-blue-semi-transparent: rgba(56, 136, 193, 0.4);
-// $secondary: #4f5a63;
-// $info-background: #d6effa;
-// $info-light-background: #f3f9fb;
-// $hovered: rgba(166, 167, 168, 0.369);
-// $white: #fff;
-// $light-border: #ced2d6;
-// $state-info: #e8f6fd;
-// $state-info--alt: #f9fdff;
-// $ui-dark-opacity: rgba(0, 0, 0, 0.2);
-// $info-text-text: #525252;
-// $info-text-background: #f6fcfe;
-// $marked: #e8f6fd;
-// $marked: #f9fdff;
-// $side-menu-background: #eef1f3;
-// $label: #6d7883;
-// $warehouse-bubble: #c3cad3;
-// $warning: rgba(231, 181, 0, 0.228);
+$transparent-0: rgba(0, 0, 0, 0);
+$transparent-10: rgba(0, 0, 0, 0.1);
+$transparent-20: rgba(0, 0, 0, 0.2);
+
+$ui-black: #000000;
+$ui-white: #ffffff;
+$purple: #9b51e0; // For Testing
+
+$ui-blue-1: #f4f7f9;
+$ui-blue-2: #e9ecf1;
+$ui-blue-3: #dae0e5;
+$ui-blue-4: #cbd4da; // Standard Border Colour
+$ui-blue-5: #bcc8d0;
+$ui-blue-6: #adbbc5;
+$ui-blue-7: #9eafba;
+$ui-blue-8: #8fa3b0;
+$ui-blue-9: #8096a5; // Font Disabled
+$ui-blue-10: #718a9b;
+$ui-blue-11: #647d8e; // Font Secondary
+$ui-blue-12: #5a707f;
+$ui-blue-13: #4f6370;
+$ui-blue-14: #455661;
+$ui-blue-15: #3a4952; // Font Primary
+$ui-blue-16: #2f3b43;
+$ui-blue-17: #252e34;
+$ui-blue-18: #1a2125;
+$ui-blue-19: #101416;
+$ui-blue-20: #050707;
+
+$primary-blue-1: #f4fbfd;
+$primary-blue-2: #e6f8fd;
+$primary-blue-3: #caeaf5;
+$primary-blue-4: #b4e2f0;
+$primary-blue-5: #9fdaec;
+$primary-blue-6: #8ad1e8;
+$primary-blue-7: #74c9e4;
+$primary-blue-8: #5fc1e0;
+$primary-blue-9: #49b8dc;
+$primary-blue-10: #34b0d8;
+$primary-blue-11: #259fc7; // Brand Primary
+$primary-blue-12: #2392b5;
+$primary-blue-13: #1f81a0; // Brand Dark
+$primary-blue-14: #1b708b;
+$primary-blue-15: #175f75;
+$primary-blue-16: #134d60;
+$primary-blue-17: #0f3c4b;
+$primary-blue-18: #0a2b35;
+$primary-blue-19: #061a20;
+$primary-blue-20: #02090b;
+
+$primary-background: #edfaff;
+$brand-primary: #259fc7;
+$brand-dark: #1f81a0;
+$brand-dark-transparent-20: rgba(31, 129, 160, 0.2);
+$brand-dark-transparent-40: rgba(31, 129, 160, 0.4);
+
+$font-primary: #3a4952;
+$font-secondary-heading: #46525b;
+$font-secondary: #647d8e;
+$font-disabled: #8096a5;
+
+$error: #c31818;
+$error-border: #aa1414;
+$error-background: #f9e9e9;
+$warning: #f8eab8;
+$warning-border: #e7b500;
+
+$allocated-background: #e7b100;
+$in-picking-background: #ec58c3;
+$in-picking-colour: #720653;
+$picked-background: #bd2e95;
+$in-sorting-background: #b259ea;
+$in-sorting-colour: #560985;
+$sorted-background: #9032ca;
+$in-kitting-background: #9d85fc;
+$in-kitting-colour: #4129a4;
+$kitted-background: #6e51e0;
+$in-packing-background: #8ab1df;
+$in-packing-colour: #103977;
+$packed-background: #3e6eb5;
+$in-marshalling-background: #8ad0df;
+$in-marshalling-colour: #13758a;
+$marshalled-background: #3ea0b5;
+$in-loading-background: #8adfc8;
+$in-loading-colour: #126a51;
+$loaded-background: #3eb592;
+$in-despatch-background: #7bbc6f;
+$in-despatch-colour: #104c05;
+$despatched-background: #2f921d;
+
+// Borders are $ui-blue-4
+
+// $ui-two: #ececec;
+// $ui-three: #c0c0c0;
+// $ui-four: #515b65;
+// $ui-four: #9B51E0;
+// $ui-seven: #d5dbe0;
+// $ui-eight: #fcfcfc;
+// $ui-grey: #c0c8ce;
+// $main: #54636d;
+$alt: #8f989e;
+// $background-light: #dce1e5;
+// $background: #f6f7f8;
+// $background-dark: #e8ebed;
+// $dark-blue: #3888c1;
+// $primary: #2f97ba;
+// $info-text: #0e82ae;
+// $info-light-text: #6ac1e8;
+// $primary-dark: #0e7598;
+// $primary-hover: hsl(205, 55%, 35%);
+// $brand-one: #4db0da;
+// $brand-two: #18769d;
+// $shipments: #129acd;
+// $progress: #259abf;
+
+// $dark-blue-transparent: rgba(56, 136, 193, 0.2);
+// $dark-blue-semi-transparent: rgba(56, 136, 193, 0.4);
+// $secondary: #4f5a63;
+// $info-background: #d6effa;
+// $info-light-background: #f3f9fb;
+// $hovered: rgba(166, 167, 168, 0.369);
+// $white: #fff;
+// $light-border: #ced2d6;
+// $state-info: #e8f6fd;
+// $state-info--alt: #f9fdff;
+// $ui-dark-opacity: rgba(0, 0, 0, 0.2);
+// $info-text-text: #525252;
+// $info-text-background: #f6fcfe;
+// $marked: #e8f6fd;
+// $marked: #f9fdff;
+// $side-menu-background: #eef1f3;
+// $label: #6d7883;
+// $warehouse-bubble: #c3cad3;
+// $warning: rgba(231, 181, 0, 0.228);

package/dist/scss/_transitions.scss

@@ -1,8 +1,8 @@
-$transition-length: 0.15s;
-$transition-delay: 0s;
-
-$colours:
-	border-color ease-out $transition-length $transition-delay,
-	background-color ease-out $transition-length $transition-delay,
-	color ease-out $transition-length $transition-delay,
-	fill ease-out $transition-length $transition-delay;
+$transition-length: 0.15s;
+$transition-delay: 0s;
+
+$colours:
+	border-color ease-out $transition-length $transition-delay,
+	background-color ease-out $transition-length $transition-delay,
+	color ease-out $transition-length $transition-delay,
+	fill ease-out $transition-length $transition-delay;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@lavalogic/scoria",
   "description": "Svelte components used for the FloWMS Web Frontend",
-  "version": "0.38.15",
+  "version": "0.39.0",
   "publishConfig": {
     "access": "restricted"
   },