@enki-tek/fms-web-components 0.0.53 → 0.0.54

package/components/Button/Button.svelte

@@ -26,7 +26,7 @@
 	}
 </script>
 
-<button {type} class={buttonStyles.join(' ')} on:click on:focus on:blur {disabled} >
+<button {...$$restProps} {type} class={buttonStyles.join(' ')} on:click on:focus on:blur {disabled} >
 	<slot>
 		{#if label}
 			{label}

package/components/Button/Button.svelte.d.ts

@@ -2,6 +2,7 @@
 /** @typedef {typeof __propDef.events}  ButtonEvents */
 /** @typedef {typeof __propDef.slots}  ButtonSlots */
 export default class Button extends SvelteComponentTyped<{
+    [x: string]: any;
     size?: string | undefined;
     disabled?: boolean | undefined;
     type?: string | undefined;
@@ -31,6 +32,7 @@ export type ButtonSlots = typeof __propDef.slots;
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
+        [x: string]: any;
         size?: string | undefined;
         disabled?: boolean | undefined;
         type?: string | undefined;

package/components/TextField/TextField.svelte

@@ -14,6 +14,7 @@
 </script>
 
 <Input
+    { ...$$restProps}
 	{type}
 	class="custom-field efs-normal {className}"
 	{placeholder}

package/components/TextField/TextField.svelte.d.ts

@@ -2,6 +2,7 @@
 /** @typedef {typeof __propDef.events}  TextFieldEvents */
 /** @typedef {typeof __propDef.slots}  TextFieldSlots */
 export default class TextField extends SvelteComponentTyped<{
+    [x: string]: any;
     size?: string | undefined;
     disabled?: boolean | undefined;
     invalid?: boolean | undefined;
@@ -27,6 +28,7 @@ export type TextFieldSlots = typeof __propDef.slots;
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
+        [x: string]: any;
         size?: string | undefined;
         disabled?: boolean | undefined;
         invalid?: boolean | undefined;

package/components/Tooltip/Tooltip.scss

@@ -8,6 +8,18 @@
     line-height: 22px;
 }
 
+.align-left {
+    text-align: left;
+}
+
+.align-center {
+    text-align: center;
+}
+
+.align-right {
+    text-align: right;
+}
+
 :global(.tooltip-inner) {
     background-color: $primary-dark;
 }
@@ -26,4 +38,7 @@
 
 :global(.tooltip.bs-tooltip-bottom .tooltip-arrow::before) {
     border-bottom-color: $primary-dark;
+}
+.tooltips{
+    text-align: left;
 }

package/components/Tooltip/Tooltip.svelte

@@ -3,26 +3,26 @@ export let target = " ";
 export let placement = "right";
 export let delay = 500;
 export let label = "";
+export let textAlignment = "left";
+const textAligns = {
+  left: "align-left",
+  right: "align-right",
+  center: "align-center"
+};
 </script>
 
-<div>
-  {#if target==="btn-right-html"}
-     <Button id="btn-right-html">HTML right</Button>
-  {/if}
-  
-  <div class="tooltips">
-      <Tooltip class='custom-tooltip' target={target} placement={placement} delay={delay} {...$$restProps}>
-          <div class="label">
-              <slot>
-                 {#if label}
-                   {label}
-                   {:else}
-                      <slot/>
-                  {/if}    
-              </slot>
-          </div>  
-      </Tooltip>
-  </div>
+<div class="tooltips">
+	<Tooltip class="custom-tooltip" {target} {placement} {delay} {...$$restProps}>
+		<div class="label {textAligns.hasOwnProperty(textAlignment) ? textAligns[textAlignment] : ''}">
+			<slot>
+				{#if label}
+					{label}
+				{:else}
+					<slot />
+				{/if}
+			</slot>
+		</div>
+	</Tooltip>
 </div>
 
 <style>@import url(https://fonts.googleapis.com/icon?family=Material+Icons);
@@ -605,6 +605,15 @@ export let label = "";
   font-size: 16px;
   line-height: 22px;
 }
+.align-left {
+  text-align: left;
+}
+.align-center {
+  text-align: center;
+}
+.align-right {
+  text-align: right;
+}
 :global(.tooltip-inner) {
   background-color: #007FD8;
 }
@@ -619,4 +628,7 @@ export let label = "";
 }
 :global(.tooltip.bs-tooltip-bottom .tooltip-arrow::before) {
   border-bottom-color: #007FD8;
+}
+.tooltips {
+  text-align: left;
 }</style>

package/components/Tooltip/Tooltip.svelte.d.ts

@@ -6,6 +6,7 @@ declare const __propDef: {
         placement?: string | undefined;
         delay?: number | undefined;
         label?: string | undefined;
+        textAlignment?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@enki-tek/fms-web-components",
-  "version": "0.0.53",
+  "version": "0.0.54",
   "devDependencies": {
     "@storybook/addon-essentials": "^7.6.14",
     "@storybook/addon-interactions": "^7.6.14",