@supersoniks/concorde 5.1.1 → 5.1.2

package/.tmp-cem/custom-elements.json

@@ -14,6 +14,80 @@
       "declarations": [],
       "exports": []
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/core/components/functional/fetch/fetch.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "###Fetch charge un contenu via un appel d'api web.\nExtends mixins : Fetcher, [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page)\n\n#### Configuration via les attributs\n\n| nom          | sur quelle balise | Description | Exemple de valeur | défaut / requis |\n| -------------------------------------------------------------------------------------- |\n| serviceURL   |Fetcher ou un de ses parents | URL de base des services. | http://la-billetterie.net/api/v2 | domain du site |\n| endpoint   |Fetcher | point d'accès d'un service | user/2 | valeur de l'attribut dataProvider |\n| dataProvider  |Fetcher ou un de ses parents | Identifiant d'un publisher qui stock les données, voir [subscriber](./?path=/docs/miscallenous-🔔-subscriber--page). | billetterie/user/2 | *REQUIS* |\n| headersDataProvider  |Fetcher ou un de ses parents | Identifiant d'un publisher qui stock les données destinées à être envoyées en entêtes de la requetes | MyCoockieHEaders | null |\n| key  |Fetcher  | extrait une sous propriété de la donnée chargée avant de l'assignée à son publisher | ma.data | null |\n\n*Si la données est `{ma:{data:{a:1,b:2}}}` et `key=\"ma.data\"`, la données disponible dans le composant sera `{a:1, b:2}`*\n\n#### Intégration auto de basic auth (pour tester une api qui nécessite une authentification) \n\nFetch utilise le service pour générer le token et l'ajoute au header de l'appel qui récupère les données.\n\n| nom           | sur quelle balise | Description | Exemple de valeur | défaut / requis |\n| -------------------------------------------------------------------------------------- |\n| userName      | Fetcher ou un de ses parents | Nom de l'utilisateur | DjuDju | null |\n| password      | Fetcher ou un de ses parents | mot de passe | pom_549 | null |\n| tokenProvider | Fetcher ou un de ses parents | point d'accès du service fournissant le token | auth | null |\n| token | Fetcher ou un de ses parents | A fournir à la place des autres attributs si on le possède | q<d34gb | null |\n\n#### Autres choses utiles\n* On peut appeler la methode invalidate() sur le publisher associé au  composant pour declencher le rechargement des données.\n* endPoint est une propriété réctive, par conséquent, sa modification, manuelle via template ou data binbding provoque la mise à jour du contenu.",
+          "name": "Fetch",
+          "members": [
+            {
+              "kind": "field",
+              "name": "loader",
+              "type": {
+                "text": "LoaderMode | true | \"\" | undefined"
+              },
+              "attribute": "loader"
+            },
+            {
+              "kind": "method",
+              "name": "renderLoader"
+            },
+            {
+              "kind": "method",
+              "name": "renderSkeleton"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "loader",
+              "type": {
+                "text": "LoaderMode | true | \"\" | undefined"
+              },
+              "fieldName": "loader"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "Fetcher",
+              "package": "@supersoniks/concorde/core/mixins/Fetcher"
+            },
+            {
+              "name": "Subscriber",
+              "package": "@supersoniks/concorde/core/mixins/Subscriber"
+            },
+            {
+              "name": "TemplatesContainer",
+              "package": "@supersoniks/concorde/mixins"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "Fetch",
+          "declaration": {
+            "name": "Fetch",
+            "module": "src/core/components/functional/fetch/fetch.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "declaration": {
+            "name": "Fetch",
+            "module": "src/core/components/functional/fetch/fetch.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/core/components/functional/example/example.ts",
@@ -589,80 +663,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/core/components/functional/fetch/fetch.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "###Fetch charge un contenu via un appel d'api web.\nExtends mixins : Fetcher, [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page)\n\n#### Configuration via les attributs\n\n| nom          | sur quelle balise | Description | Exemple de valeur | défaut / requis |\n| -------------------------------------------------------------------------------------- |\n| serviceURL   |Fetcher ou un de ses parents | URL de base des services. | http://la-billetterie.net/api/v2 | domain du site |\n| endpoint   |Fetcher | point d'accès d'un service | user/2 | valeur de l'attribut dataProvider |\n| dataProvider  |Fetcher ou un de ses parents | Identifiant d'un publisher qui stock les données, voir [subscriber](./?path=/docs/miscallenous-🔔-subscriber--page). | billetterie/user/2 | *REQUIS* |\n| headersDataProvider  |Fetcher ou un de ses parents | Identifiant d'un publisher qui stock les données destinées à être envoyées en entêtes de la requetes | MyCoockieHEaders | null |\n| key  |Fetcher  | extrait une sous propriété de la donnée chargée avant de l'assignée à son publisher | ma.data | null |\n\n*Si la données est `{ma:{data:{a:1,b:2}}}` et `key=\"ma.data\"`, la données disponible dans le composant sera `{a:1, b:2}`*\n\n#### Intégration auto de basic auth (pour tester une api qui nécessite une authentification) \n\nFetch utilise le service pour générer le token et l'ajoute au header de l'appel qui récupère les données.\n\n| nom           | sur quelle balise | Description | Exemple de valeur | défaut / requis |\n| -------------------------------------------------------------------------------------- |\n| userName      | Fetcher ou un de ses parents | Nom de l'utilisateur | DjuDju | null |\n| password      | Fetcher ou un de ses parents | mot de passe | pom_549 | null |\n| tokenProvider | Fetcher ou un de ses parents | point d'accès du service fournissant le token | auth | null |\n| token | Fetcher ou un de ses parents | A fournir à la place des autres attributs si on le possède | q<d34gb | null |\n\n#### Autres choses utiles\n* On peut appeler la methode invalidate() sur le publisher associé au  composant pour declencher le rechargement des données.\n* endPoint est une propriété réctive, par conséquent, sa modification, manuelle via template ou data binbding provoque la mise à jour du contenu.",
-          "name": "Fetch",
-          "members": [
-            {
-              "kind": "field",
-              "name": "loader",
-              "type": {
-                "text": "LoaderMode | true | \"\" | undefined"
-              },
-              "attribute": "loader"
-            },
-            {
-              "kind": "method",
-              "name": "renderLoader"
-            },
-            {
-              "kind": "method",
-              "name": "renderSkeleton"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "loader",
-              "type": {
-                "text": "LoaderMode | true | \"\" | undefined"
-              },
-              "fieldName": "loader"
-            }
-          ],
-          "mixins": [
-            {
-              "name": "Fetcher",
-              "package": "@supersoniks/concorde/core/mixins/Fetcher"
-            },
-            {
-              "name": "Subscriber",
-              "package": "@supersoniks/concorde/core/mixins/Subscriber"
-            },
-            {
-              "name": "TemplatesContainer",
-              "package": "@supersoniks/concorde/mixins"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "Fetch",
-          "declaration": {
-            "name": "Fetch",
-            "module": "src/core/components/functional/fetch/fetch.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "declaration": {
-            "name": "Fetch",
-            "module": "src/core/components/functional/fetch/fetch.ts"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/core/components/functional/if/if.ts",
@@ -868,103 +868,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/core/components/functional/mix/mix.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SonicMix",
-          "members": [
-            {
-              "kind": "field",
-              "name": "_composition",
-              "type": {
-                "text": "Composition"
-              },
-              "privacy": "private",
-              "default": "{}"
-            },
-            {
-              "kind": "field",
-              "name": "composition",
-              "attribute": "composition"
-            },
-            {
-              "kind": "method",
-              "name": "updateComposition"
-            },
-            {
-              "kind": "field",
-              "name": "listeners",
-              "type": {
-                "text": "Listener[]"
-              },
-              "default": "[]"
-            },
-            {
-              "kind": "method",
-              "name": "removePublisherListeners"
-            },
-            {
-              "kind": "method",
-              "name": "parseComposition",
-              "parameters": [
-                {
-                  "name": "composition",
-                  "type": {
-                    "text": "Composition"
-                  }
-                },
-                {
-                  "name": "publisher",
-                  "type": {
-                    "text": "PublisherInterface<T>"
-                  }
-                }
-              ]
-            }
-          ],
-          "attributes": [
-            {
-              "name": "composition",
-              "fieldName": "composition"
-            }
-          ],
-          "mixins": [
-            {
-              "name": "Subscriber",
-              "package": "@supersoniks/concorde/mixins"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "sonic-mix",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "SonicMix",
-            "module": "src/core/components/functional/mix/mix.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "sonic-mix",
-          "declaration": {
-            "name": "SonicMix",
-            "module": "src/core/components/functional/mix/mix.ts"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/core/components/functional/list/list.ts",
@@ -1241,6 +1144,103 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/core/components/functional/mix/mix.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SonicMix",
+          "members": [
+            {
+              "kind": "field",
+              "name": "_composition",
+              "type": {
+                "text": "Composition"
+              },
+              "privacy": "private",
+              "default": "{}"
+            },
+            {
+              "kind": "field",
+              "name": "composition",
+              "attribute": "composition"
+            },
+            {
+              "kind": "method",
+              "name": "updateComposition"
+            },
+            {
+              "kind": "field",
+              "name": "listeners",
+              "type": {
+                "text": "Listener[]"
+              },
+              "default": "[]"
+            },
+            {
+              "kind": "method",
+              "name": "removePublisherListeners"
+            },
+            {
+              "kind": "method",
+              "name": "parseComposition",
+              "parameters": [
+                {
+                  "name": "composition",
+                  "type": {
+                    "text": "Composition"
+                  }
+                },
+                {
+                  "name": "publisher",
+                  "type": {
+                    "text": "PublisherInterface<T>"
+                  }
+                }
+              ]
+            }
+          ],
+          "attributes": [
+            {
+              "name": "composition",
+              "fieldName": "composition"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "Subscriber",
+              "package": "@supersoniks/concorde/mixins"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "sonic-mix",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SonicMix",
+            "module": "src/core/components/functional/mix/mix.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "sonic-mix",
+          "declaration": {
+            "name": "SonicMix",
+            "module": "src/core/components/functional/mix/mix.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/core/components/functional/queue/queue.ts",
@@ -1823,74 +1823,236 @@
             },
             {
               "kind": "field",
-              "name": "basePath",
+              "name": "basePath",
+              "type": {
+                "text": "string | undefined"
+              },
+              "attribute": "basePath"
+            },
+            {
+              "kind": "field",
+              "name": "_location",
+              "type": {
+                "text": "string"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "location",
+              "attribute": "location"
+            },
+            {
+              "kind": "field",
+              "name": "cleanLocation",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "name": "patternBasePath",
+              "privacy": "private",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "name": "regExpBasePath",
+              "privacy": "private",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "handleroutes",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "DirectiveResult[]"
+                }
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "fallBackRoute",
+              "type": {
+                "text": "string | undefined"
+              },
+              "fieldName": "fallBackRoute"
+            },
+            {
+              "name": "basePath",
+              "type": {
+                "text": "string | undefined"
+              },
+              "fieldName": "basePath"
+            },
+            {
+              "name": "location",
+              "fieldName": "location"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "TemplatesContainer",
+              "package": "@supersoniks/concorde/core/mixins/TemplatesContainer"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SonicRouter",
+          "declaration": {
+            "name": "SonicRouter",
+            "module": "src/core/components/functional/router/router.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "declaration": {
+            "name": "SonicRouter",
+            "module": "src/core/components/functional/router/router.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/core/components/functional/sonic-scope/sonic-scope.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SonicScope",
+          "members": [],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SonicScope",
+          "declaration": {
+            "name": "SonicScope",
+            "module": "src/core/components/functional/sonic-scope/sonic-scope.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "declaration": {
+            "name": "SonicScope",
+            "module": "src/core/components/functional/sonic-scope/sonic-scope.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/core/components/functional/states/states.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SonicStates",
+          "members": [
+            {
+              "kind": "field",
+              "name": "state",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "attribute": "state"
+            },
+            {
+              "kind": "field",
+              "name": "inverted",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "attribute": "basePath"
+              "default": "false",
+              "attribute": "inverted",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "_location",
+              "name": "states",
               "type": {
-                "text": "string"
+                "text": "States | undefined"
               },
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "location",
-              "attribute": "location"
+              "attribute": "states"
             },
             {
               "kind": "field",
-              "name": "cleanLocation",
-              "readonly": true
+              "name": "statePath",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\""
             },
             {
               "kind": "field",
-              "name": "patternBasePath",
-              "privacy": "private",
-              "readonly": true
+              "name": "onStateAssign"
             },
             {
               "kind": "field",
-              "name": "regExpBasePath",
-              "privacy": "private",
-              "readonly": true
+              "name": "statePublisher",
+              "type": {
+                "text": "TypeAndRecordOfType<PublisherInterface<string & object>> | undefined"
+              }
             },
             {
               "kind": "method",
-              "name": "handleroutes",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "DirectiveResult[]"
+              "name": "handleStates",
+              "parameters": [
+                {
+                  "name": "state",
+                  "type": {
+                    "text": "string"
+                  }
                 }
-              }
+              ]
             }
           ],
           "attributes": [
             {
-              "name": "fallBackRoute",
+              "name": "state",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "fieldName": "fallBackRoute"
+              "default": "\"\"",
+              "fieldName": "state"
             },
             {
-              "name": "basePath",
+              "name": "inverted",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "fieldName": "basePath"
+              "default": "false",
+              "fieldName": "inverted"
             },
             {
-              "name": "location",
-              "fieldName": "location"
+              "name": "states",
+              "type": {
+                "text": "States | undefined"
+              },
+              "fieldName": "states"
             }
           ],
           "mixins": [
+            {
+              "name": "Subscriber",
+              "package": "@supersoniks/concorde/core/mixins/Subscriber"
+            },
             {
               "name": "TemplatesContainer",
               "package": "@supersoniks/concorde/core/mixins/TemplatesContainer"
@@ -1906,17 +2068,17 @@
       "exports": [
         {
           "kind": "js",
-          "name": "SonicRouter",
+          "name": "SonicStates",
           "declaration": {
-            "name": "SonicRouter",
-            "module": "src/core/components/functional/router/router.ts"
+            "name": "SonicStates",
+            "module": "src/core/components/functional/states/states.ts"
           }
         },
         {
           "kind": "custom-element-definition",
           "declaration": {
-            "name": "SonicRouter",
-            "module": "src/core/components/functional/router/router.ts"
+            "name": "SonicStates",
+            "module": "src/core/components/functional/states/states.ts"
           }
         }
       ]
@@ -3052,207 +3214,39 @@
               "fieldName": "messagesKey"
             },
             {
-              "name": "profile",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Profil de rendu opt-in. `safe` refuse js / markup / innerHTML / prefix / suffix.\nSans attribut, comportement historique inchangé.",
-              "fieldName": "profile"
-            },
-            {
-              "name": "partial",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Rendu partiel opt-in : les `childNodeIds` introuvables deviennent des placeholders.\nActivé aussi en mode incrémental (ops étape 6).",
-              "fieldName": "partial"
-            },
-            {
-              "name": "opsDataProvider",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "DataProvider optionnel alimenté par un flux d'ops (`SDUIOp` ou `SDUIOp[]`).\nChaque assignation est consommée via `applyOp`.",
-              "fieldName": "opsDataProvider"
-            }
-          ],
-          "mixins": [
-            {
-              "name": "Fetcher",
-              "package": "@supersoniks/concorde/mixins"
-            },
-            {
-              "name": "Subscriber",
-              "package": "@supersoniks/concorde/mixins"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SonicSDUI",
-          "declaration": {
-            "name": "SonicSDUI",
-            "module": "src/core/components/functional/sdui/sdui.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "declaration": {
-            "name": "SonicSDUI",
-            "module": "src/core/components/functional/sdui/sdui.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/core/components/functional/sdui/types.ts",
-      "declarations": [],
-      "exports": []
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/core/components/functional/sonic-scope/sonic-scope.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SonicScope",
-          "members": [],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SonicScope",
-          "declaration": {
-            "name": "SonicScope",
-            "module": "src/core/components/functional/sonic-scope/sonic-scope.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "declaration": {
-            "name": "SonicScope",
-            "module": "src/core/components/functional/sonic-scope/sonic-scope.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/core/components/functional/states/states.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SonicStates",
-          "members": [
-            {
-              "kind": "field",
-              "name": "state",
-              "type": {
-                "text": "string"
-              },
-              "default": "\"\"",
-              "attribute": "state"
-            },
-            {
-              "kind": "field",
-              "name": "inverted",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "attribute": "inverted",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "states",
-              "type": {
-                "text": "States | undefined"
-              },
-              "attribute": "states"
-            },
-            {
-              "kind": "field",
-              "name": "statePath",
-              "type": {
-                "text": "string"
-              },
-              "default": "\"\""
-            },
-            {
-              "kind": "field",
-              "name": "onStateAssign"
-            },
-            {
-              "kind": "field",
-              "name": "statePublisher",
-              "type": {
-                "text": "TypeAndRecordOfType<PublisherInterface<string & object>> | undefined"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "handleStates",
-              "parameters": [
-                {
-                  "name": "state",
-                  "type": {
-                    "text": "string"
-                  }
-                }
-              ]
-            }
-          ],
-          "attributes": [
-            {
-              "name": "state",
+              "name": "profile",
               "type": {
-                "text": "string"
+                "text": "string | undefined"
               },
-              "default": "\"\"",
-              "fieldName": "state"
+              "description": "Profil de rendu opt-in. `safe` refuse js / markup / innerHTML / prefix / suffix.\nSans attribut, comportement historique inchangé.",
+              "fieldName": "profile"
             },
             {
-              "name": "inverted",
+              "name": "partial",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "fieldName": "inverted"
+              "description": "Rendu partiel opt-in : les `childNodeIds` introuvables deviennent des placeholders.\nActivé aussi en mode incrémental (ops étape 6).",
+              "fieldName": "partial"
             },
             {
-              "name": "states",
+              "name": "opsDataProvider",
               "type": {
-                "text": "States | undefined"
+                "text": "string | undefined"
               },
-              "fieldName": "states"
+              "description": "DataProvider optionnel alimenté par un flux d'ops (`SDUIOp` ou `SDUIOp[]`).\nChaque assignation est consommée via `applyOp`.",
+              "fieldName": "opsDataProvider"
             }
           ],
           "mixins": [
             {
-              "name": "Subscriber",
-              "package": "@supersoniks/concorde/core/mixins/Subscriber"
+              "name": "Fetcher",
+              "package": "@supersoniks/concorde/mixins"
             },
             {
-              "name": "TemplatesContainer",
-              "package": "@supersoniks/concorde/core/mixins/TemplatesContainer"
+              "name": "Subscriber",
+              "package": "@supersoniks/concorde/mixins"
             }
           ],
           "superclass": {
@@ -3265,69 +3259,26 @@
       "exports": [
         {
           "kind": "js",
-          "name": "SonicStates",
+          "name": "SonicSDUI",
           "declaration": {
-            "name": "SonicStates",
-            "module": "src/core/components/functional/states/states.ts"
+            "name": "SonicSDUI",
+            "module": "src/core/components/functional/sdui/sdui.ts"
           }
         },
         {
           "kind": "custom-element-definition",
           "declaration": {
-            "name": "SonicStates",
-            "module": "src/core/components/functional/states/states.ts"
+            "name": "SonicSDUI",
+            "module": "src/core/components/functional/sdui/sdui.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/core/components/functional/subscriber/subscriber.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "Voir la partie dédiée dans *MISCALLENOUS*",
-          "name": "SonicSubscriber",
-          "members": [
-            {
-              "kind": "field",
-              "name": "noAutofill",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "true"
-            }
-          ],
-          "mixins": [
-            {
-              "name": "Subscriber",
-              "package": "@supersoniks/concorde/core/mixins/Subscriber"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SonicSubscriber",
-          "declaration": {
-            "name": "SonicSubscriber",
-            "module": "src/core/components/functional/subscriber/subscriber.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "declaration": {
-            "name": "SonicSubscriber",
-            "module": "src/core/components/functional/subscriber/subscriber.ts"
-          }
-        }
-      ]
+      "path": "src/core/components/functional/sdui/types.ts",
+      "declarations": [],
+      "exports": []
     },
     {
       "kind": "javascript-module",
@@ -3499,6 +3450,55 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/core/components/functional/subscriber/subscriber.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "Voir la partie dédiée dans *MISCALLENOUS*",
+          "name": "SonicSubscriber",
+          "members": [
+            {
+              "kind": "field",
+              "name": "noAutofill",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "true"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "Subscriber",
+              "package": "@supersoniks/concorde/core/mixins/Subscriber"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SonicSubscriber",
+          "declaration": {
+            "name": "SonicSubscriber",
+            "module": "src/core/components/functional/subscriber/subscriber.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "declaration": {
+            "name": "SonicSubscriber",
+            "module": "src/core/components/functional/subscriber/subscriber.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/core/components/functional/translation/translation.ts",
@@ -10279,6 +10279,66 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/core/components/ui/form/css/form-control.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "passwordToggle",
+          "default": "css` .password-toggle { color: var(--sc-input-c); font-size: var(--sc-input-fs); cursor: pointer; margin-right: calc(-0.5 * var(--sc-input-px)); } :host([inlineContent]) .has-suffix .password-toggle { margin-right: 0; } `"
+        },
+        {
+          "kind": "variable",
+          "name": "label",
+          "default": "css` :host { --sc-label-fs: var(--sc-_fs, 1rem); --sc-label-fw: var(--sc-label-font-weight, 500); } label { font-size: var(--sc-label-fs); font-weight: var(--sc-label-fw); line-height: 1.2; } .form-label { margin-bottom: 0.22em; display: block; } `"
+        },
+        {
+          "kind": "variable",
+          "name": "description",
+          "default": "css` .form-description { color: var(--sc-base-400, var(--sc-base-content, #000)); font-size: 0.85em; margin-top: 0.2em; display: block; } `"
+        },
+        {
+          "kind": "variable",
+          "name": "formControl",
+          "default": "css` * { box-sizing: border-box; } :host { --sc-input-height: var(--sc-form-height, 2.5em); --sc-input-c: var(--sc-input-color, var(--sc-base-content, #000)); --sc-input-b-width: var(--sc-form-border-width); --sc-input-b-color: var( --sc-input-border-color, var(--sc-base-content, #000) ); --sc-item-rounded-tr: var(--sc-input-rounded); --sc-item-rounded-tl: var(--sc-input-rounded); --sc-item-rounded-bl: var(--sc-input-rounded); --sc-item-rounded-br: var(--sc-input-rounded); --sc-input-fs: var(--sc-_fs, 1rem); --sc-input-ff: var( --sc-input-font-family, var(--sc-font-family-base, sans-serif) ); --sc-input-py: 0.55em; --sc-input-px: clamp(0.3em, 8%, 1.1em); --sc-input-background: var(--sc-input-bg); --sc-input-addon-c: var(--sc-input-addon-color, var(--sc-base, #fff)); --sc-input-addon-bg: var(--sc-input-c); } .form-element { display: block; flex-grow: 1; width: 100%; line-height: 1.1; color: var(--sc-input-c); border-radius: var(--sc-item-rounded-tl) var(--sc-item-rounded-tr) var(--sc-item-rounded-br) var(--sc-item-rounded-bl); font-family: var(--sc-input-ff); background-color: var(--sc-input-background); border: var(--sc-input-b-width) solid var(--sc-input-b-color, var(--sc-base-300, #aaa)); width: 100%; font-size: var(--sc-input-fs); padding-top: var(--sc-input-py); padding-bottom: var(--sc-input-py); padding-left: var(--sc-input-px); padding-right: var(--sc-input-px); transition: border-color 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; min-height: var(--sc-input-height); } .form-control { display: flex; width: 100%; } /*Suffix*/ :host(:not([inlineContent])) .has-suffix slot[name=\"suffix\"], :host(:not([inlineContent])) .has-prefix slot[name=\"prefix\"] { min-width: var(--sc-input-height); box-sizing: border-box; display: flex; align-items: center; justify-content: center; line-height: 1.1; flex-shrink: 0; border: var(--sc-input-b-width) solid transparent; padding-left: clamp(0.25em, 3%, calc(0.33 * var(--sc-input-px))); padding-right: clamp(0.25em, 3%, calc(0.33 * var(--sc-input-px))); } :host(:not([inlineContent])) slot[name=\"prefix\"] { border-radius: var(--sc-item-rounded-tl) 0 0 var(--sc-item-rounded-bl); background-color: var(--sc-input-addon-bg); color: var(--sc-input-addon-c); /*margin-right: calc(-1 * var(--sc-input-b-width)); border: none;*/ } :host(:not([inlineContent])) slot[name=\"suffix\"] { border-radius: 0 var(--sc-item-rounded-tr) var(--sc-item-rounded-br) 0; background-color: var(--sc-input-addon-bg); color: var(--sc-input-addon-c); /*margin-left: calc(-1 * var(--sc-input-b-width)); border: none;*/ } :host(:not([inlineContent])[disabled]) .has-suffix slot[name=\"suffix\"], :host(:not([inlineContent])[disabled]) .has-prefix slot[name=\"prefix\"] { opacity: 0.43; } :host(:not([inlineContent])) .has-prefix .form-element { border-top-left-radius: 0; border-bottom-left-radius: 0; } :host(:not([inlineContent])) .has-suffix .form-element { border-top-right-radius: 0; border-bottom-right-radius: 0; } slot[name=\"suffix\"]::slotted(sonic-icon), slot[name=\"prefix\"]::slotted(sonic-icon) { font-size: 1.2em; } /*InlineCONTENT */ .form-element > slot, .form-element .form-element { all: unset; } :host([inlineContent]) .form-element { display: flex; align-items: center; gap: 0.35em; min-height: var(--sc-form-height, 2.5em); } :host([inlineContent]) .form-element .form-element { appearance: none; background: transparent; border: none; padding: 0; display: block; width: 50%; min-width: 0; flex: 1 1 auto; height: auto; min-height: auto; border-radius: 0; } :host([inlineContent]) slot[name=\"prefix\"]::slotted(*), :host([inlineContent]) slot[name=\"suffix\"]::slotted(*) { display: block; flex: 0 0 auto; max-width: 100%; max-width: 100%; white-space: nowrap; } :host([inlineContent]) .has-suffix slot[name=\"suffix\"] { margin-right: calc(-0.5 * var(--sc-input-px)); } :host([inlineContent]) .has-prefix slot[name=\"prefix\"] { margin-left: calc(-0.5 * var(--sc-input-px)); } :host([inlineContent]) slot[name=\"suffix\"]::slotted(*) { margin-left: auto; } :host([inlineContent]) .no-suffix slot[name=\"suffix\"], :host([inlineContent]) .no-prefix slot[name=\"prefix\"] { display: none; } /* :host([inlineContent]) .input { }*/ /*Disabled */ :host([disabled]) .form-control { cursor: not-allowed; } :host([variant=\"ghost\"]) .form-element { --sc-input-bg: transparent; } /*Disbaled*/ :host([disabled]) .form-element { pointer-events: none; opacity: 0.43; /* border-color: transparent;*/ } :host([disabled]) .select-chevron { display: none; /* border-color: transparent;*/ } /*PLACEHOLDER*/ ::placeholder { color: inherit; opacity: 0.6; } :host([placehoderAsLabel]) ::placeholder { opacity: 1; } :focus::placeholder { opacity: 0 !important; } /*HOVER*/ :host(:not([disabled])) .form-element:hover, .form-element:focus-visible, .form-element:focus { background-color: hsl(from var(--sc-input-bg) h s calc(l * 0.97)); } .form-label { margin-bottom: 0.22em; display: block; } /*Utilitaires*/ .hidden { display: none; } .contents { display: contents; } /*ERROR*/ :host([error]) { --sc-input-b-color: var(--sc-danger, var(--sc-base-content, #000)); } :host input:visited { display: none; } :host([touched][required]) :not(:focus):invalid { --sc-input-b-color: var(--sc-danger, var(--sc-base-content, #000)); --sc-input-c: var(--sc-danger, var(--sc-base-content, #000)); } :host([touched][required]) :not(:focus):invalid + .select-chevron { --sc-input-c: var(--sc-danger, var(--sc-base-content, #000)); } /*VALID*/ :host([touched][required]) :not([value=\"\"]):not(:focus):valid { --sc-input-b-color: var(--sc-success, var(--sc-base-content, #000)); --sc-input-c: var(--sc-success, var(--sc-base-content, #000)); } :host([touched][required]) :not(:focus):valid + .select-chevron { --sc-input-c: var(--sc-success, var(--sc-base-content, #000)); } /*active*/ :host([active]) { --sc-input-b-color: var(--sc-primary, var(--sc-base-content, #000)); --sc-input-c: var(--sc-primary, var(--sc-base-content, #000)); } :host([active]) .select-chevron { --sc-input-c: var(--sc-primary, var(--sc-base-content, #000)); } /*Input COLOR*/ :host([type=\"color\"]) .form-element { padding: 0; border: 0; min-width: var(--sc-input-height); } input[type=\"color\"]::-webkit-color-swatch-wrapper { padding: 0; } input[type=\"color\"]::-webkit-color-swatch { border: none; border-radius: var(--sc-item-rounded-tl) var(--sc-item-rounded-tr) var(--sc-item-rounded-br) var(--sc-item-rounded-bl); } /*Input Image*/ :host([type=\"image\"]) .form-element { padding: 0; border: none; } /*Input reset & image*/ input[type=\"reset\"], input[type=\"submit\"] { cursor: pointer; } /*Input search*/ :host([type=\"search\"]) { appearance: none !important; } input[type=\"search\"]::-webkit-search-cancel-button { appearance: none; cursor: pointer; height: 0.65em; width: 0.65em; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE2LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgd2lkdGg9IjEyMy4wNXB4IiBoZWlnaHQ9IjEyMy4wNXB4IiB2aWV3Qm94PSIwIDAgMTIzLjA1IDEyMy4wNSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMTIzLjA1IDEyMy4wNTsiDQoJIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPHBhdGggZD0iTTEyMS4zMjUsMTAuOTI1bC04LjUtOC4zOTljLTIuMy0yLjMtNi4xLTIuMy04LjUsMGwtNDIuNCw0Mi4zOTlMMTguNzI2LDEuNzI2Yy0yLjMwMS0yLjMwMS02LjEwMS0yLjMwMS04LjUsMGwtOC41LDguNQ0KCQljLTIuMzAxLDIuMy0yLjMwMSw2LjEsMCw4LjVsNDMuMSw0My4xbC00Mi4zLDQyLjVjLTIuMywyLjMtMi4zLDYuMSwwLDguNWw4LjUsOC41YzIuMywyLjMsNi4xLDIuMyw4LjUsMGw0Mi4zOTktNDIuNGw0Mi40LDQyLjQNCgkJYzIuMywyLjMsNi4xLDIuMyw4LjUsMGw4LjUtOC41YzIuMy0yLjMsMi4zLTYuMSwwLTguNWwtNDIuNS00Mi40bDQyLjQtNDIuMzk5QzEyMy42MjUsMTcuMTI1LDEyMy42MjUsMTMuMzI1LDEyMS4zMjUsMTAuOTI1eiIvPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPC9zdmc+DQo=); background-size: contain; background-repeat: no-repeat; } /* Text align */ :host([align=\"center\"]) .form-element { text-align: center; } :host([align=\"left\"]) .form-element { text-align: left; } :host([align=\"right\"]) .form-element { text-align: right; } /* No arrows ion input Number */ :host([noAppearance]) input[type=\"number\"]::-webkit-outer-spin-button, :host([noAppearance]) input[type=\"number\"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } :host([noAppearance]) input[type=\"number\"] { -moz-appearance: textfield !important; } /*type color \"default\" | \"success\" | \"error\" | \"warning\" | \"info\" */ :host([status=\"success\"]) { --sc-input-b-color: var(--sc-success, var(--sc-base-content, #000)); --sc-input-c: var(--sc-success, var(--sc-base-content, #000)); --sc-input-addon-bg: var(--sc-success, var(--sc-base-content, #000)); --sc-input-addon-color: var(--sc-success-content, var(--sc-base, #fff)); } :host([status=\"error\"]) { --sc-input-b-color: var(--sc-danger, var(--sc-base-content, #000)); --sc-input-c: var(--sc-danger, var(--sc-base-content, #000)); --sc-input-addon-bg: var(--sc-danger, var(--sc-base-content, #000)); --sc-input-addon-color: var(--sc-danger-content, var(--sc-base, #fff)); } :host([status=\"warning\"]) { --sc-input-b-color: var(--sc-warning); --sc-input-c: var(--sc-warning, var(--sc-base-content, #000)); --sc-input-addon-bg: var(--sc-warning, var(--sc-base-content, #000)); --sc-input-addon-color: var(--sc-warning-content, var(--sc-base, #fff)); } :host([status=\"info\"]) { --sc-input-b-color: var(--sc-info, var(--sc-base-content, #000)); --sc-input-c: var(--sc-info, var(--sc-base-content, #000)); --sc-input-addon-bg: var(--sc-info, var(--sc-base-content, #000)); --sc-input-addon-color: var(--sc-info-content, var(--sc-base, #fff)); } :host([status=\"primary\"]) { --sc-input-b-color: var(--sc-primary, var(--sc-base-content, #000)); --sc-input-c: var(--sc-primary, var(--sc-base-content, #000)); --sc-input-addon-bg: var(--sc-primary, var(--sc-base-content, #000)); --sc-input-addon-color: var(--sc-primary-content, var(--sc-base, #fff)); } `"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "passwordToggle",
+          "declaration": {
+            "name": "passwordToggle",
+            "module": "src/core/components/ui/form/css/form-control.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "label",
+          "declaration": {
+            "name": "label",
+            "module": "src/core/components/ui/form/css/form-control.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "description",
+          "declaration": {
+            "name": "description",
+            "module": "src/core/components/ui/form/css/form-control.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "formControl",
+          "declaration": {
+            "name": "formControl",
+            "module": "src/core/components/ui/form/css/form-control.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/core/components/ui/form/checkbox/checkbox.ts",
@@ -10451,66 +10511,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/core/components/ui/form/css/form-control.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "passwordToggle",
-          "default": "css` .password-toggle { color: var(--sc-input-c); font-size: var(--sc-input-fs); cursor: pointer; margin-right: calc(-0.5 * var(--sc-input-px)); } :host([inlineContent]) .has-suffix .password-toggle { margin-right: 0; } `"
-        },
-        {
-          "kind": "variable",
-          "name": "label",
-          "default": "css` :host { --sc-label-fs: var(--sc-_fs, 1rem); --sc-label-fw: var(--sc-label-font-weight, 500); } label { font-size: var(--sc-label-fs); font-weight: var(--sc-label-fw); line-height: 1.2; } .form-label { margin-bottom: 0.22em; display: block; } `"
-        },
-        {
-          "kind": "variable",
-          "name": "description",
-          "default": "css` .form-description { color: var(--sc-base-400, var(--sc-base-content, #000)); font-size: 0.85em; margin-top: 0.2em; display: block; } `"
-        },
-        {
-          "kind": "variable",
-          "name": "formControl",
-          "default": "css` * { box-sizing: border-box; } :host { --sc-input-height: var(--sc-form-height, 2.5em); --sc-input-c: var(--sc-input-color, var(--sc-base-content, #000)); --sc-input-b-width: var(--sc-form-border-width); --sc-input-b-color: var( --sc-input-border-color, var(--sc-base-content, #000) ); --sc-item-rounded-tr: var(--sc-input-rounded); --sc-item-rounded-tl: var(--sc-input-rounded); --sc-item-rounded-bl: var(--sc-input-rounded); --sc-item-rounded-br: var(--sc-input-rounded); --sc-input-fs: var(--sc-_fs, 1rem); --sc-input-ff: var( --sc-input-font-family, var(--sc-font-family-base, sans-serif) ); --sc-input-py: 0.55em; --sc-input-px: clamp(0.3em, 8%, 1.1em); --sc-input-background: var(--sc-input-bg); --sc-input-addon-c: var(--sc-input-addon-color, var(--sc-base, #fff)); --sc-input-addon-bg: var(--sc-input-c); } .form-element { display: block; flex-grow: 1; width: 100%; line-height: 1.1; color: var(--sc-input-c); border-radius: var(--sc-item-rounded-tl) var(--sc-item-rounded-tr) var(--sc-item-rounded-br) var(--sc-item-rounded-bl); font-family: var(--sc-input-ff); background-color: var(--sc-input-background); border: var(--sc-input-b-width) solid var(--sc-input-b-color, var(--sc-base-300, #aaa)); width: 100%; font-size: var(--sc-input-fs); padding-top: var(--sc-input-py); padding-bottom: var(--sc-input-py); padding-left: var(--sc-input-px); padding-right: var(--sc-input-px); transition: border-color 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; min-height: var(--sc-input-height); } .form-control { display: flex; width: 100%; } /*Suffix*/ :host(:not([inlineContent])) .has-suffix slot[name=\"suffix\"], :host(:not([inlineContent])) .has-prefix slot[name=\"prefix\"] { min-width: var(--sc-input-height); box-sizing: border-box; display: flex; align-items: center; justify-content: center; line-height: 1.1; flex-shrink: 0; border: var(--sc-input-b-width) solid transparent; padding-left: clamp(0.25em, 3%, calc(0.33 * var(--sc-input-px))); padding-right: clamp(0.25em, 3%, calc(0.33 * var(--sc-input-px))); } :host(:not([inlineContent])) slot[name=\"prefix\"] { border-radius: var(--sc-item-rounded-tl) 0 0 var(--sc-item-rounded-bl); background-color: var(--sc-input-addon-bg); color: var(--sc-input-addon-c); /*margin-right: calc(-1 * var(--sc-input-b-width)); border: none;*/ } :host(:not([inlineContent])) slot[name=\"suffix\"] { border-radius: 0 var(--sc-item-rounded-tr) var(--sc-item-rounded-br) 0; background-color: var(--sc-input-addon-bg); color: var(--sc-input-addon-c); /*margin-left: calc(-1 * var(--sc-input-b-width)); border: none;*/ } :host(:not([inlineContent])[disabled]) .has-suffix slot[name=\"suffix\"], :host(:not([inlineContent])[disabled]) .has-prefix slot[name=\"prefix\"] { opacity: 0.43; } :host(:not([inlineContent])) .has-prefix .form-element { border-top-left-radius: 0; border-bottom-left-radius: 0; } :host(:not([inlineContent])) .has-suffix .form-element { border-top-right-radius: 0; border-bottom-right-radius: 0; } slot[name=\"suffix\"]::slotted(sonic-icon), slot[name=\"prefix\"]::slotted(sonic-icon) { font-size: 1.2em; } /*InlineCONTENT */ .form-element > slot, .form-element .form-element { all: unset; } :host([inlineContent]) .form-element { display: flex; align-items: center; gap: 0.35em; min-height: var(--sc-form-height, 2.5em); } :host([inlineContent]) .form-element .form-element { appearance: none; background: transparent; border: none; padding: 0; display: block; width: 50%; min-width: 0; flex: 1 1 auto; height: auto; min-height: auto; border-radius: 0; } :host([inlineContent]) slot[name=\"prefix\"]::slotted(*), :host([inlineContent]) slot[name=\"suffix\"]::slotted(*) { display: block; flex: 0 0 auto; max-width: 100%; max-width: 100%; white-space: nowrap; } :host([inlineContent]) .has-suffix slot[name=\"suffix\"] { margin-right: calc(-0.5 * var(--sc-input-px)); } :host([inlineContent]) .has-prefix slot[name=\"prefix\"] { margin-left: calc(-0.5 * var(--sc-input-px)); } :host([inlineContent]) slot[name=\"suffix\"]::slotted(*) { margin-left: auto; } :host([inlineContent]) .no-suffix slot[name=\"suffix\"], :host([inlineContent]) .no-prefix slot[name=\"prefix\"] { display: none; } /* :host([inlineContent]) .input { }*/ /*Disabled */ :host([disabled]) .form-control { cursor: not-allowed; } :host([variant=\"ghost\"]) .form-element { --sc-input-bg: transparent; } /*Disbaled*/ :host([disabled]) .form-element { pointer-events: none; opacity: 0.43; /* border-color: transparent;*/ } :host([disabled]) .select-chevron { display: none; /* border-color: transparent;*/ } /*PLACEHOLDER*/ ::placeholder { color: inherit; opacity: 0.6; } :host([placehoderAsLabel]) ::placeholder { opacity: 1; } :focus::placeholder { opacity: 0 !important; } /*HOVER*/ :host(:not([disabled])) .form-element:hover, .form-element:focus-visible, .form-element:focus { background-color: hsl(from var(--sc-input-bg) h s calc(l * 0.97)); } .form-label { margin-bottom: 0.22em; display: block; } /*Utilitaires*/ .hidden { display: none; } .contents { display: contents; } /*ERROR*/ :host([error]) { --sc-input-b-color: var(--sc-danger, var(--sc-base-content, #000)); } :host input:visited { display: none; } :host([touched][required]) :not(:focus):invalid { --sc-input-b-color: var(--sc-danger, var(--sc-base-content, #000)); --sc-input-c: var(--sc-danger, var(--sc-base-content, #000)); } :host([touched][required]) :not(:focus):invalid + .select-chevron { --sc-input-c: var(--sc-danger, var(--sc-base-content, #000)); } /*VALID*/ :host([touched][required]) :not([value=\"\"]):not(:focus):valid { --sc-input-b-color: var(--sc-success, var(--sc-base-content, #000)); --sc-input-c: var(--sc-success, var(--sc-base-content, #000)); } :host([touched][required]) :not(:focus):valid + .select-chevron { --sc-input-c: var(--sc-success, var(--sc-base-content, #000)); } /*active*/ :host([active]) { --sc-input-b-color: var(--sc-primary, var(--sc-base-content, #000)); --sc-input-c: var(--sc-primary, var(--sc-base-content, #000)); } :host([active]) .select-chevron { --sc-input-c: var(--sc-primary, var(--sc-base-content, #000)); } /*Input COLOR*/ :host([type=\"color\"]) .form-element { padding: 0; border: 0; min-width: var(--sc-input-height); } input[type=\"color\"]::-webkit-color-swatch-wrapper { padding: 0; } input[type=\"color\"]::-webkit-color-swatch { border: none; border-radius: var(--sc-item-rounded-tl) var(--sc-item-rounded-tr) var(--sc-item-rounded-br) var(--sc-item-rounded-bl); } /*Input Image*/ :host([type=\"image\"]) .form-element { padding: 0; border: none; } /*Input reset & image*/ input[type=\"reset\"], input[type=\"submit\"] { cursor: pointer; } /*Input search*/ :host([type=\"search\"]) { appearance: none !important; } input[type=\"search\"]::-webkit-search-cancel-button { appearance: none; cursor: pointer; height: 0.65em; width: 0.65em; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE2LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgd2lkdGg9IjEyMy4wNXB4IiBoZWlnaHQ9IjEyMy4wNXB4IiB2aWV3Qm94PSIwIDAgMTIzLjA1IDEyMy4wNSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMTIzLjA1IDEyMy4wNTsiDQoJIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPHBhdGggZD0iTTEyMS4zMjUsMTAuOTI1bC04LjUtOC4zOTljLTIuMy0yLjMtNi4xLTIuMy04LjUsMGwtNDIuNCw0Mi4zOTlMMTguNzI2LDEuNzI2Yy0yLjMwMS0yLjMwMS02LjEwMS0yLjMwMS04LjUsMGwtOC41LDguNQ0KCQljLTIuMzAxLDIuMy0yLjMwMSw2LjEsMCw4LjVsNDMuMSw0My4xbC00Mi4zLDQyLjVjLTIuMywyLjMtMi4zLDYuMSwwLDguNWw4LjUsOC41YzIuMywyLjMsNi4xLDIuMyw4LjUsMGw0Mi4zOTktNDIuNGw0Mi40LDQyLjQNCgkJYzIuMywyLjMsNi4xLDIuMyw4LjUsMGw4LjUtOC41YzIuMy0yLjMsMi4zLTYuMSwwLTguNWwtNDIuNS00Mi40bDQyLjQtNDIuMzk5QzEyMy42MjUsMTcuMTI1LDEyMy42MjUsMTMuMzI1LDEyMS4zMjUsMTAuOTI1eiIvPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPC9zdmc+DQo=); background-size: contain; background-repeat: no-repeat; } /* Text align */ :host([align=\"center\"]) .form-element { text-align: center; } :host([align=\"left\"]) .form-element { text-align: left; } :host([align=\"right\"]) .form-element { text-align: right; } /* No arrows ion input Number */ :host([noAppearance]) input[type=\"number\"]::-webkit-outer-spin-button, :host([noAppearance]) input[type=\"number\"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } :host([noAppearance]) input[type=\"number\"] { -moz-appearance: textfield !important; } /*type color \"default\" | \"success\" | \"error\" | \"warning\" | \"info\" */ :host([status=\"success\"]) { --sc-input-b-color: var(--sc-success, var(--sc-base-content, #000)); --sc-input-c: var(--sc-success, var(--sc-base-content, #000)); --sc-input-addon-bg: var(--sc-success, var(--sc-base-content, #000)); --sc-input-addon-color: var(--sc-success-content, var(--sc-base, #fff)); } :host([status=\"error\"]) { --sc-input-b-color: var(--sc-danger, var(--sc-base-content, #000)); --sc-input-c: var(--sc-danger, var(--sc-base-content, #000)); --sc-input-addon-bg: var(--sc-danger, var(--sc-base-content, #000)); --sc-input-addon-color: var(--sc-danger-content, var(--sc-base, #fff)); } :host([status=\"warning\"]) { --sc-input-b-color: var(--sc-warning); --sc-input-c: var(--sc-warning, var(--sc-base-content, #000)); --sc-input-addon-bg: var(--sc-warning, var(--sc-base-content, #000)); --sc-input-addon-color: var(--sc-warning-content, var(--sc-base, #fff)); } :host([status=\"info\"]) { --sc-input-b-color: var(--sc-info, var(--sc-base-content, #000)); --sc-input-c: var(--sc-info, var(--sc-base-content, #000)); --sc-input-addon-bg: var(--sc-info, var(--sc-base-content, #000)); --sc-input-addon-color: var(--sc-info-content, var(--sc-base, #fff)); } :host([status=\"primary\"]) { --sc-input-b-color: var(--sc-primary, var(--sc-base-content, #000)); --sc-input-c: var(--sc-primary, var(--sc-base-content, #000)); --sc-input-addon-bg: var(--sc-primary, var(--sc-base-content, #000)); --sc-input-addon-color: var(--sc-primary-content, var(--sc-base, #fff)); } `"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "passwordToggle",
-          "declaration": {
-            "name": "passwordToggle",
-            "module": "src/core/components/ui/form/css/form-control.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "label",
-          "declaration": {
-            "name": "label",
-            "module": "src/core/components/ui/form/css/form-control.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "description",
-          "declaration": {
-            "name": "description",
-            "module": "src/core/components/ui/form/css/form-control.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "formControl",
-          "declaration": {
-            "name": "formControl",
-            "module": "src/core/components/ui/form/css/form-control.ts"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/core/components/ui/form/fieldset/fieldset.ts",