let componentsData;
try {
    componentsData = require('../../../../dist/components_json.json');
}
catch (error) {
    console.warn('components_json.json non trouvé. Utilisation de valeurs par défaut.');
    componentsData = {};
}
import { withComponentControls, toKebabCase } from "../../../utils/utils";
const elementTag = 'spw-link';
const argTypes = withComponentControls(componentsData, { tag: elementTag });
const meta = {
    title: 'Composants/Lien',
    component: elementTag,
    argTypes,
    tags: ['autodocs'],
    parameters: {
        docs: {
            description: {
                component: `

Le composant Link permet de créer des liens hypertextes pour naviguer vers d'autres pages, sections de la page courante ou ressources externes. Il offre des options de personnalisation avec icônes et variantes visuelles.

## Fonctionnalités

- Support des icônes FontAwesome (gauche ou droite)
- Attributs href et target configurables
- États hover et focus
- Support des liens externes (_blank)
- Rendu sémantique avec balise a

## Cas d'usage

- Navigation entre pages du site
- Liens vers ressources externes
- Ancres vers sections de la page
- Liens inline dans du contenu texte
- Appels à l'action secondaires

[<spw-link>Consulter la documentation</spw-link>](https://zeroheight.com/2310c7a1e/p/47998e-lien)
        `,
            },
        },
    },
};
export default meta;
function htmlContent(slot) {
    return /* HTML */ `${slot}`;
}
const Template = args => {
    const element = document.createElement(elementTag);
    const hasSlot = true;
    const slottedLabel = 'content';
    Object.entries(args).forEach(([key, val]) => {
        if (key.startsWith('on')) {
            element.addEventListener(key.substring(2).toLowerCase(), val);
        }
        else {
            if (key !== slottedLabel) {
                element.setAttribute(toKebabCase(key), val);
            }
        }
    });
    if (hasSlot) {
        element.innerHTML = htmlContent(args[slottedLabel]);
    }
    return element;
};
export const Primary = Template.bind({});
Primary.args = {
    content: 'Mon super lien',
    href: 'http://google.com',
    target: '_blank',
};
export const WithIcon = Template.bind({});
WithIcon.args = {
    content: 'Mon super lien avec icône',
    href: 'http://google.com',
    target: '_blank',
    icon: 'fa-arrow-right',
    iconPosition: 'right',
};
Primary.parameters = {
    docs: {
        description: {
            story: `Lien standard s'ouvrant dans un nouvel onglet (target="_blank"). Style par défaut avec soulignement au hover. Cas d'usage : liens vers pages internes, navigation principale, références externes.`,
        },
    },
};
WithIcon.parameters = {
    docs: {
        description: {
            story: `Lien avec icône à droite (fa-arrow-right). L'icône indique visuellement la direction ou le type d'action. Cas d'usage : liens externes, téléchargements, navigation vers sections suivantes, indications visuelles de redirection.`,
        },
    },
};
