@neo-design/foundations 1.0.0-rc.5 → 1.0.0-rc.6

package/README.md

@@ -13,6 +13,7 @@ on Material UI: `@neo-design/mui` uses it underneath, and an app in another fram
 
 The `css/` sheets resolve their variables against the two token sheets, so those load first.
 
-**How to mount it, and the full reference, are in the repository this package is published from** —
-its README covers installation, and `docs/dev/` covers the token dictionary, the layout recipe and
-the composition examples.
+**How to mount it, and the full reference, are in [the Neo repository](https://github.com/jzamorano-ui/neo-ds)** —
+[Integration](https://github.com/jzamorano-ui/neo-ds/blob/main/docs/dev/INTEGRATION.md) covers installation and mounting, and `docs/dev/` covers the token dictionary, the layout
+recipe and the composition examples. While the version is a release candidate, install it with the `next` tag:
+`npm i @neo-design/foundations@next`.

package/css/combobox.css

@@ -10,9 +10,22 @@
 
 
 .combobox__label-row {
-  display: flex;
-  align-items: center;
-  gap: var(--neo-space-xs-rem);
+  display: block;
+}
+
+.combobox__label-row .combobox__label {
+  display: inline;
+}
+
+.combobox__label-tail {
+  white-space: nowrap;
+}
+
+.combobox__label-tail > .combobox__icon--tooltip,
+.combobox__label-row > .combobox__icon--tooltip {
+  vertical-align: top;
+  margin-block: calc((var(--neo-type-body-lg-medium-line-height-rem) - var(--neo-icon-size-xs-rem)) / 2);
+  margin-left: var(--neo-space-xs-rem);
 }
 
 .combobox__label {

package/css/select.css

@@ -10,9 +10,22 @@
 
 
 .select__label-row {
-  display: flex;
-  align-items: center;
-  gap: var(--neo-space-xs-rem);
+  display: block;
+}
+
+.select__label-row .select__label {
+  display: inline;
+}
+
+.select__label-tail {
+  white-space: nowrap;
+}
+
+.select__label-tail > .select__icon--tooltip,
+.select__label-row > .select__icon--tooltip {
+  vertical-align: top;
+  margin-block: calc((var(--neo-type-body-lg-medium-line-height-rem) - var(--neo-icon-size-xs-rem)) / 2);
+  margin-left: var(--neo-space-xs-rem);
 }
 
 .select__label {

package/css/text-field.css

@@ -8,9 +8,22 @@
 }
 
 .field__label-row {
-  display: flex;
-  align-items: center;
-  gap: var(--neo-space-xs-rem);
+  display: block;
+}
+
+.field__label-row .field__label {
+  display: inline;
+}
+
+.field__label-tail {
+  white-space: nowrap;
+}
+
+.field__label-tail > .field__icon--tooltip,
+.field__label-row > .field__icon--tooltip {
+  vertical-align: top;
+  margin-block: calc((var(--neo-type-body-lg-medium-line-height-rem) - var(--neo-icon-size-xs-rem)) / 2);
+  margin-left: var(--neo-space-xs-rem);
 }
 
 .field__label {
@@ -18,13 +31,10 @@
   font-weight: var(--neo-type-body-lg-medium-weight);
   line-height: var(--neo-type-body-lg-medium-line-height-rem);
   color: var(--text--base--default);
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
 }
 
 .field__label--required::after {
-  content: ' *';
+  content: '\00a0*';
   color: var(--text--semantic--error);
 }
 

package/icon-aliases.d.mts

@@ -0,0 +1,313 @@
+// icon-aliases.d.mts — GENERATED · the types of `@neo-design/foundations/icon-aliases.mjs`. Do NOT edit by hand.
+export declare const ALIASES: {
+  readonly 'system-advertencia': string;
+  readonly 'system-agregar': string;
+  readonly 'system-agregar-circulo': string;
+  readonly 'system-alarma': string;
+  readonly 'system-ayuda': string;
+  readonly 'system-bandeja-entrada': string;
+  readonly 'system-bandeja-salida': string;
+  readonly 'system-bano': string;
+  readonly 'system-bano-mujeres': string;
+  readonly 'system-billetera': string;
+  readonly 'system-bolsa': string;
+  readonly 'system-bombilla': string;
+  readonly 'system-brujula': string;
+  readonly 'system-buscar': string;
+  readonly 'system-buscar-circulo': string;
+  readonly 'system-buzon-voz': string;
+  readonly 'system-buzon-voz-silencio': string;
+  readonly 'system-calendario': string;
+  readonly 'system-calendario-agregar': string;
+  readonly 'system-campana': string;
+  readonly 'system-campana-agregar': string;
+  readonly 'system-campana-bloquear': string;
+  readonly 'system-campana-silencio': string;
+  readonly 'system-campana-timbrar': string;
+  readonly 'system-candado': string;
+  readonly 'system-carrito': string;
+  readonly 'system-carrito-agregar': string;
+  readonly 'system-carrito-verificar': string;
+  readonly 'system-celular': string;
+  readonly 'system-cerrar': string;
+  readonly 'system-cerrar-sesion': string;
+  readonly 'system-chat-burbujas': string;
+  readonly 'system-chat-escribiendo': string;
+  readonly 'system-chevron-abajo': string;
+  readonly 'system-chevron-arriba': string;
+  readonly 'system-chevron-derecha': string;
+  readonly 'system-chevron-izquierda': string;
+  readonly 'system-configuracion': string;
+  readonly 'system-copiar': string;
+  readonly 'system-corazon': string;
+  readonly 'system-corazon-desactivar': string;
+  readonly 'system-correo': string;
+  readonly 'system-correo-enviar': string;
+  readonly 'system-derivacion-out': string;
+  readonly 'system-descargar': string;
+  readonly 'system-diccionario': string;
+  readonly 'system-editar': string;
+  readonly 'system-enlace': string;
+  readonly 'system-enlace-roto': string;
+  readonly 'system-escaner': string;
+  readonly 'system-escudo': string;
+  readonly 'system-escudo-verificar': string;
+  readonly 'system-estrella': string;
+  readonly 'system-flecha-abajo': string;
+  readonly 'system-flecha-arriba': string;
+  readonly 'system-flecha-derecha': string;
+  readonly 'system-flecha-izquierda': string;
+  readonly 'system-grafico-baja': string;
+  readonly 'system-imagen': string;
+  readonly 'system-informacion': string;
+  readonly 'system-inicio': string;
+  readonly 'system-lista': string;
+  readonly 'system-lista-tareas': string;
+  readonly 'system-llamada-entrante': string;
+  readonly 'system-llamada-entrante-alt': string;
+  readonly 'system-mapa': string;
+  readonly 'system-marcador': string;
+  readonly 'system-media-anterior': string;
+  readonly 'system-media-avanzar': string;
+  readonly 'system-media-pausa': string;
+  readonly 'system-media-reproducir': string;
+  readonly 'system-media-retroceder': string;
+  readonly 'system-media-siguiente': string;
+  readonly 'system-megafono': string;
+  readonly 'system-menos': string;
+  readonly 'system-menu-puntos': string;
+  readonly 'system-moneda': string;
+  readonly 'system-nav-derecha': string;
+  readonly 'system-nav-izquierda': string;
+  readonly 'system-navegar': string;
+  readonly 'system-navegar-desactivar': string;
+  readonly 'system-nube': string;
+  readonly 'system-nube-actualizar': string;
+  readonly 'system-nube-agregar': string;
+  readonly 'system-nube-alerta': string;
+  readonly 'system-nube-bloquear': string;
+  readonly 'system-nube-compartir': string;
+  readonly 'system-nube-transferir': string;
+  readonly 'system-nube-verificar': string;
+  readonly 'system-nube-video': string;
+  readonly 'system-ojo': string;
+  readonly 'system-ojo-oculto': string;
+  readonly 'system-papelera-reciclaje': string;
+  readonly 'system-portapapeles-agregar': string;
+  readonly 'system-portapapeles-eliminar': string;
+  readonly 'system-portapapeles-verificar': string;
+  readonly 'system-regalo': string;
+  readonly 'system-reloj-circulo': string;
+  readonly 'system-senal': string;
+  readonly 'system-silla-ruedas': string;
+  readonly 'system-sincronizar-alerta': string;
+  readonly 'system-soporte': string;
+  readonly 'system-tarjeta-credito': string;
+  readonly 'system-telefono': string;
+  readonly 'system-ubicacion': string;
+  readonly 'system-usuario-agregar': string;
+  readonly 'system-usuario-circulo': string;
+  readonly 'system-usuario-id': string;
+  readonly 'system-usuario-perfil': string;
+  readonly 'system-usuario-proteger': string;
+  readonly 'system-usuario-verificar': string;
+  readonly 'system-verificar': string;
+  readonly 'system-verificar-cuadro': string;
+  readonly 'system-volumen-alto': string;
+  readonly 'system-volumen-apagar': string;
+  readonly 'system-volumen-bajar': string;
+  readonly 'system-volumen-bajo': string;
+  readonly 'system-volumen-mudo': string;
+  readonly 'system-wifi-desactivar': string;
+  readonly 'brand-ambulancia': string;
+  readonly 'brand-bienestar': string;
+  readonly 'brand-brillos': string;
+  readonly 'brand-capsula': string;
+  readonly 'brand-chequeo': string;
+  readonly 'brand-contacto': string;
+  readonly 'brand-conversacion': string;
+  readonly 'brand-cruz': string;
+  readonly 'brand-diente': string;
+  readonly 'brand-dinero': string;
+  readonly 'brand-donar-sangre': string;
+  readonly 'brand-enfermero': string;
+  readonly 'brand-estetoscopio': string;
+  readonly 'brand-garantia': string;
+  readonly 'brand-gorro-enfermero': string;
+  readonly 'brand-gota-sangre': string;
+  readonly 'brand-historial-medico': string;
+  readonly 'brand-hospitalsymbol': string;
+  readonly 'brand-maletin-medico': string;
+  readonly 'brand-mascarilla': string;
+  readonly 'brand-oido': string;
+  readonly 'brand-ojo': string;
+  readonly 'brand-pelota': string;
+  readonly 'brand-ritmo-cardiaco': string;
+  readonly 'brand-salud': string;
+  readonly 'brand-seguro': string;
+  readonly 'brand-silla-ruedas': string;
+  readonly 'brand-tarjeta-credito': string;
+  readonly 'brand-telemedicina': string;
+};
+export declare const BRAND: {
+  readonly ambulancia: string;
+  readonly bienestar: string;
+  readonly brillos: string;
+  readonly 'call-center': string;
+  readonly capsula: string;
+  readonly chequeo: string;
+  readonly contacto: string;
+  readonly conversacion: string;
+  readonly cruz: string;
+  readonly desktop: string;
+  readonly diente: string;
+  readonly dinero: string;
+  readonly 'donar-sangre': string;
+  readonly enfermero: string;
+  readonly estetoscopio: string;
+  readonly garantia: string;
+  readonly 'gorro-enfermero': string;
+  readonly 'gota-sangre': string;
+  readonly 'historial-medico': string;
+  readonly hospital: string;
+  readonly hospitalsymbol: string;
+  readonly 'maletin-medico': string;
+  readonly mascarilla: string;
+  readonly oido: string;
+  readonly ojo: string;
+  readonly pelota: string;
+  readonly 'ritmo-cardiaco': string;
+  readonly salud: string;
+  readonly seguro: string;
+  readonly 'silla-ruedas': string;
+  readonly 'tarjeta-credito': string;
+  readonly telemedicina: string;
+};
+export declare const SYSTEM: {
+  readonly advertencia: string;
+  readonly agregar: string;
+  readonly 'agregar-circulo': string;
+  readonly alarma: string;
+  readonly ayuda: string;
+  readonly 'bandeja-entrada': string;
+  readonly 'bandeja-salida': string;
+  readonly bano: string;
+  readonly 'bano-mujeres': string;
+  readonly billetera: string;
+  readonly bolsa: string;
+  readonly bombilla: string;
+  readonly brujula: string;
+  readonly buscar: string;
+  readonly 'buscar-circulo': string;
+  readonly 'buzon-voz': string;
+  readonly 'buzon-voz-silencio': string;
+  readonly calendario: string;
+  readonly 'calendario-agregar': string;
+  readonly campana: string;
+  readonly 'campana-agregar': string;
+  readonly 'campana-bloquear': string;
+  readonly 'campana-silencio': string;
+  readonly 'campana-timbrar': string;
+  readonly candado: string;
+  readonly carrito: string;
+  readonly 'carrito-agregar': string;
+  readonly 'carrito-verificar': string;
+  readonly celular: string;
+  readonly cerrar: string;
+  readonly 'cerrar-sesion': string;
+  readonly 'chat-burbujas': string;
+  readonly 'chat-escribiendo': string;
+  readonly 'chevron-abajo': string;
+  readonly 'chevron-arriba': string;
+  readonly 'chevron-derecha': string;
+  readonly 'chevron-izquierda': string;
+  readonly configuracion: string;
+  readonly copiar: string;
+  readonly corazon: string;
+  readonly 'corazon-desactivar': string;
+  readonly correo: string;
+  readonly 'correo-enviar': string;
+  readonly 'derivacion-out': string;
+  readonly descargar: string;
+  readonly diccionario: string;
+  readonly editar: string;
+  readonly enlace: string;
+  readonly 'enlace-roto': string;
+  readonly error: string;
+  readonly escaner: string;
+  readonly escudo: string;
+  readonly 'escudo-verificar': string;
+  readonly estrella: string;
+  readonly 'flecha-abajo': string;
+  readonly 'flecha-arriba': string;
+  readonly 'flecha-derecha': string;
+  readonly 'flecha-izquierda': string;
+  readonly 'grafico-baja': string;
+  readonly imagen: string;
+  readonly informacion: string;
+  readonly inicio: string;
+  readonly kebab: string;
+  readonly lista: string;
+  readonly 'lista-tareas': string;
+  readonly 'llamada-entrante': string;
+  readonly 'llamada-entrante-alt': string;
+  readonly mapa: string;
+  readonly marcador: string;
+  readonly 'media-anterior': string;
+  readonly 'media-avanzar': string;
+  readonly 'media-pausa': string;
+  readonly 'media-reproducir': string;
+  readonly 'media-retroceder': string;
+  readonly 'media-siguiente': string;
+  readonly megafono: string;
+  readonly menos: string;
+  readonly 'menu-puntos': string;
+  readonly moneda: string;
+  readonly 'nav-derecha': string;
+  readonly 'nav-izquierda': string;
+  readonly navegar: string;
+  readonly 'navegar-desactivar': string;
+  readonly nube: string;
+  readonly 'nube-actualizar': string;
+  readonly 'nube-agregar': string;
+  readonly 'nube-alerta': string;
+  readonly 'nube-bloquear': string;
+  readonly 'nube-compartir': string;
+  readonly 'nube-transferir': string;
+  readonly 'nube-verificar': string;
+  readonly 'nube-video': string;
+  readonly ojo: string;
+  readonly 'ojo-oculto': string;
+  readonly 'papelera-reciclaje': string;
+  readonly 'portapapeles-agregar': string;
+  readonly 'portapapeles-eliminar': string;
+  readonly 'portapapeles-verificar': string;
+  readonly regalo: string;
+  readonly 'reloj-circulo': string;
+  readonly senal: string;
+  readonly 'silla-ruedas': string;
+  readonly 'sincronizar-alerta': string;
+  readonly soporte: string;
+  readonly 'tarjeta-credito': string;
+  readonly telefono: string;
+  readonly ubicacion: string;
+  readonly 'usuario-agregar': string;
+  readonly 'usuario-circulo': string;
+  readonly 'usuario-id': string;
+  readonly 'usuario-perfil': string;
+  readonly 'usuario-proteger': string;
+  readonly 'usuario-verificar': string;
+  readonly verificar: string;
+  readonly 'verificar-cuadro': string;
+  readonly 'volumen-alto': string;
+  readonly 'volumen-apagar': string;
+  readonly 'volumen-bajar': string;
+  readonly 'volumen-bajo': string;
+  readonly 'volumen-mudo': string;
+  readonly wifi: string;
+  readonly 'wifi-desactivar': string;
+};
+export declare const appliedInFigma: string;
+export declare const approved: boolean;
+export declare const mirroredInCode: boolean;
+export declare const mirroredOn: string;

package/icons/sprite.d.mts

@@ -0,0 +1,2 @@
+// icons/sprite.d.mts — GENERATED · the types of `@neo-design/foundations/sprite`. Do NOT edit by hand.
+export declare const sprite: string;

package/package.json

@@ -1,7 +1,13 @@
 {
   "name": "@neo-design/foundations",
-  "version": "1.0.0-rc.5",
+  "version": "1.0.0-rc.6",
   "description": "Neo — the system foundations: semantic tokens in JS and CSS, icons and the plain CSS layer. It does not depend on React or Material UI.",
+  "homepage": "https://github.com/jzamorano-ui/neo-ds/blob/main/docs/dev/INTEGRATION.md",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/jzamorano-ui/neo-ds.git",
+    "directory": "packages/foundations"
+  },
   "type": "module",
   "sideEffects": [
     "*.css"
@@ -10,22 +16,64 @@
     "./tokens.css": "./tokens/neo-color.css",
     "./foundations.css": "./tokens/neo-foundations.css",
     "./icons.css": "./icons/icons.css",
-    "./sprite": "./icons/sprite.mjs",
+    "./sprite": {
+      "types": "./icons/sprite.d.mts",
+      "default": "./icons/sprite.mjs"
+    },
     "./icons.json": "./icons/index.json",
     "./css/*": "./css/*",
-    "./tokens/api-js.mjs": "./tokens/api-js.mjs",
-    "./tokens/breakpoints.mjs": "./tokens/breakpoints.mjs",
-    "./tokens/color-semantic.mjs": "./tokens/color-semantic.mjs",
-    "./tokens/color.mjs": "./tokens/color.mjs",
-    "./tokens/component-tokens.mjs": "./tokens/component-tokens.mjs",
-    "./tokens/container.mjs": "./tokens/container.mjs",
-    "./tokens/iconSize.mjs": "./tokens/iconSize.mjs",
-    "./tokens/radius.mjs": "./tokens/radius.mjs",
-    "./tokens/shadows.mjs": "./tokens/shadows.mjs",
-    "./tokens/spacing.mjs": "./tokens/spacing.mjs",
-    "./tokens/stroke.mjs": "./tokens/stroke.mjs",
-    "./tokens/typography.mjs": "./tokens/typography.mjs",
-    "./icon-aliases.mjs": "./icon-aliases.mjs",
+    "./tokens/api-js.mjs": {
+      "types": "./tokens/api-js.d.mts",
+      "default": "./tokens/api-js.mjs"
+    },
+    "./tokens/breakpoints.mjs": {
+      "types": "./tokens/breakpoints.d.mts",
+      "default": "./tokens/breakpoints.mjs"
+    },
+    "./tokens/color-semantic.mjs": {
+      "types": "./tokens/color-semantic.d.mts",
+      "default": "./tokens/color-semantic.mjs"
+    },
+    "./tokens/color.mjs": {
+      "types": "./tokens/color.d.mts",
+      "default": "./tokens/color.mjs"
+    },
+    "./tokens/component-tokens.mjs": {
+      "types": "./tokens/component-tokens.d.mts",
+      "default": "./tokens/component-tokens.mjs"
+    },
+    "./tokens/container.mjs": {
+      "types": "./tokens/container.d.mts",
+      "default": "./tokens/container.mjs"
+    },
+    "./tokens/iconSize.mjs": {
+      "types": "./tokens/iconSize.d.mts",
+      "default": "./tokens/iconSize.mjs"
+    },
+    "./tokens/radius.mjs": {
+      "types": "./tokens/radius.d.mts",
+      "default": "./tokens/radius.mjs"
+    },
+    "./tokens/shadows.mjs": {
+      "types": "./tokens/shadows.d.mts",
+      "default": "./tokens/shadows.mjs"
+    },
+    "./tokens/spacing.mjs": {
+      "types": "./tokens/spacing.d.mts",
+      "default": "./tokens/spacing.mjs"
+    },
+    "./tokens/stroke.mjs": {
+      "types": "./tokens/stroke.d.mts",
+      "default": "./tokens/stroke.mjs"
+    },
+    "./tokens/typography.mjs": {
+      "types": "./tokens/typography.d.mts",
+      "default": "./tokens/typography.mjs"
+    },
+    "./icon-aliases.mjs": {
+      "types": "./icon-aliases.d.mts",
+      "default": "./icon-aliases.mjs"
+    },
     "./package.json": "./package.json"
   },
   "files": [
@@ -33,6 +81,7 @@
     "icons",
     "css",
     "icon-aliases.mjs",
+    "icon-aliases.d.mts",
     "!icons/svg",
     "!icons/icons.svg",
     "!icons/_demo.html"