Fix abbr usages in Designer and Sample App

Refs: #6627
public-ui · Nov 4, 2024 · fc8a4e2 · fc8a4e2
1 parent 555e1fc
commit fc8a4e2
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 48 deletions.
diff --git a/packages/designer/src/components/editor/store.tsx b/packages/designer/src/components/editor/store.tsx
@@ -174,32 +174,10 @@ export const components: Record<string, Component> = {
 	'KOL-ABBR': () => (
 		<div class="grid gap-6">
 			<p>
-				Ich bin eine{' '}
-				<KolAbbr _label="Ausführliche Beschreibung" _tooltipAlign="top">
-					ABB
-				</KolAbbr>{' '}
-				mit Tooltip oben
+				Ich <KolAbbr _label="zum Beispiel">z. B.</KolAbbr> bin eine Abkürzung mit Label.
 			</p>
 			<p>
-				Ich bin eine{' '}
-				<KolAbbr _label="Ausführliche Beschreibung" _tooltipAlign="right">
-					ABB
-				</KolAbbr>{' '}
-				mit Tooltip rechts
-			</p>
-			<p>
-				Ich bin eine{' '}
-				<KolAbbr _label="Ausführliche Beschreibung" _tooltipAlign="bottom">
-					ABB
-				</KolAbbr>{' '}
-				mit Tooltip unten
-			</p>
-			<p>
-				Ich bin eine{' '}
-				<KolAbbr _label="Ausführliche Beschreibung" _tooltipAlign="left">
-					ABB
-				</KolAbbr>{' '}
-				mit Tooltip links
+				Ich <KolAbbr>z. B.</KolAbbr> bin eine Abkürzung ohne Label.
 			</p>
 		</div>
 	),

diff --git a/packages/samples/react/src/components/handout/basic.tsx b/packages/samples/react/src/components/handout/basic.tsx
@@ -251,32 +251,11 @@ export const HandoutBasic: FC = () => {
 				<KolCard className="col-span-6 sm:col-span-6 md:col-span-3 xl:col-span-2" _label="Abbreviation and Progress" _level={2}>
 					<div slot="" className="grid gap-2 p-2">
 						<p>
-							I am a{' '}
-							<KolAbbr _label="Detailed description" _tooltipAlign="top">
-								ABB
-							</KolAbbr>{' '}
-							with tooltip at the top
-						</p>
-						<p>
-							I am a{' '}
-							<KolAbbr _label="Detailed description" _tooltipAlign="right">
-								ABB
-							</KolAbbr>{' '}
-							with tooltip on the right
-						</p>
-						<p>
-							I am a{' '}
-							<KolAbbr _label="Detailed description" _tooltipAlign="bottom">
-								ABB
-							</KolAbbr>{' '}
-							with tooltip at the bottom
+							I am <KolAbbr _label="as an example">e.g.</KolAbbr> an abbreviation.
 						</p>
+
 						<p>
-							I am a{' '}
-							<KolAbbr _label="Detailed description" _tooltipAlign="left">
-								ABB
-							</KolAbbr>{' '}
-							with tooltip on the left
+							I am <KolAbbr>e.g.</KolAbbr> an abbreviation without label.
 						</p>
 						<div className="grid grid-cols-2 items-center">
 							<KolProgress _variant="bar" _max={100} _value={33} _label="Progress" />