import './mylabel.css';

export interface MyLabelProps {
  /**
   * Este es el texto que se mostrará en la etiqueta.
   */
  label: string;
  /**
   * Este es el tamaño de la etiqueta.
   */
  size: 'normal'|'h1'|'h2'|'h3';
  /**
   * Si quiere todo capitalizado.
   */
  allCaps?: boolean;
  /**
   * Colores basicos de la etiqueta.
   */
  color?: 'primary'|'secondary'|'tertiary';
  /**
   * Color personalizado de la fuente.
   */
  fontColor?: string;
}

/**
 * # El componente label
 * Muestra una etiqueta.
 */
export const MyLabel = ({label = 'No Label', size = 'normal', allCaps = false, color = 'primary', fontColor}: MyLabelProps) => {
  return (
    <span
      className={`label ${size} text-${color}`}
      style={{color: fontColor}}
    >
      {allCaps ? label.toUpperCase() : label}
    </span>
  )
}

// Se agrega una exportacion por defecto para aumentar la compatibilidad para quien use nuestro paquete.
export default MyLabel;

// Si al desplegar la carpeta "docs" en github pages. Debe estar el repositorio como "public".
// En "Settings" -> "Pages" luego en "Branch" seleccionar "main" luego "/docs" y clic en "save".

// Da el siguiente error:
//  Failed to fetch dynamically imported module: https://tobby-cr.github.io/sb-components/assets/preview-bc596eab.js
//  TypeError: Failed to fetch dynamically imported module: https://tobby-cr.github.io/sb-components/assets/preview-bc596eab.js

// Este error lo ocasiona "Jekyll" que es un generador de sitios estáticos con soporte integrado para GitHub Pages y un proceso de construcción
// simplificado. Jekyll toma los archivos Markdown y HTML y crea un sitio web estático completo en función de la opción de diseño.
// El error es porque Jekyll tiene problemas con archivos o directorios que comienzan con guiones bajos.

// Para solucionar el problema, ahora es posible omitir por completo el procesamiento de Jekyll en las páginas de GitHub creando un archivo
// llamado .nojekyll en la raíz de su repositorio de páginas y empujándolo a GitHub. Esto solo debería ser necesario si su sitio usa archivos o
// directorios que comienzan con guiones bajos, ya que Jekyll los considera recursos especiales y no los copia en el sitio final.

// Por lo tanto, crear un archivo llamdo ".nojekyll" en la carpeta "docs". Esto soluciona el problema.