@cloudparker/moldex.js 0.0.34 → 0.0.36

package/dist/views/core/input/components/text-field/text-field.svelte

@@ -1,7 +1,14 @@
 <script lang="ts">
-	import InputField, { type InputFieldPropsType } from '../input-field/input-field.svelte';
+	import InputField, {
+		type InputFieldPropsType,
+		type InputValueType
+	} from '../input-field/input-field.svelte';
 
-	let { maxlength, ...props }: InputFieldPropsType = $props();
+	let {
+		maxlength,
+		value = $bindable<InputValueType>(''),
+		...props
+	}: InputFieldPropsType = $props();
 	let inputFieldRef: InputField | null = $state(null);
 
 	export function focus() {
@@ -9,4 +16,10 @@
 	}
 </script>
 
-<InputField bind:this={inputFieldRef} {...props} type="text" maxlength={maxlength || 200} />
+<InputField
+	{...props}
+	bind:value
+	bind:this={inputFieldRef}
+	type="text"
+	maxlength={maxlength || 200}
+/>

package/dist/views/core/input/components/text-field/text-field.svelte.d.ts

@@ -16,6 +16,6 @@ declare const TextField: $$__sveltets_2_IsomorphicComponent<InputFieldPropsType,
     [evt: string]: CustomEvent<any>;
 }, {}, {
     focus: () => void;
-}, "">;
+}, "value">;
 type TextField = InstanceType<typeof TextField>;
 export default TextField;

package/dist/views/core/input/components/textarea-field/textarea-field.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import InputField, { type InputFieldPropsType } from '../input-field/input-field.svelte';
 
-	let props: InputFieldPropsType = $props();
+	let { value = $bindable(''), ...props }: InputFieldPropsType = $props();
 	let inputFieldRef: InputField | null = $state(null);
 
 	export function focus() {
@@ -9,4 +9,9 @@
 	}
 </script>
 
-<InputField bind:this={inputFieldRef} {...props} type="textarea" maxlength={props?.maxlength || 200} />
+<InputField
+	bind:this={inputFieldRef}
+	{...props}
+	type="textarea"
+	maxlength={props?.maxlength || 300}
+/>

package/dist/views/core/input/components/textarea-field/textarea-field.svelte.d.ts

@@ -16,6 +16,6 @@ declare const TextareaField: $$__sveltets_2_IsomorphicComponent<InputFieldPropsT
     [evt: string]: CustomEvent<any>;
 }, {}, {
     focus: () => void;
-}, "">;
+}, "value">;
 type TextareaField = InstanceType<typeof TextareaField>;
 export default TextareaField;

package/dist/views/core/sidebar/components/sidebar.svelte

@@ -8,8 +8,15 @@
 		className?: string;
 		id?: string;
 		responsiveBreakpoint?: BreakpointType;
+		position?: 'left' | 'right';
 	};
-	let { children, className, id, responsiveBreakpoint = 'md' }: PropsType = $props();
+	let {
+		children,
+		className,
+		id,
+		responsiveBreakpoint = 'md',
+		position = 'left'
+	}: PropsType = $props();
 
 	let responsiveClassName = $derived.by(() => {
 		switch (responsiveBreakpoint) {
@@ -29,7 +36,12 @@
 	});
 </script>
 
-<div {id} class="hidden bg-white pt-16 {responsiveClassName} {className}">
+<div
+	{id}
+	class="hidden bg-white pt-16 {responsiveClassName} {position == 'right'
+		? 'right-0'
+		: ''} {className}"
+>
 	{#if children}
 		{@render children()}
 	{/if}

package/dist/views/core/sidebar/components/sidebar.svelte.d.ts

@@ -17,6 +17,7 @@ declare const Sidebar: $$__sveltets_2_IsomorphicComponent<{
     className?: string;
     id?: string;
     responsiveBreakpoint?: "lg" | "md" | "sm" | "xs" | "xl" | "2xl";
+    position?: "left" | "right";
 }, {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, "">;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@cloudparker/moldex.js",
-    "version": "0.0.34",
+    "version": "0.0.36",
     "author": "cloudparker.com",
     "license": "MIT",
     "keywords": [
@@ -28,6 +28,7 @@
     "homepage": "https://cloudparker.com",
     "devDependencies": {
         "@cloudparker/easy-script-loader-svelte": "^4.0.0",
+        "@cloudparker/easy-cropperjs-svelte": "^2.4.0",
         "esm-env": "^1.0.0",
         "moment": "^2.30.1"
     },

package/dist/views/core/content-with-sidebar/components/content-with-sidebar.svelte

@@ -1,36 +0,0 @@
-<script lang="ts">
-	import type { Snippet } from 'svelte';
-
-	type BreakpointType = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
-
-	type PropsType = {
-		children?: Snippet;
-		className?: string;
-		id?: string;
-		responsiveBreakpoint?: BreakpointType;
-	};
-	let { children, className, id, responsiveBreakpoint = 'md' }: PropsType = $props();
-
-	let responsiveClassName = $derived.by(() => {
-		switch (responsiveBreakpoint) {
-			case 'xs':
-				return 'xs:pl-72';
-			case 'sm':
-				return 'sm:pl-72';
-			case 'md':
-				return 'md:pl-72';
-			case 'lg':
-				return 'lg:pl-72';
-			case 'xl':
-				return 'xl:pl-72';
-			case '2xl':
-				return '2xl:pl-72';
-		}
-	});
-</script>
-
-<div {id} class="{responsiveClassName} {className}">
-	{#if children}
-		{@render children()}
-	{/if}
-</div>

package/dist/views/core/content-with-sidebar/index.d.ts

@@ -1,2 +0,0 @@
-export { ContentWithSidebar };
-import ContentWithSidebar from './components/content-with-sidebar.svelte';

package/dist/views/core/content-with-sidebar/index.js

@@ -1,5 +0,0 @@
-import ContentWithSidebar from './components/content-with-sidebar.svelte'
-
-export {
-    ContentWithSidebar
-}