lapikit 0.5.9 → 0.6.1

package/dist/components/card/modules/card-container.svelte

@@ -0,0 +1,51 @@
+<script lang="ts">
+	import type { CardContainerProps } from '../card.types';
+	import { makeComponentProps } from '../../../html-mapped';
+	import { useClassName, useStyles } from '../../../utils';
+
+	let {
+		ref = $bindable(),
+		is = 'div',
+		children,
+		class: className = '',
+		style: styleAttr = '',
+		's-class': sClass,
+		's-style': sStyle,
+		...rest
+	}: CardContainerProps = $props();
+
+	let { classProps, styleProps, restProps } = $derived(makeComponentProps(rest));
+
+	let componentClass = $derived(
+		useClassName({
+			baseClass: 'kit-card-container',
+			className: `${className ?? ''}`.trim(),
+			sClass,
+			classProps
+		})
+	);
+
+	let componentStyle = $derived(
+		useStyles({
+			styleAttr,
+			sStyle,
+			styleProps
+		})
+	);
+</script>
+
+<svelte:element
+	this={is}
+	bind:this={ref}
+	class={componentClass}
+	style={componentStyle}
+	{...restProps}
+>
+	{@render children?.()}
+</svelte:element>
+
+<style>
+	.kit-card-container {
+		gap: var(--kit-card-gap);
+	}
+</style>

package/dist/components/card/modules/card-container.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CardContainerProps } from '../card.types';
+declare const CardContainer: import("svelte").Component<CardContainerProps, {}, "ref">;
+type CardContainer = ReturnType<typeof CardContainer>;
+export default CardContainer;

package/dist/components/card/modules/card-content.svelte

@@ -0,0 +1,56 @@
+<script lang="ts">
+	import type { CardContentProps } from '../card.types';
+	import { makeComponentProps } from '../../../html-mapped';
+	import { useClassName, useStyles } from '../../../utils';
+
+	let {
+		ref = $bindable(),
+		is = 'div',
+		children,
+		class: className = '',
+		style: styleAttr = '',
+		's-class': sClass,
+		's-style': sStyle,
+		...rest
+	}: CardContentProps = $props();
+
+	let { classProps, styleProps, restProps } = $derived(makeComponentProps(rest));
+
+	let componentClass = $derived(
+		useClassName({
+			baseClass: 'kit-card-content',
+			className: `${className ?? ''}`.trim(),
+			sClass,
+			classProps
+		})
+	);
+
+	let componentStyle = $derived(
+		useStyles({
+			styleAttr,
+			sStyle,
+			styleProps
+		})
+	);
+</script>
+
+<svelte:element
+	this={is}
+	bind:this={ref}
+	class={componentClass}
+	style={componentStyle}
+	{...restProps}
+>
+	{@render children?.()}
+</svelte:element>
+
+<style>
+	.kit-card-content {
+		display: block;
+		line-height: 1.45;
+	}
+
+	.kit-card-content > :global(*) {
+		margin: 0;
+	}
+</style>

package/dist/components/card/modules/card-content.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CardContentProps } from '../card.types';
+declare const CardContent: import("svelte").Component<CardContentProps, {}, "ref">;
+type CardContent = ReturnType<typeof CardContent>;
+export default CardContent;

package/dist/components/card/modules/card-media.svelte

@@ -0,0 +1,52 @@
+<script lang="ts">
+	import type { CardMediaProps } from '../card.types';
+	import { makeComponentProps } from '../../../html-mapped';
+	import { useClassName, useStyles } from '../../../utils';
+
+	let {
+		ref = $bindable(),
+		is = 'div',
+		children,
+		class: className = '',
+		style: styleAttr = '',
+		's-class': sClass,
+		's-style': sStyle,
+		...rest
+	}: CardMediaProps = $props();
+
+	let { classProps, styleProps, restProps } = $derived(makeComponentProps(rest));
+
+	let componentClass = $derived(
+		useClassName({
+			baseClass: 'kit-card-media',
+			className: `${className ?? ''}`.trim(),
+			sClass,
+			classProps
+		})
+	);
+
+	let componentStyle = $derived(
+		useStyles({
+			styleAttr,
+			sStyle,
+			styleProps
+		})
+	);
+</script>
+
+<svelte:element
+	this={is}
+	bind:this={ref}
+	class={componentClass}
+	style={componentStyle}
+	{...restProps}
+>
+	{@render children?.()}
+</svelte:element>
+
+<style>
+	.kit-card-media {
+		overflow: hidden;
+		border-radius: calc(var(--kit-card-radius) - 2px);
+	}
+</style>

package/dist/components/card/modules/card-media.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CardMediaProps } from '../card.types';
+declare const CardMedia: import("svelte").Component<CardMediaProps, {}, "ref">;
+type CardMedia = ReturnType<typeof CardMedia>;
+export default CardMedia;

package/dist/components/card/modules/card-title.svelte

@@ -0,0 +1,56 @@
+<script lang="ts">
+	import type { CardTitleProps } from '../card.types';
+	import { makeComponentProps } from '../../../html-mapped';
+	import { useClassName, useStyles } from '../../../utils';
+
+	let {
+		ref = $bindable(),
+		is = 'div',
+		children,
+		class: className = '',
+		style: styleAttr = '',
+		's-class': sClass,
+		's-style': sStyle,
+		...rest
+	}: CardTitleProps = $props();
+
+	let { classProps, styleProps, restProps } = $derived(makeComponentProps(rest));
+
+	let componentClass = $derived(
+		useClassName({
+			baseClass: 'kit-card-title',
+			className: `${className ?? ''}`.trim(),
+			sClass,
+			classProps
+		})
+	);
+
+	let componentStyle = $derived(
+		useStyles({
+			styleAttr,
+			sStyle,
+			styleProps
+		})
+	);
+</script>
+
+<svelte:element
+	this={is}
+	bind:this={ref}
+	class={componentClass}
+	style={componentStyle}
+	{...restProps}
+>
+	{@render children?.()}
+</svelte:element>
+
+<style>
+	.kit-card-title {
+		font-weight: 600;
+		line-height: 1.3;
+	}
+
+	.kit-card-title > :global(*) {
+		margin: 0;
+	}
+</style>

package/dist/components/card/modules/card-title.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CardTitleProps } from '../card.types';
+declare const CardTitle: import("svelte").Component<CardTitleProps, {}, "ref">;
+type CardTitle = ReturnType<typeof CardTitle>;
+export default CardTitle;

package/dist/components/dialog/dialog.svelte

@@ -1,7 +1,6 @@
 <script lang="ts">
-	import { disabledScroll } from '../../@legacy/internal/helpers/scroll';
 	import { makeComponentProps } from '../../html-mapped';
-	import { useClassName, useStyles } from '../../utils';
+	import { useClassName, useStyles, disabledScroll } from '../../utils';
 	import type { DialogDensity, DialogPosition, DialogProps, DialogSize } from './dialog.types.js';
 
 	function resolveSize(value: DialogSize | undefined): DialogSize {

package/dist/components/index.d.ts

@@ -6,6 +6,11 @@ export { default as KitAppbar } from './appbar/appbar.svelte';
 export { default as KitBtn } from './btn/btn.svelte';
 export { default as KitIcon } from './icon/icon.svelte';
 export { default as KitCard } from './card/card.svelte';
+export { default as KitCardMedia } from './card/modules/card-media.svelte';
+export { default as KitCardTitle } from './card/modules/card-title.svelte';
+export { default as KitCardContent } from './card/modules/card-content.svelte';
+export { default as KitCardActions } from './card/modules/card-actions.svelte';
+export { default as KitCardContainer } from './card/modules/card-container.svelte';
 export { default as KitChip } from './chip/chip.svelte';
 export { default as KitAvatar } from './avatar/avatar.svelte';
 export { default as KitDropdown } from './dropdown/dropdown.svelte';

package/dist/components/index.js

@@ -4,6 +4,11 @@ export { default as KitAppbar } from './appbar/appbar.svelte';
 export { default as KitBtn } from './btn/btn.svelte';
 export { default as KitIcon } from './icon/icon.svelte';
 export { default as KitCard } from './card/card.svelte';
+export { default as KitCardMedia } from './card/modules/card-media.svelte';
+export { default as KitCardTitle } from './card/modules/card-title.svelte';
+export { default as KitCardContent } from './card/modules/card-content.svelte';
+export { default as KitCardActions } from './card/modules/card-actions.svelte';
+export { default as KitCardContainer } from './card/modules/card-container.svelte';
 export { default as KitChip } from './chip/chip.svelte';
 export { default as KitAvatar } from './avatar/avatar.svelte';
 export { default as KitDropdown } from './dropdown/dropdown.svelte';

package/dist/{@legacy/stores/components.d.ts → components/modal/modal.d.ts}

@@ -1,8 +1,7 @@
+import type { ModalState } from '../../@types';
 import { type Writable } from 'svelte/store';
-type ModalState = boolean | 'persistent';
 export declare const modalOpen: Writable<ModalState>;
 export declare const modalStack: Writable<string[]>;
 export declare function setOpenModal(state: boolean | 'persistent'): void;
 export declare const pushModal: (id: string) => void;
 export declare const popModal: (id: string) => void;
-export {};

package/dist/{@legacy/stores/components.js → components/modal/modal.js}

@@ -1,4 +1,4 @@
-import { disabledScroll } from '../internal/helpers/scroll.js';
+import { disabledScroll } from '../../utils';
 import { writable } from 'svelte/store';
 // presets
 const refModal = false;

package/dist/components/modal/modal.svelte

@@ -3,7 +3,7 @@
 	import { get } from 'svelte/store';
 	import { makeComponentProps } from '../../html-mapped';
 	import { useClassName, useStyles } from '../../utils';
-	import { modalOpen, modalStack, popModal, pushModal, setOpenModal } from '../../@legacy/stores';
+	import { modalOpen, modalStack, popModal, pushModal, setOpenModal } from './modal.js';
 	import type { ModalDensity, ModalPosition, ModalProps, ModalSize } from './modal.types.js';
 
 	function resolveSize(value: ModalSize | undefined): ModalSize {

package/dist/components/textfield/textfield.svelte.d.ts

@@ -1,4 +1,4 @@
 import type { TextfieldProps } from './textfield.types.ts';
-declare const Textfield: import("svelte").Component<TextfieldProps, {}, "ref" | "value">;
+declare const Textfield: import("svelte").Component<TextfieldProps, {}, "value" | "ref">;
 type Textfield = ReturnType<typeof Textfield>;
 export default Textfield;

package/dist/constants.d.ts

@@ -1,5 +1,5 @@
-export declare const lapikitImportsRef = "lapikit/labs/components";
-export declare const lapikitImportsLabsRef = "lapikit/labs/labs/components";
+export declare const lapikitImportsRef = "lapikit/components";
+export declare const lapikitImportsLabsRef = "lapikit/labs/components";
 export declare const lapikitComponents: readonly string[];
 export declare const lapikitLabsComponents: readonly string[];
 export declare const lapikitPlugins: {

package/dist/constants.js

@@ -1,5 +1,5 @@
-export const lapikitImportsRef = 'lapikit/labs/components';
-export const lapikitImportsLabsRef = 'lapikit/labs/labs/components';
+export const lapikitImportsRef = 'lapikit/components';
+export const lapikitImportsLabsRef = 'lapikit/labs/components';
 export const lapikitComponents = [
     'app',
     'btn',
@@ -28,7 +28,12 @@ export const lapikitComponents = [
     'spacer',
     'separator',
     'chip',
-    'card'
+    'card',
+    'card-title',
+    'card-content',
+    'card-media',
+    'card-actions',
+    'card-container'
 ];
 export const lapikitLabsComponents = ['sheet'];
 export const lapikitPlugins = {

package/dist/utils/components.d.ts

@@ -8,6 +8,7 @@ import type { useClassNameProps, useStylesProps } from '../@types';
  * @returns A computed class string.
  */
 export declare function useClassName({ baseClass, className, sClass, classProps }?: useClassNameProps): string;
+export declare function useIsInteractive(props: Record<string, unknown>, tag: string, interactiveTags: readonly string[], interactive?: boolean): boolean;
 /**
  * useStyles - Utility to compute style declarations for a component (optimized pure function).
  * @param styleAttr - Inline style attribute as a string.

package/dist/utils/components.js

@@ -54,6 +54,22 @@ export function useClassName({ baseClass = '', className, sClass, classProps } =
     }
     return classes.filter(Boolean).join(' ');
 }
+/**
+ * useIsInteractive - Utility to determine whether a component should behave as interactive:
+ * either explicitly flagged, rendered as an interactive tag (e.g. 'a', 'button'), or given
+ * one of the standard interactive event handlers (onclick, onpointerdown, onkeydown).
+ * @param props - The rest/spread props object of a component.
+ * @param tag - The resolved element tag the component renders as.
+ * @param interactiveTags - The tags considered interactive for this component (e.g. ['a', 'button']).
+ * @param interactive - Explicit interactive flag passed to the component.
+ * @returns True if the component should behave as interactive.
+ */
+const interactiveEventKeys = ['onclick', 'onpointerdown', 'onkeydown'];
+export function useIsInteractive(props, tag, interactiveTags, interactive = false) {
+    return (interactive ||
+        interactiveTags.includes(tag) ||
+        interactiveEventKeys.some((key) => typeof props[key] === 'function'));
+}
 /**
  * useStyles - Utility to compute style declarations for a component (optimized pure function).
  * @param styleAttr - Inline style attribute as a string.

package/dist/utils/outside.d.ts

@@ -3,3 +3,4 @@ export declare function clickOutside(node: HTMLElement, options: ClickOutsideOpt
     update(newOptions: ClickOutsideOptions): void;
     destroy(): void;
 };
+export declare function disabledScroll(state: boolean): void;

package/dist/utils/outside.js

@@ -32,3 +32,8 @@ export function clickOutside(node, options) {
         }
     };
 }
+export function disabledScroll(state) {
+    if (typeof window !== 'undefined' && typeof document !== 'undefined') {
+        document.body.style.overflow = state ? 'hidden' : '';
+    }
+}

package/dist/{@legacy/stores → utils}/themes.d.ts

@@ -1,2 +1,3 @@
 import { type Writable } from 'svelte/store';
 export declare const theme: Writable<string>;
+export declare function useTheme(name: string, key?: string): void;

package/dist/{@legacy/actions/use-theme.js → utils/themes.js}

@@ -1,6 +1,9 @@
-import { theme } from '../stores/themes.js';
+import { writable } from 'svelte/store';
 // states
 const isBrowser = typeof window !== 'undefined';
+// presets
+const themeRef = 'light';
+export const theme = writable(themeRef);
 export function useTheme(name, key = '@lapikit/theme') {
     theme.update(() => {
         if (isBrowser) {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "lapikit",
-	"version": "0.5.9",
+	"version": "0.6.1",
 	"license": "MIT",
 	"publishConfig": {
 		"access": "public"
@@ -43,51 +43,30 @@
 	"bin": {
 		"lapikit": "bin/index.js"
 	},
-	"svelte": "./dist/@legacy/index.js",
-	"types": "./dist/@legacy/index.d.ts",
+	"svelte": "./dist/entry-bundler.js",
+	"types": "./dist/entry-bundler.d.ts",
 	"type": "module",
 	"exports": {
 		".": {
-			"types": "./dist/@legacy/index.d.ts",
-			"svelte": "./dist/@legacy/index.js"
-		},
-		"./components": {
-			"svelte": "./dist/@legacy/components/index.js",
-			"default": "./dist/@legacy/components/index.js"
-		},
-		"./vite": {
-			"default": "./dist/@legacy/internal/plugins/vite.js"
-		},
-		"./stores": {
-			"default": "./dist/@legacy/stores/index.js"
-		},
-		"./actions": {
-			"default": "./dist/@legacy/actions/index.js"
-		},
-		"./core/colors": {
-			"default": "./dist/@legacy/internal/core/standard-colors.js"
-		},
-		"./styles": {
-			"types": "./dist/@legacy/styles.css.d.ts",
-			"default": "./dist/@legacy/styles.css"
-		},
-		"./themes": {
-			"types": "./dist/@legacy/themes.css.d.ts",
-			"default": "./dist/@legacy/themes.css"
+			"types": "./dist/entry-bundler.d.ts",
+			"svelte": "./dist/entry-bundler.js"
 		},
-		"./labs/preprocess": {
+		"./preprocess": {
 			"types": "./dist/entry-bundler.d.ts",
 			"default": "./dist/entry-bundler.js"
 		},
-		"./labs/components": {
+		"./components": {
 			"types": "./dist/components/index.d.ts",
 			"svelte": "./dist/components/index.js",
 			"default": "./dist/components/index.js"
 		},
-		"./labs/labs/components": {
+		"./labs/components": {
 			"types": "./dist/labs/index.d.ts",
 			"svelte": "./dist/labs/index.js",
 			"default": "./dist/labs/index.js"
+		},
+		"./actions": {
+			"default": "./dist/actions.js"
 		}
 	},
 	"peerDependencies": {

package/dist/@legacy/actions/accordion.svelte.d.ts

@@ -1,9 +0,0 @@
-type AccordionOptions = {
-    multiple?: boolean;
-    readOnly?: boolean;
-};
-export declare function useAccordion({ multiple, readOnly }?: AccordionOptions): {
-    readonly values: (string | number)[];
-    toggle(id: string | number): void;
-};
-export {};

package/dist/@legacy/actions/index.d.ts

@@ -1,2 +0,0 @@
-export * from './accordion.svelte.js';
-export * from './use-theme.js';

package/dist/@legacy/actions/index.js

@@ -1,2 +0,0 @@
-export * from './accordion.svelte.js';
-export * from './use-theme.js';

package/dist/@legacy/actions/use-theme.d.ts

@@ -1 +0,0 @@
-export declare function useTheme(name: string, key?: string): void;

package/dist/@legacy/assets/icons/arrow-down.svelte

@@ -1,12 +0,0 @@
-<script lang="ts"></script>
-
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
-	><path
-		fill="none"
-		stroke="currentColor"
-		stroke-linecap="round"
-		stroke-linejoin="round"
-		stroke-width="2.5"
-		d="m7 10l5 5m0 0l5-5"
-	/></svg
->

package/dist/@legacy/assets/icons/arrow-down.svelte.d.ts

@@ -1,18 +0,0 @@
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const ArrowDown: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type ArrowDown = InstanceType<typeof ArrowDown>;
-export default ArrowDown;

package/dist/@legacy/assets/icons/arrow-up.svelte

@@ -1,12 +0,0 @@
-<script lang="ts"></script>
-
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
-	><path
-		fill="none"
-		stroke="currentColor"
-		stroke-linecap="round"
-		stroke-linejoin="round"
-		stroke-width="2.5"
-		d="m17 14l-5-5m0 0l-5 5"
-	/></svg
->

package/dist/@legacy/assets/icons/arrow-up.svelte.d.ts

@@ -1,18 +0,0 @@
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const ArrowUp: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type ArrowUp = InstanceType<typeof ArrowUp>;
-export default ArrowUp;

package/dist/@legacy/assets/icons/close-fill.svelte

@@ -1,12 +0,0 @@
-<script lang="ts"></script>
-
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
-	><title>close_fill</title><g id="close_fill" fill="none" fill-rule="evenodd"
-		><path
-			d="M24 0v24H0V0zM12.593 23.258l-.011.002-.071.035-.02.004-.014-.004-.071-.035c-.01-.004-.019-.001-.024.005l-.004.01-.017.428.005.02.01.013.104.074.015.004.012-.004.104-.074.012-.016.004-.017-.017-.427c-.002-.01-.009-.017-.017-.018m.265-.113-.013.002-.185.093-.01.01-.003.011.018.43.005.012.008.007.201.093c.012.004.023 0 .029-.008l.004-.014-.034-.614c-.003-.012-.01-.02-.02-.022m-.715.002a.023.023 0 0 0-.027.006l-.006.014-.034.614c0 .012.007.02.017.024l.015-.002.201-.093.01-.008.004-.011.017-.43-.003-.012-.01-.01z"
-		/><path
-			fill="currentColor"
-			d="m12 14.122 5.303 5.303a1.5 1.5 0 0 0 2.122-2.122L14.12 12l5.304-5.303a1.5 1.5 0 1 0-2.122-2.121L12 9.879 6.697 4.576a1.5 1.5 0 1 0-2.122 2.12L9.88 12l-5.304 5.304a1.5 1.5 0 1 0 2.122 2.12z"
-		/></g
-	></svg
->

package/dist/@legacy/assets/icons/close-fill.svelte.d.ts

@@ -1,18 +0,0 @@
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const CloseFill: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type CloseFill = InstanceType<typeof CloseFill>;
-export default CloseFill;

package/dist/@legacy/assets/icons/loading-fill.svelte

@@ -1,31 +0,0 @@
-<script lang="ts"></script>
-
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
-	><defs
-		><linearGradient id="a" x1="50%" x2="50%" y1="5.271%" y2="91.793%"
-			><stop offset="0%" stop-color="currentColor" /><stop
-				offset="100%"
-				stop-color="currentColor"
-				stop-opacity=".55"
-			/></linearGradient
-		><linearGradient id="b" x1="50%" x2="50%" y1="15.24%" y2="87.15%"
-			><stop offset="0%" stop-color="currentColor" stop-opacity="0" /><stop
-				offset="100%"
-				stop-color="currentColor"
-				stop-opacity=".55"
-			/></linearGradient
-		></defs
-	><g fill="none"
-		><path
-			d="M24 0v24H0V0zM12.593 23.258l-.011.002-.071.035-.02.004-.014-.004-.071-.035c-.01-.004-.019-.001-.024.005l-.004.01-.017.428.005.02.01.013.104.074.015.004.012-.004.104-.074.012-.016.004-.017-.017-.427c-.002-.01-.009-.017-.017-.018m.265-.113-.013.002-.185.093-.01.01-.003.011.018.43.005.012.008.007.201.093c.012.004.023 0 .029-.008l.004-.014-.034-.614c-.003-.012-.01-.02-.02-.022m-.715.002a.023.023 0 0 0-.027.006l-.006.014-.034.614c0 .012.007.02.017.024l.015-.002.201-.093.01-.008.004-.011.017-.43-.003-.012-.01-.01z"
-		/><path
-			fill="url(#a)"
-			d="M8.749.021a1.5 1.5 0 0 1 .497 2.958A7.502 7.502 0 0 0 3 10.375a7.5 7.5 0 0 0 7.5 7.5v3c-5.799 0-10.5-4.7-10.5-10.5C0 5.23 3.726.865 8.749.021"
-			transform="translate(1.5 1.625)"
-		/><path
-			fill="url(#b)"
-			d="M15.392 2.673a1.5 1.5 0 0 1 2.119-.115A10.475 10.475 0 0 1 21 10.375c0 5.8-4.701 10.5-10.5 10.5v-3a7.5 7.5 0 0 0 5.007-13.084 1.5 1.5 0 0 1-.115-2.118"
-			transform="translate(1.5 1.625)"
-		/></g
-	></svg
->