fix

Refs: #6960
public-ui · Nov 6, 2024 · f6e4f56 · f6e4f56
1 parent c71218f
commit f6e4f56
Show file tree

Hide file tree

Showing 5 changed files with 86 additions and 5 deletions.
diff --git a/packages/components/src/components/badge/test/__snapshots__/snapshot.spec.tsx.snap b/packages/components/src/components/badge/test/__snapshots__/snapshot.spec.tsx.snap
@@ -6,6 +6,12 @@ exports[`kol-badge should render with _label="**Te**xt" 1`] = `
     <span style="background-color: #000; color: #959595;">
       <span class="kol-span-wc">
         <span>
+          <span class="md span-label">
+            <strong>
+              Te
+            </strong>
+            xt
+          </span>
           <span aria-hidden="true" class="span-label" hidden=""></span>
         </span>
       </span>
@@ -20,6 +26,9 @@ exports[`kol-badge should render with _label="Text" _color="#000000" 1`] = `
     <span style="background-color: #000; color: #959595;">
       <span class="kol-span-wc">
         <span>
+          <span class="md span-label">
+            Text
+          </span>
           <span aria-hidden="true" class="span-label" hidden=""></span>
         </span>
       </span>
@@ -35,6 +44,9 @@ exports[`kol-badge should render with _label="Text" _icons="codicon codicon-home
       <span class="kol-span-wc">
         <span>
           <kol-icon _icons="codicon codicon-home" _label="" class="icon left"></kol-icon>
+          <span class="md span-label">
+            Text
+          </span>
           <span aria-hidden="true" class="span-label" hidden=""></span>
         </span>
       </span>
@@ -50,6 +62,9 @@ exports[`kol-badge should render with _label="Text" _icons="codicon codicon-home
       <span class="kol-span-wc">
         <span>
           <kol-icon _icons="codicon codicon-home" _label="" class="icon left"></kol-icon>
+          <span class="md span-label">
+            Text
+          </span>
           <span aria-hidden="true" class="span-label" hidden=""></span>
         </span>
       </span>
@@ -64,6 +79,9 @@ exports[`kol-badge should render with _label="Text" 1`] = `
     <span style="background-color: #000; color: #959595;">
       <span class="kol-span-wc">
         <span>
+          <span class="md span-label">
+            Text
+          </span>
           <span aria-hidden="true" class="span-label" hidden=""></span>
         </span>
       </span>

diff --git a/packages/components/src/components/button/test/__snapshots__/snapshot.spec.tsx.snap b/packages/components/src/components/button/test/__snapshots__/snapshot.spec.tsx.snap
@@ -8,6 +8,9 @@ exports[`kol-button should render with _label="Label" _ariaDescription="Aria Des
       <button aria-describedby="nonce" class="button normal" type="button">
         <span class="button-inner kol-span-wc">
           <span>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -31,6 +34,9 @@ exports[`kol-button should render with _label="Label" _disabled=false 1`] = `
       <button class="button normal" type="button">
         <span class="button-inner kol-span-wc">
           <span>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -51,6 +57,9 @@ exports[`kol-button should render with _label="Label" _disabled=true 1`] = `
       <button class="button disabled normal" disabled="" type="button">
         <span class="button-inner kol-span-wc">
           <span>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -71,6 +80,9 @@ exports[`kol-button should render with _label="Label" _value="Hello" 1`] = `
       <button class="button normal" type="button">
         <span class="button-inner kol-span-wc">
           <span>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -91,6 +103,9 @@ exports[`kol-button should render with _label="Label" _variant="danger" 1`] = `
       <button class="button danger" type="button">
         <span class="button-inner kol-span-wc">
           <span>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -111,6 +126,9 @@ exports[`kol-button should render with _label="Label" _variant="ghost" 1`] = `
       <button class="button ghost" type="button">
         <span class="button-inner kol-span-wc">
           <span>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -131,6 +149,9 @@ exports[`kol-button should render with _label="Label" _variant="normal" 1`] = `
       <button class="button normal" type="button">
         <span class="button-inner kol-span-wc">
           <span>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -151,6 +172,9 @@ exports[`kol-button should render with _label="Label" _variant="primary" 1`] = `
       <button class="button primary" type="button">
         <span class="button-inner kol-span-wc">
           <span>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -171,6 +195,9 @@ exports[`kol-button should render with _label="Label" _variant="secondary" 1`] =
       <button class="button secondary" type="button">
         <span class="button-inner kol-span-wc">
           <span>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -191,6 +218,9 @@ exports[`kol-button should render with _label="Label" 1`] = `
       <button class="button normal" type="button">
         <span class="button-inner kol-span-wc">
           <span>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>

diff --git a/packages/components/src/components/link/test/__snapshots__/snapshot.spec.tsx.snap b/packages/components/src/components/link/test/__snapshots__/snapshot.spec.tsx.snap
@@ -9,6 +9,9 @@ exports[`kol-link should render with _href="https://google.de" _icons="codicon c
         <span class="kol-span-wc">
           <span>
             <kol-icon _icons="codicon codicon-home" _label="" class="icon left"></kol-icon>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -31,6 +34,9 @@ exports[`kol-link should render with _href="https://google.de" _icons="codicon c
         <span class="kol-span-wc">
           <span>
             <kol-icon _icons="codicon codicon-home" _label="" class="icon left"></kol-icon>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -53,6 +59,9 @@ exports[`kol-link should render with _href="https://google.de" _icons="codicon c
         <span class="kol-span-wc">
           <span>
             <kol-icon _icons="codicon codicon-home" _label="" class="icon left"></kol-icon>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -97,6 +106,9 @@ exports[`kol-link should render with _href="https://google.de" _icons="codicon c
         <span class="kol-span-wc">
           <span>
             <kol-icon _icons="codicon codicon-home" _label="" class="icon left"></kol-icon>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -119,6 +131,9 @@ exports[`kol-link should render with _href="https://google.de" _icons="codicon c
         <span class="kol-span-wc">
           <span>
             <kol-icon _icons="codicon codicon-home" _label="" class="icon left"></kol-icon>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>
@@ -140,6 +155,9 @@ exports[`kol-link should render with _label="Label" _href="" _download="download
       <a class="external-link" download="download-file.zip" href="javascript:void(0);" rel="noopener" target="blank">
         <span class="kol-span-wc">
           <span>
+            <span class="span-label">
+              Label
+            </span>
             <span aria-hidden="true" class="span-label" hidden="">
               <slot name="expert" slot="expert"></slot>
             </span>

diff --git a/packages/components/src/components/tooltip/test/__snapshots__/snapshot.spec.tsx.snap b/packages/components/src/components/tooltip/test/__snapshots__/snapshot.spec.tsx.snap
@@ -6,6 +6,9 @@ exports[`kol-tooltip-wc should render with _id="id" _label="Label" _align="botto
     <div class="tooltip-area tooltip-arrow"></div>
     <span class="kol-span-wc tooltip-area tooltip-content" id="id">
       <span>
+        <span class="span-label">
+          Label
+        </span>
         <span aria-hidden="true" class="span-label" hidden=""></span>
       </span>
     </span>
@@ -19,6 +22,9 @@ exports[`kol-tooltip-wc should render with _id="id" _label="Label" _align="left"
     <div class="tooltip-area tooltip-arrow"></div>
     <span class="kol-span-wc tooltip-area tooltip-content" id="id">
       <span>
+        <span class="span-label">
+          Label
+        </span>
         <span aria-hidden="true" class="span-label" hidden=""></span>
       </span>
     </span>
@@ -32,6 +38,9 @@ exports[`kol-tooltip-wc should render with _id="id" _label="Label" _align="right
     <div class="tooltip-area tooltip-arrow"></div>
     <span class="kol-span-wc tooltip-area tooltip-content" id="id">
       <span>
+        <span class="span-label">
+          Label
+        </span>
         <span aria-hidden="true" class="span-label" hidden=""></span>
       </span>
     </span>
@@ -45,6 +54,9 @@ exports[`kol-tooltip-wc should render with _id="id" _label="Label" _align="top"
     <div class="tooltip-area tooltip-arrow"></div>
     <span class="kol-span-wc tooltip-area tooltip-content" id="id">
       <span>
+        <span class="span-label">
+          Label
+        </span>
         <span aria-hidden="true" class="span-label" hidden=""></span>
       </span>
     </span>
@@ -58,6 +70,9 @@ exports[`kol-tooltip-wc should render with _id="id" _label="Label" 1`] = `
     <div class="tooltip-area tooltip-arrow"></div>
     <span class="kol-span-wc tooltip-area tooltip-content" id="id">
       <span>
+        <span class="span-label">
+          Label
+        </span>
         <span aria-hidden="true" class="span-label" hidden=""></span>
       </span>
     </span>

diff --git a/packages/components/src/functional-components/Span/Span.tsx b/packages/components/src/functional-components/Span/Span.tsx
@@ -60,12 +60,14 @@ const LabelHelper: FC<{ label: string; hideLabel?: boolean; accessKey?: string;
 };
 
 const SpanCoreHelper: FC<{ label: string; hideLabel?: boolean; accessKey?: string; hideExpertSlot?: boolean; allowMarkdown?: boolean }> = (
-	{ hideLabel, label, accessKey, hideExpertSlot, allowMarkdown },
+	{ hideLabel, label, accessKey, allowMarkdown },
 	children,
 ) => {
+	const hideExpertSlot = !showExpertSlot(label);
+
 	return (
 		<>
-			{!hideExpertSlot && <LabelHelper label={label} hideLabel={hideLabel} accessKey={accessKey} allowMarkdown={allowMarkdown} />}
+			{hideExpertSlot && <LabelHelper label={label} hideLabel={hideLabel} accessKey={accessKey} allowMarkdown={allowMarkdown} />}
 			<span aria-hidden={hideExpertSlot ? 'true' : undefined} class="span-label" hidden={hideExpertSlot}>
 				{children}
 			</span>
@@ -92,14 +94,12 @@ const KolSpanFc: FC<SpanProps> = (props, children) => {
 		};
 	}
 
-	const hideExpertSlot = !showExpertSlot(label);
-
 	return (
 		<span class={clsx('kol-span-wc', { 'hide-label': hideLabel }, classNames)} {...other}>
 			{Utils.isObject(TopIconProps) && <IconHelper class="top" {...TopIconProps} />}
 			<span>
 				{Utils.isObject(LeftIconProps) && <IconHelper class="left" {...LeftIconProps} />}
-				<SpanCoreHelper label={label} hideLabel={hideLabel} allowMarkdown={allowMarkdown} accessKey={accessKey} hideExpertSlot={hideExpertSlot}>
+				<SpanCoreHelper label={label} hideLabel={hideLabel} allowMarkdown={allowMarkdown} accessKey={accessKey}>
 					{children}
 				</SpanCoreHelper>
 				{Utils.isObject(RightIconProps) && <IconHelper class="right" {...RightIconProps} />}