@alikhalilll/a-smart-skeleton 0.0.0-stage → 2.0.0

package/web-types.json

@@ -0,0 +1,256 @@
+{
+  "$schema": "https://json.schemastore.org/web-types",
+  "name": "@alikhalilll/a-smart-skeleton",
+  "version": "2.0.0",
+  "js-types-syntax": "typescript",
+  "description-markup": "markdown",
+  "framework": "vue",
+  "framework-config": {
+    "enable-when": {
+      "node-packages": [
+        "vue"
+      ]
+    }
+  },
+  "contributions": {
+    "html": {
+      "vue-components": [
+        {
+          "name": "ASmartSkeleton",
+          "source": {
+            "module": "@alikhalilll/a-smart-skeleton",
+            "symbol": "ASmartSkeleton"
+          },
+          "description": "Slots: `default` (with `{ data }` when `data` is bound), `skeleton`, `empty`,\n`error` (with `{ error }`).",
+          "props": [
+            {
+              "name": "class",
+              "type": "string",
+              "required": false
+            },
+            {
+              "name": "data",
+              "type": "T | null",
+              "required": false,
+              "description": "Loading while `null` or `undefined`; handed to the default slot as `{ data }`."
+            },
+            {
+              "name": "empty",
+              "type": "boolean",
+              "required": false,
+              "description": "Renders the `empty` slot instead of the content."
+            },
+            {
+              "name": "error",
+              "type": "unknown",
+              "required": false,
+              "description": "When set, renders the `error` slot with `{ error }` instead of the content."
+            },
+            {
+              "name": "id",
+              "type": "string",
+              "required": false,
+              "description": "Remembers the shape under this key across visits."
+            },
+            {
+              "name": "label",
+              "type": "string",
+              "required": false,
+              "description": "Read to screen readers while loading, in place of the skeleton — \"Loading profile\"."
+            },
+            {
+              "name": "loading",
+              "type": "boolean",
+              "required": false,
+              "description": "Shows the skeleton, even over `data`. With `data`, it also shows while there is none."
+            },
+            {
+              "name": "onReveal",
+              "type": "(() => void)",
+              "required": false,
+              "description": "Called once content has come in over a skeleton; `@reveal` in a template."
+            },
+            {
+              "name": "reveal",
+              "type": "RevealMode",
+              "required": false,
+              "description": "Overrides the provider's reveal for this skeleton alone."
+            },
+            {
+              "name": "sample",
+              "type": "T",
+              "required": false,
+              "description": "Stands in for `data` to draw the skeleton before any has loaded."
+            },
+            {
+              "name": "style",
+              "type": "Record<string, string | number>",
+              "required": false
+            }
+          ],
+          "slots": [
+            {
+              "name": "default",
+              "description": "The content. Receives `{ data }` when `data` is bound."
+            },
+            {
+              "name": "empty",
+              "description": "Shown when `empty` is set. Falls back to the content."
+            },
+            {
+              "name": "error",
+              "description": "Shown when `error` is set. Receives `{ error }`."
+            },
+            {
+              "name": "skeleton",
+              "description": "Shown while loading instead of the measured skeleton."
+            }
+          ],
+          "js": {
+            "events": [
+              {
+                "name": "reveal",
+                "description": "Content has come in over a skeleton."
+              }
+            ]
+          }
+        },
+        {
+          "name": "ASmartSkeletonBox",
+          "source": {
+            "module": "@alikhalilll/a-smart-skeleton",
+            "symbol": "ASmartSkeletonBox"
+          },
+          "props": [
+            {
+              "name": "class",
+              "type": "string",
+              "required": false
+            },
+            {
+              "name": "height",
+              "type": "Length",
+              "required": false
+            },
+            {
+              "name": "radius",
+              "type": "Length",
+              "required": false
+            },
+            {
+              "name": "style",
+              "type": "Record<string, string | number>",
+              "required": false
+            },
+            {
+              "name": "width",
+              "type": "Length",
+              "required": false
+            }
+          ]
+        },
+        {
+          "name": "ASmartSkeletonSuspense",
+          "source": {
+            "module": "@alikhalilll/a-smart-skeleton",
+            "symbol": "ASmartSkeletonSuspense"
+          },
+          "description": "Slots: `default`, the content that suspends; `skeleton`, the content rendered from sample data.",
+          "props": [
+            {
+              "name": "id",
+              "type": "string",
+              "required": false,
+              "description": "Remembers the shape under this key across visits."
+            },
+            {
+              "name": "label",
+              "type": "string",
+              "required": false,
+              "description": "Read to screen readers while suspended, in place of the skeleton."
+            },
+            {
+              "name": "onReveal",
+              "type": "(() => void)",
+              "required": false,
+              "description": "Called once content has come in over the skeleton; `@reveal` in a template."
+            },
+            {
+              "name": "reveal",
+              "type": "RevealMode",
+              "required": false,
+              "description": "Overrides the provider's reveal for this boundary alone."
+            }
+          ],
+          "slots": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "skeleton"
+            }
+          ],
+          "js": {
+            "events": [
+              {
+                "name": "reveal",
+                "description": "Content has come in over the skeleton."
+              }
+            ]
+          }
+        },
+        {
+          "name": "ASmartSkeletonProvider",
+          "source": {
+            "module": "@alikhalilll/a-smart-skeleton",
+            "symbol": "ASmartSkeletonProvider"
+          },
+          "description": "Settings for every skeleton inside. Per request on the server, as a nonce must be.",
+          "props": [
+            {
+              "name": "debug",
+              "type": "boolean",
+              "required": false,
+              "description": "Outlines every reveal with where its skeleton came from and whether anything moved."
+            },
+            {
+              "name": "mode",
+              "type": "SkeletonMode",
+              "required": false,
+              "description": "`system` follows `prefers-color-scheme`; the others pin one set of colours."
+            },
+            {
+              "name": "nonce",
+              "type": "string",
+              "required": false,
+              "description": "Set on the inline script and stylesheets rendered, for a Content Security Policy."
+            },
+            {
+              "name": "reveal",
+              "type": "RevealMode",
+              "required": false,
+              "description": "How content replaces its skeleton: `smart` (the default), `together`, `sequence`, `sweep`, or a `RevealSpec` of your own."
+            },
+            {
+              "name": "text",
+              "type": "SkeletonText",
+              "required": false,
+              "description": "Where text bars run: from `top` (ascender, cap-height, x-height) down to `bottom` (baseline, descender)."
+            },
+            {
+              "name": "theme",
+              "type": "SkeletonTheme",
+              "required": false,
+              "description": "Colours for light and dark; `mode` picks between them."
+            }
+          ],
+          "slots": [
+            {
+              "name": "default"
+            }
+          ]
+        }
+      ]
+    }
+  }
+}