@skf-design-system/ui-components 1.0.0-alpha.28 → 1.0.0-alpha.30

package/dist/react/skf-menu/index.js

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { createComponent } from '@lit/react';
+import Component from '../../components/menu/menu.js';
+import {} from '../../components/menu/menu.js';
+import {} from '@lit/react';
+const tagName = 'skf-menu';
+Component.define('skf-menu');
+const reactWrapper = createComponent({
+    tagName,
+    elementClass: Component,
+    react: React,
+    events: {
+        onOpen: 'open',
+        onClose: 'close',
+    },
+    displayName: 'SkfMenu',
+});
+export default reactWrapper;

package/dist/react/skf-menu-item/index.d.ts

@@ -0,0 +1,27 @@
+import Component from '../../components/menu-item/menu-item.js';
+import { type SkfMenuItem } from '../../components/menu-item/menu-item.js';
+import { type EventName } from '@lit/react';
+declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {
+    onMyTagMyEvent: EventName<Event & {
+        target: SkfMenuItem;
+    }>;
+    onClick: EventName<Event & {
+        target: SkfMenuItem;
+    }>;
+    onMouseover: EventName<Event & {
+        target: SkfMenuItem;
+    }>;
+    onMouseout: EventName<Event & {
+        target: SkfMenuItem;
+    }>;
+    onFocus: EventName<Event & {
+        target: SkfMenuItem;
+    }>;
+    onBlur: EventName<Event & {
+        target: SkfMenuItem;
+    }>;
+    onChange: EventName<Event & {
+        target: SkfMenuItem;
+    }>;
+}>;
+export default reactWrapper;

package/dist/react/skf-menu-item/index.js

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { createComponent } from '@lit/react';
+import Component from '../../components/menu-item/menu-item.js';
+import {} from '../../components/menu-item/menu-item.js';
+import {} from '@lit/react';
+const tagName = 'skf-menu-item';
+Component.define('skf-menu-item');
+const reactWrapper = createComponent({
+    tagName,
+    elementClass: Component,
+    react: React,
+    events: {
+        onMyTagMyEvent: 'my-tag-my-event',
+        onClick: 'click',
+        onMouseover: 'mouseover',
+        onMouseout: 'mouseout',
+        onFocus: 'focus',
+        onBlur: 'blur',
+        onChange: 'change',
+    },
+    displayName: 'SkfMenuItem',
+});
+export default reactWrapper;

package/dist/react/skf-popover/index.d.ts

@@ -0,0 +1,12 @@
+import Component from '../../components/popover/popover.js';
+import { type SkfPopover } from '../../components/popover/popover.js';
+import { type EventName } from '@lit/react';
+declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {
+    onOpen: EventName<Event & {
+        target: SkfPopover;
+    }>;
+    onClose: EventName<Event & {
+        target: SkfPopover;
+    }>;
+}>;
+export default reactWrapper;

package/dist/react/skf-popover/index.js

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { createComponent } from '@lit/react';
+import Component from '../../components/popover/popover.js';
+import {} from '../../components/popover/popover.js';
+import {} from '@lit/react';
+const tagName = 'skf-popover';
+Component.define('skf-popover');
+const reactWrapper = createComponent({
+    tagName,
+    elementClass: Component,
+    react: React,
+    events: {
+        onOpen: 'open',
+        onClose: 'close',
+    },
+    displayName: 'SkfPopover',
+});
+export default reactWrapper;

package/dist/react/skf-stepper/index.d.ts

@@ -0,0 +1,9 @@
+import Component from '../../components/stepper/stepper.js';
+import { type SkfStepper } from '../../components/stepper/stepper.js';
+import { type EventName } from '@lit/react';
+declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {
+    onSkfStepperItemSelect: EventName<Event & {
+        target: SkfStepper;
+    }>;
+}>;
+export default reactWrapper;

package/dist/react/skf-stepper/index.js

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { createComponent } from '@lit/react';
+import Component from '../../components/stepper/stepper.js';
+import {} from '../../components/stepper/stepper.js';
+import {} from '@lit/react';
+const tagName = 'skf-stepper';
+Component.define('skf-stepper');
+const reactWrapper = createComponent({
+    tagName,
+    elementClass: Component,
+    react: React,
+    events: {
+        onSkfStepperItemSelect: 'skf-stepper-item-select',
+    },
+    displayName: 'SkfStepper',
+});
+export default reactWrapper;

package/dist/react/skf-stepper-item/index.d.ts

@@ -0,0 +1,9 @@
+import Component from '../../components/stepper-item/stepper-item.js';
+import { type SkfStepperItem } from '../../components/stepper-item/stepper-item.js';
+import { type EventName } from '@lit/react';
+declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {
+    onSkfStepperItemSelect: EventName<Event & {
+        target: SkfStepperItem;
+    }>;
+}>;
+export default reactWrapper;

package/dist/react/skf-stepper-item/index.js

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { createComponent } from '@lit/react';
+import Component from '../../components/stepper-item/stepper-item.js';
+import {} from '../../components/stepper-item/stepper-item.js';
+import {} from '@lit/react';
+const tagName = 'skf-stepper-item';
+Component.define('skf-stepper-item');
+const reactWrapper = createComponent({
+    tagName,
+    elementClass: Component,
+    react: React,
+    events: {
+        onSkfStepperItemSelect: 'skf-stepper-item-select',
+    },
+    displayName: 'SkfStepperItem',
+});
+export default reactWrapper;

package/dist/react/skf-tooltip/index.d.ts

@@ -0,0 +1,12 @@
+import Component from '../../components/tooltip/tooltip.js';
+import { type SkfTooltip } from '../../components/tooltip/tooltip.js';
+import { type EventName } from '@lit/react';
+declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {
+    onOpen: EventName<Event & {
+        target: SkfTooltip;
+    }>;
+    onClose: EventName<Event & {
+        target: SkfTooltip;
+    }>;
+}>;
+export default reactWrapper;

package/dist/react/skf-tooltip/index.js

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { createComponent } from '@lit/react';
+import Component from '../../components/tooltip/tooltip.js';
+import {} from '../../components/tooltip/tooltip.js';
+import {} from '@lit/react';
+const tagName = 'skf-tooltip';
+Component.define('skf-tooltip');
+const reactWrapper = createComponent({
+    tagName,
+    elementClass: Component,
+    react: React,
+    events: {
+        onOpen: 'open',
+        onClose: 'close',
+    },
+    displayName: 'SkfTooltip',
+});
+export default reactWrapper;

package/dist/styles/component.styles.js

@@ -1,5 +1,5 @@
 import { css as e } from "lit";
-const o = e`
+const t = e`
 	@layer reset, globals, components, overrides;
 
 	@layer reset {
@@ -24,6 +24,19 @@ const o = e`
 	}
 
 	@layer globals {
+		:host {
+			--skf-is-tablet: false;
+			--skf-box-spacing: var(--skf-spacing-100);
+
+			/* mq-token needed here */
+			@media screen and (width >= 768px) {
+				--skf-is-tablet: true;
+				--skf-box-spacing: var(--skf-spacing-150);
+			}
+
+			color: var(--skf-text-color-primary);
+		}
+
 		:is(button, input, label, select) {
 			cursor: pointer;
 
@@ -35,5 +48,5 @@ const o = e`
 	}
 `;
 export {
-  o as default
+  t as default
 };