fix(List): added class identifiers

N00nDay · Oct 4, 2023 · 4a8ffec · 4a8ffec
1 parent d6e9d13
commit 4a8ffec
Show file tree

Hide file tree

Showing 9 changed files with 16 additions and 11 deletions.
diff --git a/src/lib/components/list/Avatar.svelte b/src/lib/components/list/Avatar.svelte
@@ -19,10 +19,11 @@
 	let failed = false;
 	let loading = true;
 
-	const srcClass = 'inline-block absolute';
-	const srcContainerClass = 'inline-block relative align-middle';
+	const srcClass = 'inline-block absolute stwui-list-item-leading-avatar';
+	const srcContainerClass =
+		'inline-block relative align-middle stwui-list-item-leading-avatar-wrapper';
 	const initialClass =
-		'inline-flex items-center justify-center align-middle bg-default text-default-content';
+		'inline-flex items-center justify-center align-middle bg-default text-default-content stwui-list-item-leading-avatar';
 	const xsClass = 'h-6 w-6';
 	const smClass = 'h-8 w-8';
 	const mdClass = 'h-10 w-10';

diff --git a/src/lib/components/list/Content.svelte b/src/lib/components/list/Content.svelte
@@ -6,7 +6,8 @@
 	import { exclude } from '../../utils/exclude';
 	const forwardEvents = forwardEventsBuilder(get_current_component());
 
-	const defaultClass = 'ml-3 flex flex-grow flex-col justify-center items-start';
+	const defaultClass =
+		'ml-3 flex flex-grow flex-col justify-center items-start stwui-list-item-content';
 	$: finalClass = twMerge(defaultClass, $$props.class);
 </script>
 

diff --git a/src/lib/components/list/Description.svelte b/src/lib/components/list/Description.svelte
@@ -6,7 +6,7 @@
 	import { exclude } from '../../utils/exclude';
 	const forwardEvents = forwardEventsBuilder(get_current_component());
 
-	const defaultClass = 'text-sm mb-0 text-secondary-content';
+	const defaultClass = 'text-sm mb-0 text-secondary-content stwui-list-item-content-description';
 	$: finalClass = twMerge(defaultClass, $$props.class);
 </script>
 

diff --git a/src/lib/components/list/Extra.svelte b/src/lib/components/list/Extra.svelte
@@ -8,7 +8,7 @@
 
 	export let placement: 'start' | 'center' | 'end' = 'start';
 
-	const defaultClass = 'ml-3 flex justify-end flex-shink';
+	const defaultClass = 'ml-3 flex justify-end flex-shink stwui-list-item-extra';
 	$: finalClass = twMerge(defaultClass, $$props.class);
 </script>
 

diff --git a/src/lib/components/list/Item.svelte b/src/lib/components/list/Item.svelte
@@ -9,7 +9,7 @@
 
 	const bordered: boolean = getContext('list-bordered');
 
-	const defaultClass = 'flex py-4';
+	const defaultClass = 'flex py-4 stwui-list-item';
 	const borderedClass = 'px-3';
 
 	$: finalClass = twMerge(

diff --git a/src/lib/components/list/Leading.svelte b/src/lib/components/list/Leading.svelte
@@ -7,7 +7,7 @@
 	const forwardEvents = forwardEventsBuilder(get_current_component());
 
 	const defaultClass =
-		'h-10 w-10 rounded-full bg-primary text-primary-content flex items-center justify-center';
+		'h-10 w-10 rounded-full bg-primary text-primary-content flex items-center justify-center stwui-list-item-leading';
 	$: finalClass = twMerge(defaultClass, $$props.class);
 </script>
 

diff --git a/src/lib/components/list/List.svelte b/src/lib/components/list/List.svelte
@@ -15,6 +15,8 @@
 	const borderedClass = 'border border-border';
 
 	$: finalClass = twMerge(
+		'stwui-list',
+
 		divided ? dividedClass : false,
 		bordered ? borderedClass : false,
 

diff --git a/src/lib/components/list/Placeholder.svelte b/src/lib/components/list/Placeholder.svelte
@@ -17,11 +17,12 @@
 	const placeholder: boolean = getContext('list-avatar-placeholder');
 
 	const defaultClass =
-		'absolute text-content inset-0 h-full w-full flex items-center justify-center overflow-hidden bg-default';
+		'absolute text-content inset-0 h-full w-full flex items-center justify-center overflow-hidden bg-default stwui-list-item-leading-avatar-placeholder';
 	const circleClass = 'rounded-full';
 	const roundedClass = 'rounded-md';
 
-	const defaultIconContainerClass = 'absolute text-content h-full w-full';
+	const defaultIconContainerClass =
+		'absolute text-content h-full w-full stwui-list-item-leading-avatar-placeholder-wrapper';
 	const xsContainerClass = 'bottom-[-0.25rem]';
 	const smContainerClass = 'bottom-[-0.35rem]';
 	const mdContainerClass = 'bottom-[-0.5rem]';

diff --git a/src/lib/components/list/Title.svelte b/src/lib/components/list/Title.svelte
@@ -6,7 +6,7 @@
 	import { exclude } from '../../utils/exclude';
 	const forwardEvents = forwardEventsBuilder(get_current_component());
 
-	const defaultClass = 'text-sm font-semibold text-content';
+	const defaultClass = 'text-sm font-semibold text-content stwui-list-item-content-title';
 	$: finalClass = twMerge(defaultClass, $$props.class);
 </script>