feat: docker compose maybe

node_modules/@skeletonlabs/skeleton/dist/components/Ratings/Ratings.svelte

@@ -0,0 +1,52 @@
+<script>import { createEventDispatcher } from "svelte";
+export let value = 0;
+export let max = 5;
+export let interactive = false;
+export let text = "text-token";
+export let fill = "fill-token";
+export let justify = "justify-center";
+export let spacing = "space-x-2";
+export let regionIcon = "";
+const dispatch = createEventDispatcher();
+function iconClick(index) {
+  dispatch("icon", {
+    index: index + 1
+  });
+}
+function isFull(value2, index) {
+  return Math.floor(value2) >= index + 1;
+}
+function isHalf(value2, index) {
+  return value2 === index + 0.5;
+}
+const cBase = "w-full flex";
+$:
+  classesBase = `${cBase} ${text} ${fill} ${justify} ${spacing} ${$$props.class ?? ""}`;
+</script>
+
+<div class="ratings {classesBase}" data-testid="rating-bar">
+	<!-- eslint-disable-next-line @typescript-eslint/no-unused-vars -->
+	{#each { length: max } as _, i}
+		{#if interactive}
+			<button class="rating-icon {regionIcon}" type="button" on:click={() => iconClick(i)}>
+				{#if isFull(value, i)}
+					<slot name="full" />
+				{:else if isHalf(value, i)}
+					<slot name="half" />
+				{:else}
+					<slot name="empty" />
+				{/if}
+			</button>
+		{:else}
+			<span class="rating-icon {regionIcon}">
+				{#if isFull(value, i)}
+					<slot name="full" />
+				{:else if isHalf(value, i)}
+					<slot name="half" />
+				{:else}
+					<slot name="empty" />
+				{/if}
+			</span>
+		{/if}
+	{/each}
+</div>

node_modules/@skeletonlabs/skeleton/dist/components/Ratings/Ratings.svelte.d.ts

@@ -0,0 +1,41 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        [x: string]: any;
+        /** Current rating value.*/
+        value?: number | undefined;
+        /** Maximum rating value.*/
+        max?: number | undefined;
+        /** Enables interactive mode for each rating icon.*/
+        interactive?: boolean | undefined;
+        /** Provide classes to set the text color.*/
+        text?: string | undefined;
+        /** Provide classes to set the SVG fill color.*/
+        fill?: string | undefined;
+        /** Provide classes to set the flexbox justification.*/
+        justify?: string | undefined;
+        /** Provide classes to set the horizontal spacing style.*/
+        spacing?: string | undefined;
+        /** Provide arbitrary classes to the icon region.*/
+        regionIcon?: string | undefined;
+    };
+    events: {
+        /** {{ index: number  }} icon - Fires when an icons is clicked*/
+        icon: CustomEvent<{
+            index: number;
+        }>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        full: {};
+        half: {};
+        empty: {};
+    };
+};
+export type RatingsProps = typeof __propDef.props;
+export type RatingsEvents = typeof __propDef.events;
+export type RatingsSlots = typeof __propDef.slots;
+export default class Ratings extends SvelteComponentTyped<RatingsProps, RatingsEvents, RatingsSlots> {
+}
+export {};