@twentyfirstmedia/elements 0.7.0 → 0.8.0

package/dist/vscode.html-custom-data.json

@@ -1689,6 +1689,646 @@
         }
       ]
     },
+    {
+      "name": "tf-service-mark",
+      "description": "A connected service's mark: its brand logo from the icon library (brandGmail, brandTesla …), your own logo, or a monogram for a service without a logo (\"KS\" for a local nursery).",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "The service's name: the accessible name, and the monogram when there is no icon or logo. (string)"
+        },
+        {
+          "name": "icon",
+          "description": "A brand logo (`brandGmail` …) or a line icon. (IconName)"
+        },
+        {
+          "name": "logo",
+          "description": "Your own logo (an `<img>` or `<svg>`) instead of the icon. (ReactNode)"
+        },
+        {
+          "name": "monogram",
+          "description": "Letters for the monogram (default: the initials of `name`). (string)"
+        },
+        {
+          "name": "size",
+          "description": "24, 36 (default) or 48 px. (\"sm\" | \"md\" | \"lg\")",
+          "values": [
+            {
+              "name": "sm"
+            },
+            {
+              "name": "md"
+            },
+            {
+              "name": "lg"
+            }
+          ]
+        },
+        {
+          "name": "tint",
+          "description": "(Tint | \"plain\")"
+        },
+        {
+          "name": "status",
+          "description": "A dot in the corner with the state in words for screen readers. (ServiceState)"
+        },
+        {
+          "name": "decorative",
+          "description": "Hidden from screen readers when the name is written next to it. (boolean)",
+          "valueSet": "v"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/ServiceMark/"
+        }
+      ]
+    },
+    {
+      "name": "tf-connector-gallery",
+      "description": "Every service an assistant can connect to, grouped by category, with a search field and category chips.",
+      "attributes": [
+        {
+          "name": "connectors",
+          "description": "(Connector[])"
+        },
+        {
+          "name": "categories",
+          "description": "Order of the groups; categories not listed follow in the order they appear. (string[])"
+        },
+        {
+          "name": "filters",
+          "description": "A search field and category chips above the grid (default true). (boolean)",
+          "valueSet": "v"
+        },
+        {
+          "name": "label",
+          "description": "Accessible name (default \"Connectors\"). (string)"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/ConnectorGallery/"
+        }
+      ]
+    },
+    {
+      "name": "tf-connection-list",
+      "description": "The services you are connected to: mark with state dot, the connected account, how fresh the data is (a compact SyncStatus) and Manage, or Reconnect for a connection that needs attention.",
+      "attributes": [
+        {
+          "name": "items",
+          "description": "(ConnectionItem[])"
+        },
+        {
+          "name": "now",
+          "description": "\"Now\" for the relative times; pass it so server and client render the same. (Date | string | number)"
+        },
+        {
+          "name": "label",
+          "description": "Accessible name (default \"Connections\"). (string)"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/ConnectionList/"
+        }
+      ]
+    },
+    {
+      "name": "tf-sync-status",
+      "description": "When a connected service last synced, in words (\"Synced 6 minutes ago\"), when it syncs next, what the last sync brought (\"1,204 emails\") and why a sync failed, with \"Sync now\".",
+      "attributes": [
+        {
+          "name": "state",
+          "description": "(\"synced\" | \"syncing\" | \"error\" | \"paused\" | \"never\")",
+          "values": [
+            {
+              "name": "synced"
+            },
+            {
+              "name": "syncing"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "paused"
+            },
+            {
+              "name": "never"
+            }
+          ]
+        },
+        {
+          "name": "last",
+          "description": "The last successful sync. (Date | string | number)"
+        },
+        {
+          "name": "next",
+          "description": "The next planned sync. (Date | string | number)"
+        },
+        {
+          "name": "now",
+          "description": "\"Now\" for the relative times; pass it so server and client render the same. (Date | string | number)"
+        },
+        {
+          "name": "counts",
+          "description": "What the last sync brought: `{ label: \"emails\", value: 1204 }`. ({ label: string; value: number }[])"
+        },
+        {
+          "name": "error",
+          "description": "Why the sync failed. (ReactNode)"
+        },
+        {
+          "name": "compact",
+          "description": "One line: state and time only. (boolean)",
+          "valueSet": "v"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/SyncStatus/"
+        }
+      ]
+    },
+    {
+      "name": "tf-agent-activity",
+      "description": "What agents did with your connected services, newest first and grouped by day: each action with its service, agent and time, whether it read something, changed something or touched money, and its state (waiting for you, declined, undone, fa",
+      "attributes": [
+        {
+          "name": "items",
+          "description": "(AgentAction[])"
+        },
+        {
+          "name": "now",
+          "description": "\"Now\" for the day headings; pass it so server and client render the same. (Date | string | number)"
+        },
+        {
+          "name": "label",
+          "description": "Accessible name (default \"Agent activity\"). (string)"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/AgentActivity/"
+        }
+      ]
+    },
+    {
+      "name": "tf-device-tile",
+      "description": "A smart-home device (from Google Home, Apple Home, SmartThings, tado°, Dyson, eufy, Dreame …): its reading, its state and the controls its kind needs.",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "(string)"
+        },
+        {
+          "name": "room",
+          "description": "(string)"
+        },
+        {
+          "name": "icon",
+          "description": "(IconName)"
+        },
+        {
+          "name": "kind",
+          "description": "The kind sets the default icon and which controls appear. (\"switch\" | \"light\" | \"thermostat\" | \"vacuum\" | \"purifier\" | \"camera\" | \"lock\" | \"sensor\")",
+          "values": [
+            {
+              "name": "switch"
+            },
+            {
+              "name": "light"
+            },
+            {
+              "name": "thermostat"
+            },
+            {
+              "name": "vacuum"
+            },
+            {
+              "name": "purifier"
+            },
+            {
+              "name": "camera"
+            },
+            {
+              "name": "lock"
+            },
+            {
+              "name": "sensor"
+            }
+          ]
+        },
+        {
+          "name": "on",
+          "description": "On or off; with `onToggle` a switch. (boolean)",
+          "valueSet": "v"
+        },
+        {
+          "name": "value",
+          "description": "The main reading: \"21.5 °C\", \"Cleaning\", \"AQI 12\". (ReactNode)"
+        },
+        {
+          "name": "status",
+          "description": "A line under the value: \"Heating to 22 °C\", \"Kitchen · 18 m² left\". (ReactNode)"
+        },
+        {
+          "name": "target",
+          "description": "Thermostat target in °C; with `onTarget` a − / + stepper (steps of `step`, default 0.5). (number)"
+        },
+        {
+          "name": "step",
+          "description": "(number)"
+        },
+        {
+          "name": "battery",
+          "description": "Battery in percent (vacuums, sensors, locks). (number)"
+        },
+        {
+          "name": "actions",
+          "description": "Quick actions: \"Start\", \"Dock\", \"Boost\". ({ label: string; icon?: IconName; onClick?: () => void }[])"
+        },
+        {
+          "name": "offline",
+          "description": "The device does not answer. (boolean)",
+          "valueSet": "v"
+        },
+        {
+          "name": "service",
+          "description": "(ServiceRef)"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/DeviceTile/"
+        }
+      ]
+    },
+    {
+      "name": "tf-vehicle-card",
+      "description": "An electric car: charge in percent with the limit marked on the bar, range, charging state with power and when it is done, lock and climate as buttons, the inside temperature and where it is.",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "(string)"
+        },
+        {
+          "name": "model",
+          "description": "(string)"
+        },
+        {
+          "name": "battery",
+          "description": "Battery (or tank) in percent. (number)"
+        },
+        {
+          "name": "range",
+          "description": "Range in km. (number)"
+        },
+        {
+          "name": "limit",
+          "description": "The charge limit in percent, marked on the bar. (number)"
+        },
+        {
+          "name": "charging",
+          "description": "(\"charging\" | \"complete\" | \"plugged\" | \"unplugged\")",
+          "values": [
+            {
+              "name": "charging"
+            },
+            {
+              "name": "complete"
+            },
+            {
+              "name": "plugged"
+            },
+            {
+              "name": "unplugged"
+            }
+          ]
+        },
+        {
+          "name": "power",
+          "description": "Charging power in kW while charging. (number)"
+        },
+        {
+          "name": "until",
+          "description": "When charging reaches the limit. (Date | string | number)"
+        },
+        {
+          "name": "locked",
+          "description": "(boolean)",
+          "valueSet": "v"
+        },
+        {
+          "name": "inside",
+          "description": "Inside temperature in °C. (number)"
+        },
+        {
+          "name": "climate-on",
+          "description": "(boolean)",
+          "valueSet": "v"
+        },
+        {
+          "name": "location",
+          "description": "(ReactNode)"
+        },
+        {
+          "name": "service",
+          "description": "(ServiceRef)"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/VehicleCard/"
+        }
+      ]
+    },
+    {
+      "name": "tf-now-playing",
+      "description": "What is playing (Spotify, a speaker, a podcast app): cover, title and artist, the device, progress with times and previous / play-pause / next.",
+      "attributes": [
+        {
+          "name": "title",
+          "description": "(string)"
+        },
+        {
+          "name": "artist",
+          "description": "(string)"
+        },
+        {
+          "name": "album",
+          "description": "(string)"
+        },
+        {
+          "name": "art",
+          "description": "Cover art: an `<img>`. (ReactNode)"
+        },
+        {
+          "name": "position",
+          "description": "Position and length in seconds. (number)"
+        },
+        {
+          "name": "duration",
+          "description": "(number)"
+        },
+        {
+          "name": "playing",
+          "description": "(boolean)",
+          "valueSet": "v"
+        },
+        {
+          "name": "device",
+          "description": "Where it plays: \"Living room speaker\". (string)"
+        },
+        {
+          "name": "service",
+          "description": "(ServiceRef)"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/NowPlaying/"
+        }
+      ]
+    },
+    {
+      "name": "tf-workout-card",
+      "description": "One workout from Apple Fitness, Strava, Garmin or a golf app: type, time, duration, distance, calories, average heart rate and minutes in each heart-rate zone as a bar with a legend in words.",
+      "attributes": [
+        {
+          "name": "type",
+          "description": "\"Run\", \"Ride\", \"Strength\", \"Golf\" … (string)"
+        },
+        {
+          "name": "icon",
+          "description": "(IconName)"
+        },
+        {
+          "name": "date",
+          "description": "(Date | string | number)"
+        },
+        {
+          "name": "duration",
+          "description": "Minutes. (number)"
+        },
+        {
+          "name": "distance",
+          "description": "Kilometres. (number)"
+        },
+        {
+          "name": "calories",
+          "description": "(number)"
+        },
+        {
+          "name": "heart-rate",
+          "description": "Average heart rate in bpm. (number)"
+        },
+        {
+          "name": "zones",
+          "description": "Minutes in heart-rate zones 1–5. (number[])"
+        },
+        {
+          "name": "service",
+          "description": "(ServiceRef)"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/WorkoutCard/"
+        }
+      ]
+    },
+    {
+      "name": "tf-call-log",
+      "description": "Your calls grouped by day: incoming, outgoing and missed with time and length, and what the call was about when an assistant summarised it.",
+      "attributes": [
+        {
+          "name": "calls",
+          "description": "(CallItem[])"
+        },
+        {
+          "name": "now",
+          "description": "\"Now\" for the day headings. (Date | string | number)"
+        },
+        {
+          "name": "label",
+          "description": "Accessible name (default \"Calls\"). (string)"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/CallLog/"
+        }
+      ]
+    },
+    {
+      "name": "tf-reservation-card",
+      "description": "A booking or order: a stay, flight, train, ride, delivery or ticket with its dates, place, booking number and status (confirmed, pending, delayed, on the way, delivered, cancelled) plus a note like \"+25 min\".",
+      "attributes": [
+        {
+          "name": "kind",
+          "description": "(\"stay\" | \"flight\" | \"train\" | \"ride\" | \"order\" | \"event\")",
+          "values": [
+            {
+              "name": "stay"
+            },
+            {
+              "name": "flight"
+            },
+            {
+              "name": "train"
+            },
+            {
+              "name": "ride"
+            },
+            {
+              "name": "order"
+            },
+            {
+              "name": "event"
+            }
+          ]
+        },
+        {
+          "name": "title",
+          "description": "(string)"
+        },
+        {
+          "name": "subtitle",
+          "description": "\"Hotel Atlantic · 2 nights\", \"LH 2024 · Seat 14A\". (ReactNode)"
+        },
+        {
+          "name": "start",
+          "description": "(Date | string | number)"
+        },
+        {
+          "name": "end",
+          "description": "(Date | string | number)"
+        },
+        {
+          "name": "place",
+          "description": "Where: an address, airport codes, a restaurant. (ReactNode)"
+        },
+        {
+          "name": "code",
+          "description": "Booking or order number. (string)"
+        },
+        {
+          "name": "status",
+          "description": "(\"confirmed\" | \"pending\" | \"cancelled\" | \"delayed\" | \"onTheWay\" | \"delivered\")",
+          "values": [
+            {
+              "name": "confirmed"
+            },
+            {
+              "name": "pending"
+            },
+            {
+              "name": "cancelled"
+            },
+            {
+              "name": "delayed"
+            },
+            {
+              "name": "onTheWay"
+            },
+            {
+              "name": "delivered"
+            }
+          ]
+        },
+        {
+          "name": "status-text",
+          "description": "Extra words for the status: \"+25 min\", \"Arrives 19:40\". (string)"
+        },
+        {
+          "name": "service",
+          "description": "(ServiceRef)"
+        },
+        {
+          "name": "actions",
+          "description": "(ReactNode)"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/ReservationCard/"
+        }
+      ]
+    },
+    {
+      "name": "tf-scorecard",
+      "description": "A round of golf: par and strokes for each hole in the usual marks (circle for a birdie, double circle for an eagle, square for a bogey, double square for worse), putts, Out, In and the total against par.",
+      "attributes": [
+        {
+          "name": "course",
+          "description": "(string)"
+        },
+        {
+          "name": "date",
+          "description": "(Date | string | number)"
+        },
+        {
+          "name": "holes",
+          "description": "9 or 18 holes. (GolfHole[])"
+        },
+        {
+          "name": "tee",
+          "description": "Tee and course rating: \"Yellow · CR 71.2 / SR 128\". (string)"
+        },
+        {
+          "name": "service",
+          "description": "(ServiceRef)"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/Scorecard/"
+        }
+      ]
+    },
+    {
+      "name": "tf-holdings-list",
+      "description": "Positions in a portfolio: name and ISIN or ticker, value, change over a period (arrow, sign and colour) and the share of the portfolio as a bar.",
+      "attributes": [
+        {
+          "name": "holdings",
+          "description": "(Holding[])"
+        },
+        {
+          "name": "currency",
+          "description": "(string)"
+        },
+        {
+          "name": "period",
+          "description": "The period of `change` (\"today\", \"1 year\"). (string)"
+        },
+        {
+          "name": "label",
+          "description": "Accessible name (default \"Holdings\"). (string)"
+        }
+      ],
+      "references": [
+        {
+          "name": "Docs",
+          "url": "https://ui.twentyfirst.media/halo/components/HoldingsList/"
+        }
+      ]
+    },
     {
       "name": "tf-agent-card",
       "description": "One agent at a glance (AgentCard) and everything about it beside a chat (AgentDetails).",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@twentyfirstmedia/elements",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "Every Twentyfirst UI component as a custom element: <tf-button>, <tf-data-table> … for plain HTML, Vue, Svelte, Angular, Astro and server templates.",
   "license": "MIT",
   "author": "Twentyfirst Media (https://twentyfirst.media)",
@@ -51,10 +51,11 @@
     "./package.json": "./package.json"
   },
   "files": [
-    "dist"
+    "dist",
+    "ICONS-LICENSE"
   ],
   "devDependencies": {
-    "@twentyfirstmedia/ui-core": "0.7.0",
+    "@twentyfirstmedia/ui-core": "0.8.0",
     "@types/node": "26.6.6",
     "@types/react": "19.3.0",
     "@types/react-dom": "19.3.0",