@lilydesignsystem/svelte-headless 0.1.0 → 0.3.0

package/dist/components/SchweizAhvNummerInput/SchweizAhvNummerInput.svelte

@@ -0,0 +1,55 @@
+<script lang="ts">
+    // SchweizAhvNummerInput component
+    //
+    // A headless input for entering Switzerland's AHV-Nummer / Numéro AVS.
+    // Format: Thirteen digits, displayed as 756.NNNN.NNNN.NN, always beginning with the country prefix 756. It is a valid EAN-13 barcode number: the final digit is an EAN-13 check digit computed over the twelve preceding digits (alternating-position weights of 1 and 3). Replaced the old 11-digit AHV card number on 1 July 2008.
+    //
+    // Props:
+    //   className — string, optional. CSS class name.
+    //   label — string, required. Accessible label for screen readers via aria-label.
+    //   value — string, default "". Bindable input value; supports bind:value.
+    //   required — boolean, default false. Whether the input is required for form submission.
+    //   disabled — boolean, default false. Whether the input is disabled.
+    //   ...restProps — additional HTML attributes spread onto the <input>.
+    //
+    // Syntax:
+    //   <SchweizAhvNummerInput label="AHV-Nummer / Numéro AVS" bind:value />
+    //
+    // Accessibility:
+    //   - aria-label provides the accessible name for screen readers
+    //   - autocomplete="off" protects sensitive identifiers
+    //   - required and disabled states are conveyed to assistive technology
+    //
+    // Internationalization:
+    //   - The label prop externalizes user-facing text for translation
+    //
+    // References:
+    //   - https://en.wikipedia.org/wiki/Data_codes_for_Switzerland
+
+    let {
+        class: className = "",
+        label,
+        value = $bindable(""),
+        required = false,
+        disabled = false,
+        ...restProps
+    }: {
+        label: string;
+        value?: string;
+        required?: boolean;
+        disabled?: boolean;
+        [key: string]: unknown;
+    } = $props();
+</script>
+
+<!-- SchweizAhvNummerInput.svelte -->
+<input
+    class={`schweiz-ahv-nummer-input ${className}`}
+    type="text"
+    aria-label={label}
+    autocomplete="off"
+    bind:value
+    {required}
+    {disabled}
+    {...restProps}
+/>

package/dist/components/SchweizAhvNummerInput/SchweizAhvNummerInput.svelte.d.ts

@@ -0,0 +1,10 @@
+type $$ComponentProps = {
+    label: string;
+    value?: string;
+    required?: boolean;
+    disabled?: boolean;
+    [key: string]: unknown;
+};
+declare const SchweizAhvNummerInput: import("svelte").Component<$$ComponentProps, {}, "value">;
+type SchweizAhvNummerInput = ReturnType<typeof SchweizAhvNummerInput>;
+export default SchweizAhvNummerInput;

package/dist/components/SchweizAhvNummerView/SchweizAhvNummerView.svelte

@@ -0,0 +1,40 @@
+<script lang="ts">
+    // SchweizAhvNummerView component
+    //
+    // A headless display component for showing Switzerland's
+    // AHV-Nummer / Numéro AVS in a read-only format.
+    // Format: Thirteen digits, displayed as 756.NNNN.NNNN.NN, always beginning with the country prefix 756. It is a valid EAN-13 barcode number: the final digit is an EAN-13 check digit computed over the twelve preceding digits (alternating-position weights of 1 and 3). Replaced the old 11-digit AHV card number on 1 July 2008.
+    //
+    // Props:
+    //   className — string, optional. CSS class name.
+    //   label — string, required. Accessible label for screen readers via aria-label.
+    //   value — string, default "". The identifier string to display.
+    //   ...restProps — additional HTML attributes spread onto the <span>.
+    //
+    // Syntax:
+    //   <SchweizAhvNummerView label="AHV-Nummer / Numéro AVS" value={value} />
+    //
+    // Accessibility:
+    //   - aria-label provides the accessible name so screen readers announce the purpose
+    //
+    // References:
+    //   - https://en.wikipedia.org/wiki/Data_codes_for_Switzerland
+
+    let {
+        class: className = "",
+        label,
+        value = "",
+        ...restProps
+    }: {
+        label: string;
+        value?: string;
+        [key: string]: unknown;
+    } = $props();
+</script>
+
+<!-- SchweizAhvNummerView.svelte -->
+<span
+    class={`schweiz-ahv-nummer-view ${className}`}
+    aria-label={label}
+    {...restProps}>{value}</span
+>

package/dist/components/SchweizAhvNummerView/SchweizAhvNummerView.svelte.d.ts

@@ -0,0 +1,8 @@
+type $$ComponentProps = {
+    label: string;
+    value?: string;
+    [key: string]: unknown;
+};
+declare const SchweizAhvNummerView: import("svelte").Component<$$ComponentProps, {}, "">;
+type SchweizAhvNummerView = ReturnType<typeof SchweizAhvNummerView>;
+export default SchweizAhvNummerView;

package/dist/components/ShowMore/ShowMore.svelte

@@ -0,0 +1,64 @@
+<script lang="ts">
+    // ShowMore component
+    //
+    // A headless "show more / show less" toggle for long content. The content
+    // stays in the accessibility tree at all times; collapsing is a visual clamp
+    // the consumer applies in CSS keyed on data-expanded. (Use Expander when the
+    // content should be removed from the DOM while collapsed.)
+    //
+    // Props:
+    //   className — string, optional. CSS class name.
+    //   moreLabel — string, required. Button text while collapsed. No default.
+    //   lessLabel — string, required. Button text while expanded. No default.
+    //   expanded — boolean, default false. Bindable.
+    //   children — Snippet. The content.
+    //   ...restProps — additional HTML attributes spread onto the root <div>.
+    //
+    // Keyboard:
+    //   - Enter / Space on the native button toggles
+    //
+    // Accessibility:
+    //   - button aria-expanded + aria-controls pointing at the content id
+    //
+    // Claude rules:
+    //   - Headless: no inline style; the clamp is consumer CSS on [data-expanded="false"]
+    import type { Snippet } from "svelte";
+
+    let {
+        class: className = "",
+        moreLabel,
+        lessLabel,
+        expanded = $bindable(false),
+        children,
+        ...restProps
+    }: {
+        /** Button text while collapsed. */
+        moreLabel: string;
+        /** Button text while expanded. */
+        lessLabel: string;
+        /** Whether the content is expanded. Bindable. */
+        expanded?: boolean;
+        /** The content. */
+        children?: Snippet;
+        [key: string]: unknown;
+    } = $props();
+
+    const uid = $props.id();
+    const contentId = `show-more-${uid}`;
+</script>
+
+<!-- ShowMore.svelte -->
+<div class={`show-more ${className}`} {...restProps}>
+    <div class="show-more-content" id={contentId} data-expanded={expanded}>
+        {@render children?.()}
+    </div>
+    <button
+        type="button"
+        class="show-more-button"
+        aria-expanded={expanded}
+        aria-controls={contentId}
+        onclick={() => (expanded = !expanded)}
+    >
+        {expanded ? lessLabel : moreLabel}
+    </button>
+</div>

package/dist/components/ShowMore/ShowMore.svelte.d.ts

@@ -0,0 +1,15 @@
+import type { Snippet } from "svelte";
+type $$ComponentProps = {
+    /** Button text while collapsed. */
+    moreLabel: string;
+    /** Button text while expanded. */
+    lessLabel: string;
+    /** Whether the content is expanded. Bindable. */
+    expanded?: boolean;
+    /** The content. */
+    children?: Snippet;
+    [key: string]: unknown;
+};
+declare const ShowMore: import("svelte").Component<$$ComponentProps, {}, "expanded">;
+type ShowMore = ReturnType<typeof ShowMore>;
+export default ShowMore;

package/dist/components/SingaporeNationalRegistrationIdentityCardInput/SingaporeNationalRegistrationIdentityCardInput.svelte

@@ -0,0 +1,55 @@
+<script lang="ts">
+    // SingaporeNationalRegistrationIdentityCardInput component
+    //
+    // A headless input for entering Singapore's National Registration Identity Card Number / Foreign Identification Number (NRIC/FIN).
+    // Format: One letter (S or T for citizens/permanent residents; F or G for long-term foreign residents; M for newer FIN series), seven digits, and a trailing check letter. The check letter is computed by multiplying the seven digits by fixed weights (2,7,6,5,4,3,2), summing the products (adding 4 for a G/T prefix or 3 for an M prefix), taking the sum Modulus 11, and mapping (10 - remainder) through a lookup table to a letter.
+    //
+    // Props:
+    //   className — string, optional. CSS class name.
+    //   label — string, required. Accessible label for screen readers via aria-label.
+    //   value — string, default "". Bindable input value; supports bind:value.
+    //   required — boolean, default false. Whether the input is required for form submission.
+    //   disabled — boolean, default false. Whether the input is disabled.
+    //   ...restProps — additional HTML attributes spread onto the <input>.
+    //
+    // Syntax:
+    //   <SingaporeNationalRegistrationIdentityCardInput label="National Registration Identity Card Number / Foreign Identification Number (NRIC/FIN)" bind:value />
+    //
+    // Accessibility:
+    //   - aria-label provides the accessible name for screen readers
+    //   - autocomplete="off" protects sensitive identifiers
+    //   - required and disabled states are conveyed to assistive technology
+    //
+    // Internationalization:
+    //   - The label prop externalizes user-facing text for translation
+    //
+    // References:
+    //   - https://en.wikipedia.org/wiki/National_Registration_Identity_Card
+
+    let {
+        class: className = "",
+        label,
+        value = $bindable(""),
+        required = false,
+        disabled = false,
+        ...restProps
+    }: {
+        label: string;
+        value?: string;
+        required?: boolean;
+        disabled?: boolean;
+        [key: string]: unknown;
+    } = $props();
+</script>
+
+<!-- SingaporeNationalRegistrationIdentityCardInput.svelte -->
+<input
+    class={`singapore-national-registration-identity-card-input ${className}`}
+    type="text"
+    aria-label={label}
+    autocomplete="off"
+    bind:value
+    {required}
+    {disabled}
+    {...restProps}
+/>

package/dist/components/SingaporeNationalRegistrationIdentityCardInput/SingaporeNationalRegistrationIdentityCardInput.svelte.d.ts

@@ -0,0 +1,10 @@
+type $$ComponentProps = {
+    label: string;
+    value?: string;
+    required?: boolean;
+    disabled?: boolean;
+    [key: string]: unknown;
+};
+declare const SingaporeNationalRegistrationIdentityCardInput: import("svelte").Component<$$ComponentProps, {}, "value">;
+type SingaporeNationalRegistrationIdentityCardInput = ReturnType<typeof SingaporeNationalRegistrationIdentityCardInput>;
+export default SingaporeNationalRegistrationIdentityCardInput;

package/dist/components/SingaporeNationalRegistrationIdentityCardView/SingaporeNationalRegistrationIdentityCardView.svelte

@@ -0,0 +1,40 @@
+<script lang="ts">
+    // SingaporeNationalRegistrationIdentityCardView component
+    //
+    // A headless display component for showing Singapore's
+    // National Registration Identity Card Number / Foreign Identification Number (NRIC/FIN) in a read-only format.
+    // Format: One letter (S or T for citizens/permanent residents; F or G for long-term foreign residents; M for newer FIN series), seven digits, and a trailing check letter. The check letter is computed by multiplying the seven digits by fixed weights (2,7,6,5,4,3,2), summing the products (adding 4 for a G/T prefix or 3 for an M prefix), taking the sum Modulus 11, and mapping (10 - remainder) through a lookup table to a letter.
+    //
+    // Props:
+    //   className — string, optional. CSS class name.
+    //   label — string, required. Accessible label for screen readers via aria-label.
+    //   value — string, default "". The identifier string to display.
+    //   ...restProps — additional HTML attributes spread onto the <span>.
+    //
+    // Syntax:
+    //   <SingaporeNationalRegistrationIdentityCardView label="National Registration Identity Card Number / Foreign Identification Number (NRIC/FIN)" value={value} />
+    //
+    // Accessibility:
+    //   - aria-label provides the accessible name so screen readers announce the purpose
+    //
+    // References:
+    //   - https://en.wikipedia.org/wiki/National_Registration_Identity_Card
+
+    let {
+        class: className = "",
+        label,
+        value = "",
+        ...restProps
+    }: {
+        label: string;
+        value?: string;
+        [key: string]: unknown;
+    } = $props();
+</script>
+
+<!-- SingaporeNationalRegistrationIdentityCardView.svelte -->
+<span
+    class={`singapore-national-registration-identity-card-view ${className}`}
+    aria-label={label}
+    {...restProps}>{value}</span
+>

package/dist/components/SingaporeNationalRegistrationIdentityCardView/SingaporeNationalRegistrationIdentityCardView.svelte.d.ts

@@ -0,0 +1,8 @@
+type $$ComponentProps = {
+    label: string;
+    value?: string;
+    [key: string]: unknown;
+};
+declare const SingaporeNationalRegistrationIdentityCardView: import("svelte").Component<$$ComponentProps, {}, "">;
+type SingaporeNationalRegistrationIdentityCardView = ReturnType<typeof SingaporeNationalRegistrationIdentityCardView>;
+export default SingaporeNationalRegistrationIdentityCardView;

package/dist/components/SouthAfricaIdentityNumberInput/SouthAfricaIdentityNumberInput.svelte

@@ -0,0 +1,55 @@
+<script lang="ts">
+    // SouthAfricaIdentityNumberInput component
+    //
+    // A headless input for entering South Africa's South African Identity Number.
+    // Format: Thirteen digits in the form YYMMDDSSSSCAZ: the first six encode date of birth; the next four encode sex (0000-4999 female, 5000-9999 male); the eleventh digit encodes citizenship status (0 citizen, 1 permanent resident, 2 refugee); the twelfth is a legacy field fixed at 8 on modern cards; the thirteenth is a Luhn (Modulus-10) check digit over the preceding twelve.
+    //
+    // Props:
+    //   className — string, optional. CSS class name.
+    //   label — string, required. Accessible label for screen readers via aria-label.
+    //   value — string, default "". Bindable input value; supports bind:value.
+    //   required — boolean, default false. Whether the input is required for form submission.
+    //   disabled — boolean, default false. Whether the input is disabled.
+    //   ...restProps — additional HTML attributes spread onto the <input>.
+    //
+    // Syntax:
+    //   <SouthAfricaIdentityNumberInput label="South African Identity Number" bind:value />
+    //
+    // Accessibility:
+    //   - aria-label provides the accessible name for screen readers
+    //   - autocomplete="off" protects sensitive identifiers
+    //   - required and disabled states are conveyed to assistive technology
+    //
+    // Internationalization:
+    //   - The label prop externalizes user-facing text for translation
+    //
+    // References:
+    //   - https://en.wikipedia.org/wiki/South_African_identity_card
+
+    let {
+        class: className = "",
+        label,
+        value = $bindable(""),
+        required = false,
+        disabled = false,
+        ...restProps
+    }: {
+        label: string;
+        value?: string;
+        required?: boolean;
+        disabled?: boolean;
+        [key: string]: unknown;
+    } = $props();
+</script>
+
+<!-- SouthAfricaIdentityNumberInput.svelte -->
+<input
+    class={`south-africa-identity-number-input ${className}`}
+    type="text"
+    aria-label={label}
+    autocomplete="off"
+    bind:value
+    {required}
+    {disabled}
+    {...restProps}
+/>

package/dist/components/SouthAfricaIdentityNumberInput/SouthAfricaIdentityNumberInput.svelte.d.ts

@@ -0,0 +1,10 @@
+type $$ComponentProps = {
+    label: string;
+    value?: string;
+    required?: boolean;
+    disabled?: boolean;
+    [key: string]: unknown;
+};
+declare const SouthAfricaIdentityNumberInput: import("svelte").Component<$$ComponentProps, {}, "value">;
+type SouthAfricaIdentityNumberInput = ReturnType<typeof SouthAfricaIdentityNumberInput>;
+export default SouthAfricaIdentityNumberInput;

package/dist/components/SouthAfricaIdentityNumberView/SouthAfricaIdentityNumberView.svelte

@@ -0,0 +1,40 @@
+<script lang="ts">
+    // SouthAfricaIdentityNumberView component
+    //
+    // A headless display component for showing South Africa's
+    // South African Identity Number in a read-only format.
+    // Format: Thirteen digits in the form YYMMDDSSSSCAZ: the first six encode date of birth; the next four encode sex (0000-4999 female, 5000-9999 male); the eleventh digit encodes citizenship status (0 citizen, 1 permanent resident, 2 refugee); the twelfth is a legacy field fixed at 8 on modern cards; the thirteenth is a Luhn (Modulus-10) check digit over the preceding twelve.
+    //
+    // Props:
+    //   className — string, optional. CSS class name.
+    //   label — string, required. Accessible label for screen readers via aria-label.
+    //   value — string, default "". The identifier string to display.
+    //   ...restProps — additional HTML attributes spread onto the <span>.
+    //
+    // Syntax:
+    //   <SouthAfricaIdentityNumberView label="South African Identity Number" value={value} />
+    //
+    // Accessibility:
+    //   - aria-label provides the accessible name so screen readers announce the purpose
+    //
+    // References:
+    //   - https://en.wikipedia.org/wiki/South_African_identity_card
+
+    let {
+        class: className = "",
+        label,
+        value = "",
+        ...restProps
+    }: {
+        label: string;
+        value?: string;
+        [key: string]: unknown;
+    } = $props();
+</script>
+
+<!-- SouthAfricaIdentityNumberView.svelte -->
+<span
+    class={`south-africa-identity-number-view ${className}`}
+    aria-label={label}
+    {...restProps}>{value}</span
+>

package/dist/components/SouthAfricaIdentityNumberView/SouthAfricaIdentityNumberView.svelte.d.ts

@@ -0,0 +1,8 @@
+type $$ComponentProps = {
+    label: string;
+    value?: string;
+    [key: string]: unknown;
+};
+declare const SouthAfricaIdentityNumberView: import("svelte").Component<$$ComponentProps, {}, "">;
+type SouthAfricaIdentityNumberView = ReturnType<typeof SouthAfricaIdentityNumberView>;
+export default SouthAfricaIdentityNumberView;

package/dist/components/Thinking/Thinking.svelte

@@ -0,0 +1,58 @@
+<script lang="ts">
+    // Thinking component
+    //
+    // A headless disclosure for an AI assistant's reasoning / "thinking" trace,
+    // built on the native <details>. Closed by default. While `streaming` the root
+    // carries data-streaming and aria-busy so consumer CSS/AT know it is still filling.
+    //
+    // Props:
+    //   className — string, optional. CSS class name.
+    //   label — string, required. The summary text. No default.
+    //   open — boolean, default false. Bindable.
+    //   streaming — boolean, default false. Adds data-streaming="true" + aria-busy="true" when true.
+    //   children — Snippet. The reasoning content.
+    //   ...restProps — additional HTML attributes spread onto the root <details>.
+    //
+    // Keyboard:
+    //   - Enter / Space on the native <summary> toggles
+    //
+    // Accessibility:
+    //   - Native details/summary semantics; aria-busy only while streaming
+    //
+    // Claude rules:
+    //   - Headless: no CSS, no animation, no hardcoded strings
+    import type { Snippet } from "svelte";
+
+    let {
+        class: className = "",
+        label,
+        open = $bindable(false),
+        streaming = false,
+        children,
+        ...restProps
+    }: {
+        /** Summary text. */
+        label: string;
+        /** Whether open. Bindable. */
+        open?: boolean;
+        /** Whether content is still being produced. */
+        streaming?: boolean;
+        /** Reasoning content. */
+        children?: Snippet;
+        [key: string]: unknown;
+    } = $props();
+</script>
+
+<!-- Thinking.svelte -->
+<details
+    class={`thinking ${className}`}
+    bind:open
+    data-streaming={streaming ? "true" : undefined}
+    aria-busy={streaming ? "true" : undefined}
+    {...restProps}
+>
+    <summary class="thinking-summary">{label}</summary>
+    <div class="thinking-content">
+        {@render children?.()}
+    </div>
+</details>

package/dist/components/Thinking/Thinking.svelte.d.ts

@@ -0,0 +1,15 @@
+import type { Snippet } from "svelte";
+type $$ComponentProps = {
+    /** Summary text. */
+    label: string;
+    /** Whether open. Bindable. */
+    open?: boolean;
+    /** Whether content is still being produced. */
+    streaming?: boolean;
+    /** Reasoning content. */
+    children?: Snippet;
+    [key: string]: unknown;
+};
+declare const Thinking: import("svelte").Component<$$ComponentProps, {}, "open">;
+type Thinking = ReturnType<typeof Thinking>;
+export default Thinking;

package/dist/components/TurkiyeTcKimlikNumarasiInput/TurkiyeTcKimlikNumarasiInput.svelte

@@ -0,0 +1,55 @@
+<script lang="ts">
+    // TurkiyeTcKimlikNumarasiInput component
+    //
+    // A headless input for entering Turkey's T.C. Kimlik Numarası.
+    // Format: Eleven digits, the first never zero. The tenth digit is the units digit of ((sum of digits 1,3,5,7,9) × 7) plus ((sum of digits 2,4,6,8) × 9); the eleventh digit is the units digit of the sum of the first ten digits. The eleventh digit is always even.
+    //
+    // Props:
+    //   className — string, optional. CSS class name.
+    //   label — string, required. Accessible label for screen readers via aria-label.
+    //   value — string, default "". Bindable input value; supports bind:value.
+    //   required — boolean, default false. Whether the input is required for form submission.
+    //   disabled — boolean, default false. Whether the input is disabled.
+    //   ...restProps — additional HTML attributes spread onto the <input>.
+    //
+    // Syntax:
+    //   <TurkiyeTcKimlikNumarasiInput label="T.C. Kimlik Numarası" bind:value />
+    //
+    // Accessibility:
+    //   - aria-label provides the accessible name for screen readers
+    //   - autocomplete="off" protects sensitive identifiers
+    //   - required and disabled states are conveyed to assistive technology
+    //
+    // Internationalization:
+    //   - The label prop externalizes user-facing text for translation
+    //
+    // References:
+    //   - https://en.wikipedia.org/wiki/Turkish_Identification_Number
+
+    let {
+        class: className = "",
+        label,
+        value = $bindable(""),
+        required = false,
+        disabled = false,
+        ...restProps
+    }: {
+        label: string;
+        value?: string;
+        required?: boolean;
+        disabled?: boolean;
+        [key: string]: unknown;
+    } = $props();
+</script>
+
+<!-- TurkiyeTcKimlikNumarasiInput.svelte -->
+<input
+    class={`turkiye-tc-kimlik-numarasi-input ${className}`}
+    type="text"
+    aria-label={label}
+    autocomplete="off"
+    bind:value
+    {required}
+    {disabled}
+    {...restProps}
+/>

package/dist/components/TurkiyeTcKimlikNumarasiInput/TurkiyeTcKimlikNumarasiInput.svelte.d.ts

@@ -0,0 +1,10 @@
+type $$ComponentProps = {
+    label: string;
+    value?: string;
+    required?: boolean;
+    disabled?: boolean;
+    [key: string]: unknown;
+};
+declare const TurkiyeTcKimlikNumarasiInput: import("svelte").Component<$$ComponentProps, {}, "value">;
+type TurkiyeTcKimlikNumarasiInput = ReturnType<typeof TurkiyeTcKimlikNumarasiInput>;
+export default TurkiyeTcKimlikNumarasiInput;

package/dist/components/TurkiyeTcKimlikNumarasiView/TurkiyeTcKimlikNumarasiView.svelte

@@ -0,0 +1,40 @@
+<script lang="ts">
+    // TurkiyeTcKimlikNumarasiView component
+    //
+    // A headless display component for showing Turkey's
+    // T.C. Kimlik Numarası in a read-only format.
+    // Format: Eleven digits, the first never zero. The tenth digit is the units digit of ((sum of digits 1,3,5,7,9) × 7) plus ((sum of digits 2,4,6,8) × 9); the eleventh digit is the units digit of the sum of the first ten digits. The eleventh digit is always even.
+    //
+    // Props:
+    //   className — string, optional. CSS class name.
+    //   label — string, required. Accessible label for screen readers via aria-label.
+    //   value — string, default "". The identifier string to display.
+    //   ...restProps — additional HTML attributes spread onto the <span>.
+    //
+    // Syntax:
+    //   <TurkiyeTcKimlikNumarasiView label="T.C. Kimlik Numarası" value={value} />
+    //
+    // Accessibility:
+    //   - aria-label provides the accessible name so screen readers announce the purpose
+    //
+    // References:
+    //   - https://en.wikipedia.org/wiki/Turkish_Identification_Number
+
+    let {
+        class: className = "",
+        label,
+        value = "",
+        ...restProps
+    }: {
+        label: string;
+        value?: string;
+        [key: string]: unknown;
+    } = $props();
+</script>
+
+<!-- TurkiyeTcKimlikNumarasiView.svelte -->
+<span
+    class={`turkiye-tc-kimlik-numarasi-view ${className}`}
+    aria-label={label}
+    {...restProps}>{value}</span
+>

package/dist/components/TurkiyeTcKimlikNumarasiView/TurkiyeTcKimlikNumarasiView.svelte.d.ts

@@ -0,0 +1,8 @@
+type $$ComponentProps = {
+    label: string;
+    value?: string;
+    [key: string]: unknown;
+};
+declare const TurkiyeTcKimlikNumarasiView: import("svelte").Component<$$ComponentProps, {}, "">;
+type TurkiyeTcKimlikNumarasiView = ReturnType<typeof TurkiyeTcKimlikNumarasiView>;
+export default TurkiyeTcKimlikNumarasiView;