@kayord/ui 1.0.0 → 1.0.1

package/dist/components/custom/avatar-group/avatar-group-etc.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+	import { cn } from "../../../utils";
+	import type { AvatarGroupEtcProps } from "./types";
+
+	let { ref = $bindable(null), plus, class: className, ...rest }: AvatarGroupEtcProps = $props();
+</script>
+
+<div
+	{...rest}
+	bind:this={ref}
+	class={cn(
+		"bg-accent ring-background relative flex size-8 items-center justify-center rounded-full text-xs ring-2",
+		className
+	)}
+>
+	<span>+{plus}</span>
+</div>

package/dist/components/custom/avatar-group/avatar-group-etc.svelte.d.ts

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

package/dist/components/custom/avatar-group/avatar-group-member.svelte

@@ -0,0 +1,9 @@
+<script lang="ts">
+	import { Avatar } from "../../..";
+	import { Avatar as AvatarPrimitive } from "bits-ui";
+	import { cn } from "../../../utils";
+
+	let { ref = $bindable(null), class: className, ...restProps }: AvatarPrimitive.RootProps = $props();
+</script>
+
+<Avatar.Root bind:ref class={cn("bg-accent ring-background ring-2", className)} {...restProps} />

package/dist/components/custom/avatar-group/avatar-group-member.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Avatar as AvatarPrimitive } from "bits-ui";
+declare const AvatarGroupMember: import("svelte").Component<AvatarPrimitive.RootProps, {}, "ref">;
+type AvatarGroupMember = ReturnType<typeof AvatarGroupMember>;
+export default AvatarGroupMember;

package/dist/components/custom/avatar-group/avatar-group.svelte

@@ -0,0 +1,24 @@
+<script lang="ts">
+	import { cn } from "../../../utils";
+	import type { AvatarGroupRootProps } from "./types";
+
+	let {
+		ref = $bindable(null),
+		orientation = "horizontal",
+		class: className,
+		children,
+		...rest
+	}: AvatarGroupRootProps = $props();
+</script>
+
+<div
+	bind:this={ref}
+	data-orientation={orientation}
+	class={cn(
+		'group/avatar-group flex items-center data-[orientation="horizontal"]:flex-row data-[orientation="horizontal"]:-space-x-2 data-[orientation="vertical"]:flex-col data-[orientation="vertical"]:-space-y-2',
+		className
+	)}
+	{...rest}
+>
+	{@render children?.()}
+</div>

package/dist/components/custom/avatar-group/avatar-group.svelte.d.ts

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

package/dist/components/custom/avatar-group/index.d.ts

@@ -0,0 +1,6 @@
+import Root from "./avatar-group.svelte";
+import Member from "./avatar-group-member.svelte";
+import Etc from "./avatar-group-etc.svelte";
+import { Fallback, Image } from "../../ui/avatar";
+export { Root, Member, Etc, Image as MemberImage, Fallback as MemberFallback };
+export type * from "./types";

package/dist/components/custom/avatar-group/index.js

@@ -0,0 +1,5 @@
+import Root from "./avatar-group.svelte";
+import Member from "./avatar-group-member.svelte";
+import Etc from "./avatar-group-etc.svelte";
+import { Fallback, Image } from "../../ui/avatar";
+export { Root, Member, Etc, Image as MemberImage, Fallback as MemberFallback };

package/dist/components/custom/avatar-group/types.d.ts

@@ -0,0 +1,13 @@
+import type { Avatar as AvatarPrimitive, WithChildren, WithoutChildren } from "bits-ui";
+import type { HTMLAttributes } from "svelte/elements";
+export type AvatarGroupRootPropsWithoutHTML = WithChildren<{
+    ref?: HTMLElement | null;
+    orientation?: "vertical" | "horizontal";
+}>;
+export type AvatarGroupRootProps = AvatarGroupRootPropsWithoutHTML & WithoutChildren<HTMLAttributes<HTMLDivElement>>;
+export type AvatarGroupMemberProps = AvatarPrimitive.RootProps;
+export type AvatarGroupEtcPropsWithoutHTML = WithChildren<{
+    ref?: HTMLElement | null;
+    plus: number;
+}>;
+export type AvatarGroupEtcProps = AvatarGroupEtcPropsWithoutHTML & WithoutChildren<HTMLAttributes<HTMLDivElement>>;

package/dist/components/custom/avatar-group/types.js

@@ -0,0 +1 @@
+export {};

package/dist/components/custom/index.d.ts

@@ -8,3 +8,4 @@ export * as TreeView from "./tree-view/index.js";
 export { ThemeSelector } from "./theme-selector/index.js";
 export { LightSwitch } from "./light-switch.svelte/index.js";
 export * from "./animations/index.js";
+export * as AvatarGroup from "./avatar-group/index.js";

package/dist/components/custom/index.js

@@ -8,3 +8,4 @@ export * as TreeView from "./tree-view/index.js";
 export { ThemeSelector } from "./theme-selector/index.js";
 export { LightSwitch } from "./light-switch.svelte/index.js";
 export * from "./animations/index.js";
+export * as AvatarGroup from "./avatar-group/index.js";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@kayord/ui",
   "private": false,
-  "version": "1.0.0",
+  "version": "1.0.1",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -58,13 +58,13 @@
     "@testing-library/user-event": "^14.6.1",
     "@types/d3-scale": "^4.0.9",
     "@types/d3-shape": "^3.1.7",
-    "@typescript-eslint/eslint-plugin": "^8.33.1",
-    "@typescript-eslint/parser": "^8.33.1",
+    "@typescript-eslint/eslint-plugin": "^8.34.0",
+    "@typescript-eslint/parser": "^8.34.0",
     "d3-scale": "^4.0.2",
     "d3-shape": "^3.2.0",
     "eslint": "^9.28.0",
     "eslint-config-prettier": "^10.1.5",
-    "eslint-plugin-svelte": "^3.9.1",
+    "eslint-plugin-svelte": "^3.9.2",
     "happy-dom": "^17.6.3",
     "layerchart": "2.0.0-next.6",
     "prettier": "^3.5.3",
@@ -79,7 +79,7 @@
     "typescript": "^5.8.3",
     "vite": "^6.3.5",
     "vitest": "^3.2.3",
-    "zod": "^3.25.56"
+    "zod": "^3.25.57"
   },
   "svelte": "./dist/index.js",
   "types": "./dist/index.d.ts",