From d883908e6b9b7b0640ae435aac22d85d5d7ebcbf Mon Sep 17 00:00:00 2001 From: Cyrine Ben Romdhane <135605630+anicyne@users.noreply.github.com> Date: Fri, 19 Jul 2024 07:53:23 +0200 Subject: [PATCH 1/2] Remove KolSpan implementation Refs: #6575 --- .../components/src/components/span/shadow.tsx | 46 ------------------- .../src/components/span/test/html.mock.ts | 16 +------ .../components/span/test/snapshot.spec.tsx | 10 ++-- .../components/src/core/component-names.ts | 2 - packages/components/stencil.config.ts | 1 - 5 files changed, 5 insertions(+), 70 deletions(-) delete mode 100644 packages/components/src/components/span/shadow.tsx diff --git a/packages/components/src/components/span/shadow.tsx b/packages/components/src/components/span/shadow.tsx deleted file mode 100644 index dbbd7d9237..0000000000 --- a/packages/components/src/components/span/shadow.tsx +++ /dev/null @@ -1,46 +0,0 @@ -import type { AccessKeyPropType, KoliBriIconsProp, LabelWithExpertSlotPropType, SpanProps, Stringified } from '../../schema'; -import type { JSX } from '@stencil/core'; -import { Component, h, Prop } from '@stencil/core'; -import { KolSpanWcTag } from '../../core/component-names'; - -/** - * @internal - */ -@Component({ - tag: 'kol-span', - styleUrls: { - default: './style.scss', - }, - shadow: true, -}) -export class KolSpan implements SpanProps { - public render(): JSX.Element { - return ( - - - - ); - } - - /** - * Defines the elements access key. - */ - @Prop() public _accessKey?: AccessKeyPropType; - - /** - * Hides the caption by default and displays the caption text with a tooltip when the - * interactive element is focused or the mouse is over it. - * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved. - */ - @Prop() public _hideLabel?: boolean = false; - - /** - * Defines the g classnames (e.g. `_icons="fa-solid fa-user"`). - */ - @Prop() public _icons?: Stringified; - - /** - * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. - */ - @Prop() public _label!: LabelWithExpertSlotPropType; -} diff --git a/packages/components/src/components/span/test/html.mock.ts b/packages/components/src/components/span/test/html.mock.ts index 5c842895da..582ff007fd 100644 --- a/packages/components/src/components/span/test/html.mock.ts +++ b/packages/components/src/components/span/test/html.mock.ts @@ -38,7 +38,7 @@ export const getSpanWcHtml = ( const hideExpertSlot = !showExpertSlot(state._label); const icon = mapIconProp2State(state._icons as KoliBriIconsProp); - const classNames: string[] = [...(state._hideLabel === true ? [`hide-label`] : []), ...(options?.additionalClassNames ?? [])]; + const classNames: string[] = ['kol-span-wc', ...(state._hideLabel === true ? [`hide-label`] : []), ...(options?.additionalClassNames ?? [])]; return ` @@ -84,17 +84,3 @@ export const getSpanWcHtml = ( } `; }; - -export const getSpanHtml = ( - props: SpanProps, - slots: Slots = { - expert: ``, - }, -): string => { - return ` - - - ${getSpanWcHtml(props, slots, { additionalClassNames: ['kol-span', 'kol-span-wc'] })} - -`; -}; diff --git a/packages/components/src/components/span/test/snapshot.spec.tsx b/packages/components/src/components/span/test/snapshot.spec.tsx index 999260ca43..2de4ae700d 100644 --- a/packages/components/src/components/span/test/snapshot.spec.tsx +++ b/packages/components/src/components/span/test/snapshot.spec.tsx @@ -3,19 +3,17 @@ import { executeTests } from 'stencil-awesome-test'; import { h } from '@stencil/core'; import { newSpecPage } from '@stencil/core/testing'; -import { getSpanHtml } from './html.mock'; - import type { SpecPage } from '@stencil/core/testing'; import type { SpanProps } from '../../../schema'; -import { KolSpan } from '../shadow'; import { KolSpanWc } from '../component'; +import { getSpanWcHtml } from './html.mock'; executeTests( 'Span', async (props): Promise => { const page = await newSpecPage({ - components: [KolSpan, KolSpanWc], - template: () => , + components: [KolSpanWc], + template: () => , }); return page; }, @@ -24,7 +22,7 @@ executeTests( _hideLabel: [true, false], _label: ['Text', ''], }, - getSpanHtml, + getSpanWcHtml, { execMode: 'default', // ready }, diff --git a/packages/components/src/core/component-names.ts b/packages/components/src/core/component-names.ts index 01cd79e4d5..da9f0f21ed 100644 --- a/packages/components/src/core/component-names.ts +++ b/packages/components/src/core/component-names.ts @@ -45,7 +45,6 @@ export let KolProgressTag = 'kol-progress' as const; export let KolQuoteTag = 'kol-quote' as const; export let KolSelectTag = 'kol-select' as const; export let KolSkipNavTag = 'kol-skip-nav' as const; -export let KolSpanTag = 'kol-span' as const; export let KolSpanWcTag = 'kol-span-wc' as const; export let KolSpinTag = 'kol-spin' as const; export let KolSplitButtonTag = 'kol-split-button' as const; @@ -113,7 +112,6 @@ export const setCustomTagNames = (transformTagName: (tagName: string) => string) KolQuoteTag = transformTagName(KolQuoteTag as string) as 'kol-quote'; KolSelectTag = transformTagName(KolSelectTag as string) as 'kol-select'; KolSkipNavTag = transformTagName(KolSkipNavTag as string) as 'kol-skip-nav'; - KolSpanTag = transformTagName(KolSpanTag as string) as 'kol-span'; KolSpanWcTag = transformTagName(KolSpanWcTag as string) as 'kol-span-wc'; KolSpinTag = transformTagName(KolSpinTag as string) as 'kol-spin'; KolSplitButtonTag = transformTagName(KolSplitButtonTag as string) as 'kol-split-button'; diff --git a/packages/components/stencil.config.ts b/packages/components/stencil.config.ts index 5a59eba2e0..ed3ab1469d 100644 --- a/packages/components/stencil.config.ts +++ b/packages/components/stencil.config.ts @@ -77,7 +77,6 @@ const EXCLUDE_TAGS = [ 'kol-input', 'kol-link-wc', 'kol-popover-wc', - 'kol-span', 'kol-span-wc', 'kol-table-stateless-wc', 'kol-tooltip-wc', From e16f4c22a6b6736db8643e0e31769a9ca7979d6a Mon Sep 17 00:00:00 2001 From: Cyrine Ben Romdhane <135605630+anicyne@users.noreply.github.com> Date: Fri, 19 Jul 2024 08:06:48 +0200 Subject: [PATCH 2/2] Remove KolSpan from component-list.ts Refs: #6575 --- packages/components/src/components/component-list.ts | 2 -- 1 file changed, 2 deletions(-) diff --git a/packages/components/src/components/component-list.ts b/packages/components/src/components/component-list.ts index a132f312a6..f86c6c56fc 100644 --- a/packages/components/src/components/component-list.ts +++ b/packages/components/src/components/component-list.ts @@ -45,7 +45,6 @@ import { KolProcess } from './progress/shadow'; import { KolQuote } from './quote/shadow'; import { KolSelect } from './select/shadow'; import { KolSkipNav } from './skip-nav/shadow'; -import { KolSpan } from './span/shadow'; import { KolSpanWc } from './span/component'; import { KolSpin } from './spin/shadow'; import { KolSplitButton } from './split-button/shadow'; @@ -112,7 +111,6 @@ export const COMPONENTS = [ KolQuote, KolSelect, KolSkipNav, - KolSpan, KolSpanWc, KolSpin, KolSplitButton,