timepicker-ui-mcp 0.0.0-stage → 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 pglejzer (Piotr Glejzer)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,111 @@
-# Temporary Holding Version
-
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+# timepicker-ui MCP server
+
+An MCP server for `timepicker-ui`. Connect it to Claude Code, Claude Desktop or another MCP client and the model can look up options, events and themes, generate setup snippets and custom themes, and migrate v3 code. Everything it returns comes from the library source, not from the model's memory.
+
+It runs over stdio and needs Node 18 or newer.
+
+## Tools
+
+| Tool | Description |
+|------|-------------|
+| `list_themes` | Built-in themes and their CSS import paths. |
+| `list_modes` | UI modes (`clock`, `wheel`, `compact-wheel`) and the plugin each needs. |
+| `list_plugins` | Optional plugins (range, timezone, wheel) with import paths. |
+| `list_events` | Every EventEmitter event with its payload fields. |
+| `list_api` | Public instance and static API, plus the `getValue`/`setValue` contract. |
+| `list_css_classes` | The `tp-ui-` class names rendered by the templates. |
+| `get_options` | Grouped options with type, default and description. Optional `group` filter. |
+| `explain_option` | Full detail for one option (`group` + `name`). |
+| `get_theme` | The `--tp-` variables a built-in theme overrides. |
+| `framework_recipe` | Integration recipe and SSR notes for vanilla, react, next, vue, angular, svelte. |
+| `migration_guide` | `v3->v4` field mapping, or the `v4.3->v4.4` / `v4.4->v4.5` changes. |
+| `generate_snippet` | Vanilla JS or React setup (CSS imports and plugin registration). |
+| `generate_custom_theme` | A `[data-theme]` CSS block from `overrides`, or a full scaffold. |
+| `validate_time` | Checks `HH:MM`, `HH:MM:SS`, `h:MM AM/PM` or `h:MM:SS AM/PM` against a 12h or 24h clock. |
+| `validate_disabled_time` | Checks a `clock.disabledTime` config (hours, minutes, seconds, range strings). |
+
+## Resources
+
+| URI | Description |
+|-----|-------------|
+| `timepicker-ui://reference` | Grouped-options summary. |
+| `timepicker-ui://css-variables` | Every `--tp-` variable and its default. |
+| `timepicker-ui://custom-theme-guide` | How to author a custom theme. |
+| `timepicker-ui://troubleshooting` | Common symptoms, causes and fixes. |
+
+## Prompts
+
+| Prompt | Argument | Purpose |
+|--------|----------|---------|
+| `integrate` | `framework` | Walk through a framework integration. |
+| `build-custom-theme` | `description` | Turn a palette into a theme. |
+| `migrate-v3-to-v4` | `code` | Convert v3 code to v4 grouped options. |
+
+## Build and test
+
+```bash
+cd mcp-server
+npm install
+npm run build      # generate data, compile, copy generated JSON into build/
+npm test           # start the server and check that tools, resources and prompts respond
+npm run inspect    # open the MCP Inspector against the built server
+```
+
+## Where the data comes from
+
+`npm run build` first runs `scripts/generate.mjs`. It reads the library source in `../app` and writes `src/generated/*.json`: options and event payloads from `options.d.ts` and `types.d.ts`, the EventEmitter map, the theme stylesheets and `variables.scss`, and the `tp-ui-` classes from the templates.
+
+The generated JSON is committed, so the server works without the `app/` source next to it. After changing the library, run `npm run build` again to refresh it.
+
+## Adding it to Claude Code
+
+Build it first. No API keys or env vars are needed. `--scope user` makes it available in every project; leave it out to register it for the current project only. Check it with `claude mcp list`, which should show `timepicker-ui  ✓ Connected`.
+
+Point at the built file directly:
+
+```bash
+claude mcp add --scope user timepicker-ui -- node /absolute/path/to/timepicker-ui/mcp-server/build/index.js
+```
+
+Or link the bin once with `npm link` (or `npm install -g .`) and skip the path:
+
+```bash
+npm link
+claude mcp add --scope user timepicker-ui -- timepicker-ui-mcp
+```
+
+The package isn't on npm yet. Once it is, this will work without cloning anything:
+
+```bash
+claude mcp add --scope user timepicker-ui -- npx -y timepicker-ui-mcp
+```
+
+If you work in this repo, you can also add a project `.mcp.json` (after `npm install && npm run build` in `mcp-server/`):
+
+```json
+{
+  "mcpServers": {
+    "timepicker-ui": {
+      "command": "node",
+      "args": ["mcp-server/build/index.js"]
+    }
+  }
+}
+```
+
+## Adding it to Claude Desktop
+
+Edit `claude_desktop_config.json`. It's in `%APPDATA%\Claude\` on Windows and `~/Library/Application Support/Claude/` on macOS.
+
+```json
+{
+  "mcpServers": {
+    "timepicker-ui": {
+      "command": "node",
+      "args": ["/absolute/path/to/timepicker-ui/mcp-server/build/index.js"]
+    }
+  }
+}
+```
+
+Restart Claude Desktop after saving.

package/build/content.js

@@ -0,0 +1,281 @@
+export const FRAMEWORK_NAMES = ['vanilla', 'react', 'next', 'vue', 'angular', 'svelte'];
+export const FRAMEWORK_RECIPES = {
+    vanilla: {
+        title: 'Vanilla JS / TS',
+        notes: [
+            'Call create() once the input exists in the DOM.',
+            'Call destroy() when you remove the input to release listeners and the modal.',
+        ],
+        code: [
+            "import { TimepickerUI } from 'timepicker-ui';",
+            "import 'timepicker-ui/main.css';",
+            '',
+            "const input = document.querySelector('#time');",
+            'const picker = new TimepickerUI(input, { clock: { type: \'24h\' } });',
+            'picker.create();',
+        ].join('\n'),
+    },
+    react: {
+        title: 'React',
+        notes: [
+            'Construct in an effect after mount; destroy in the cleanup. Never construct during render.',
+            'Empty dependency array so it initializes once. Read values via picker.getValue() or the events.',
+            'There is also an official wrapper: the `timepicker-ui-react` package.',
+        ],
+        code: [
+            "import { useEffect, useRef } from 'react';",
+            "import { TimepickerUI } from 'timepicker-ui';",
+            "import 'timepicker-ui/main.css';",
+            '',
+            'export function TimePicker() {',
+            '  const ref = useRef<HTMLInputElement>(null);',
+            '  useEffect(() => {',
+            '    if (!ref.current) return;',
+            '    const picker = new TimepickerUI(ref.current, { clock: { type: \'24h\' } });',
+            '    picker.create();',
+            "    picker.on('confirm', (d) => console.log(d.hour, d.minutes));",
+            '    return () => picker.destroy();',
+            '  }, []);',
+            '  return <input ref={ref} />;',
+            '}',
+        ].join('\n'),
+    },
+    next: {
+        title: 'Next.js (App Router)',
+        notes: [
+            'The component must be a Client Component — add "use client" at the top.',
+            'timepicker-ui touches the DOM, so keep all usage inside useEffect (runs only in the browser). The library is SSR-safe (no DOM access at import time), but you still must not call create() on the server.',
+            'If you ever see hydration/DOM errors, dynamic-import the picker component with { ssr: false }.',
+        ],
+        code: [
+            "'use client';",
+            "import { useEffect, useRef } from 'react';",
+            "import { TimepickerUI } from 'timepicker-ui';",
+            "import 'timepicker-ui/main.css';",
+            '',
+            'export function TimePicker() {',
+            '  const ref = useRef<HTMLInputElement>(null);',
+            '  useEffect(() => {',
+            '    if (!ref.current) return;',
+            '    const picker = new TimepickerUI(ref.current);',
+            '    picker.create();',
+            '    return () => picker.destroy();',
+            '  }, []);',
+            '  return <input ref={ref} />;',
+            '}',
+        ].join('\n'),
+    },
+    vue: {
+        title: 'Vue 3',
+        notes: [
+            'Create in onMounted, destroy in onBeforeUnmount.',
+            'Use a template ref to the input element.',
+        ],
+        code: [
+            '<script setup lang="ts">',
+            "import { ref, onMounted, onBeforeUnmount } from 'vue';",
+            "import { TimepickerUI } from 'timepicker-ui';",
+            "import 'timepicker-ui/main.css';",
+            '',
+            'const el = ref<HTMLInputElement | null>(null);',
+            'let picker: TimepickerUI | null = null;',
+            'onMounted(() => {',
+            '  if (!el.value) return;',
+            '  picker = new TimepickerUI(el.value, { clock: { type: \'24h\' } });',
+            '  picker.create();',
+            '});',
+            'onBeforeUnmount(() => picker?.destroy());',
+            '</script>',
+            '',
+            '<template>',
+            '  <input ref="el" />',
+            '</template>',
+        ].join('\n'),
+    },
+    angular: {
+        title: 'Angular',
+        notes: [
+            'Create in ngAfterViewInit (the view/input exists), destroy in ngOnDestroy.',
+            'Add timepicker-ui/main.css to angular.json styles or import it in styles.css.',
+            'Use ViewChild + ElementRef to reach the input.',
+        ],
+        code: [
+            "import { AfterViewInit, Component, ElementRef, OnDestroy, ViewChild } from '@angular/core';",
+            "import { TimepickerUI } from 'timepicker-ui';",
+            '',
+            '@Component({',
+            "  selector: 'app-time',",
+            "  template: '<input #time />',",
+            '})',
+            'export class TimeComponent implements AfterViewInit, OnDestroy {',
+            "  @ViewChild('time') input!: ElementRef<HTMLInputElement>;",
+            '  private picker?: TimepickerUI;',
+            '  ngAfterViewInit() {',
+            '    this.picker = new TimepickerUI(this.input.nativeElement, { clock: { type: \'24h\' } });',
+            '    this.picker.create();',
+            '  }',
+            '  ngOnDestroy() {',
+            '    this.picker?.destroy();',
+            '  }',
+            '}',
+        ].join('\n'),
+    },
+    svelte: {
+        title: 'Svelte',
+        notes: [
+            'Bind the input, create in onMount, destroy in the returned cleanup.',
+        ],
+        code: [
+            '<script lang="ts">',
+            "  import { onMount } from 'svelte';",
+            "  import { TimepickerUI } from 'timepicker-ui';",
+            "  import 'timepicker-ui/main.css';",
+            '',
+            '  let input: HTMLInputElement;',
+            '  onMount(() => {',
+            '    const picker = new TimepickerUI(input, { clock: { type: \'24h\' } });',
+            '    picker.create();',
+            '    return () => picker.destroy();',
+            '  });',
+            '</script>',
+            '',
+            '<input bind:this={input} />',
+        ].join('\n'),
+    },
+};
+export const MIGRATION_V3_TO_V4 = {
+    summary: [
+        'v4 replaced the flat options object (40+ fields) with grouped options. There is NO backward-compatibility layer — all v3 code must be updated.',
+        'Event handling also moved to the EventEmitter API (picker.on(event, handler)) and the grouped callbacks.* options.',
+    ],
+    mappings: [
+        {
+            group: 'clock',
+            rows: [
+                { from: 'clockType', to: 'clock.type' },
+                { from: 'incrementHours', to: 'clock.incrementHours' },
+                { from: 'incrementMinutes', to: 'clock.incrementMinutes' },
+                { from: 'autoSwitchToMinutes', to: 'clock.autoSwitchToMinutes' },
+                { from: 'disabledTime', to: 'clock.disabledTime' },
+                { from: 'currentTime', to: 'clock.defaultTime' },
+            ],
+        },
+        {
+            group: 'ui',
+            rows: [
+                { from: 'theme', to: 'ui.theme' },
+                { from: 'animation', to: 'ui.animation' },
+                { from: 'backdrop', to: 'ui.backdrop' },
+                { from: 'mobile', to: 'ui.initialView' },
+                { from: 'enableSwitchIcon', to: 'ui.viewSwitch' },
+                { from: 'editable', to: 'ui.editable' },
+                { from: 'enableScrollbar', to: 'ui.allowPageScroll' },
+                { from: 'cssClass', to: 'ui.cssClass' },
+                { from: 'appendModalSelector', to: 'ui.appendTo' },
+                { from: 'iconTemplate', to: 'ui.keyboardIcon' },
+                { from: 'iconTemplateMobile', to: 'ui.clockIcon' },
+                { from: 'inline', to: 'ui.inline' },
+            ],
+        },
+        {
+            group: 'labels',
+            rows: [
+                { from: 'amLabel', to: 'labels.am' },
+                { from: 'pmLabel', to: 'labels.pm' },
+                { from: 'okLabel', to: 'labels.ok' },
+                { from: 'cancelLabel', to: 'labels.cancel' },
+                { from: 'timeLabel', to: 'labels.clockTitle' },
+                { from: 'mobileTimeLabel', to: 'labels.keyboardTitle' },
+                { from: 'hourMobileLabel', to: 'labels.hour' },
+                { from: 'minuteMobileLabel', to: 'labels.minute' },
+            ],
+        },
+        {
+            group: 'behavior',
+            rows: [
+                { from: 'focusInputAfterCloseModal', to: 'behavior.returnFocus' },
+                { from: 'focusTrap', to: 'behavior.focusTrap' },
+                { from: 'delayHandler', to: 'behavior.delayHandler' },
+                { from: 'id', to: 'behavior.id' },
+            ],
+        },
+        {
+            group: 'callbacks',
+            rows: [
+                { from: 'onOpen', to: 'callbacks.onOpen' },
+                { from: 'onCancel', to: 'callbacks.onCancel' },
+                { from: 'onConfirm', to: 'callbacks.onConfirm' },
+                { from: 'onUpdate', to: 'callbacks.onUpdate' },
+                { from: 'onSelectHour', to: 'callbacks.onSelectHour' },
+                { from: 'onSelectMinute', to: 'callbacks.onSelectMinute' },
+                { from: 'onSelectAM', to: 'callbacks.onSelectAM' },
+                { from: 'onSelectPM', to: 'callbacks.onSelectPM' },
+                { from: 'onError', to: 'callbacks.onError' },
+            ],
+        },
+    ],
+    notes: [
+        'Reading options also changed: options.clockType -> options.clock.type, options.amLabel -> options.labels.am.',
+        'setOptions() takes grouped options too: setOptions({ clock: { type: "24h" } }).',
+        'Some values changed shape: mobile: true becomes ui.initialView: "keyboard", currentTime: true becomes clock.defaultTime: "now".',
+        'CSS class names were renamed in v4 (tp-ui- prefix). Re-check any custom CSS selectors.',
+    ],
+};
+export const MIGRATION_V43_TO_V44 = [
+    'Non-breaking. Adds the blueprint and blueprint-dark themes.',
+    'Adds 16 localizable accessibility labels under labels.* (e.g. hourLabel, minuteLabel, announceHour).',
+    'Adds Home/End/PageUp/PageDown keyboard navigation. No migration needed.',
+];
+export const MIGRATION_V44_TO_V45 = [
+    'Non-breaking. With clock.showSeconds off (the default) values, getValue() and event payloads are the same as in 4.4.',
+    'Optional seconds: clock.showSeconds, clock.incrementSeconds (1, 5, 10, 15, 20 or 30), clock.autoSwitchToSeconds and clock.disabledTime.seconds. Values become HH:MM:SS or HH:MM:SS AM/PM.',
+    'New label labels.second; new event select:second and callbacks.onSelectSecond; seconds on open, confirm and update; durationSeconds on range:confirm and range:validation.',
+    'Range edges in clock.disabledTime.ranges may carry seconds. An edge without seconds covers its whole minute, so 4.4 ranges disable the same minutes.',
+    'setOptions() (and update()) with an invalid disabledTime reports it through the error event and keeps the previous options instead of throwing.',
+    'behavior.returnFocus (formerly focusInputAfterClose) still defaults to false; 5.0 makes true the default, so set it to true now.',
+    'Renamed options; the old names still work and are removed in 5.0: ui.mobile -> ui.initialView, ui.enableSwitchIcon -> ui.viewSwitch, ui.enableScrollbar -> ui.allowPageScroll, ui.appendModalSelector -> ui.appendTo, ui.iconTemplate / iconTemplateMobile -> ui.keyboardIcon / clockIcon, ui.inline.containerId -> ui.inline.container, clock.currentTime -> clock.defaultTime, clock.smoothHourSnap -> clock.discreteHourJump (inverted), clock.disabledTime.interval -> ranges, behavior.focusInputAfterClose -> returnFocus, timezone.whitelist -> list, clearBehavior.clearInput -> ui.clearButton: { clearInput }. Labels: one key per unit (labels.hour, labels.minute, labels.second), labels.clockTitle / keyboardTitle, labels.clock / period / timeFields / range / switchToKeyboard / switchToClock, and range.fromLabel / toLabel / timezone.label move to labels.rangeFrom / rangeTo / timezone.',
+    'New: setOptions(), select:period with onSelectPeriod, switch:face with onSwitchFace, clock.type: "auto" (12h or 24h from the browser locale); ui.appendTo and ui.inline.container also accept an element.',
+    'The focus ring is a single 3px ring in --tp-focus-ring; --tp-focus-ring-halo was removed.',
+    'Deprecated (removed in 5.0): OptionTypes (use TimepickerOptions), labels.timezoneSelectorLabel, labels.format24Label, labels.toggleLabel, clock.currentTime.locales, getValue().degreesHours / degreesMinutes, the hide event, update() (use setOptions()), select:am / select:pm with onSelectAM / onSelectPM (use select:period / onSelectPeriod) and the renamed option names.',
+];
+export const TROUBLESHOOTING = [
+    {
+        symptom: 'Picker opens but is completely unstyled.',
+        cause: "The core stylesheet was not imported.",
+        fix: "Always import 'timepicker-ui/main.css'. For a non-basic theme also import 'timepicker-ui/theme-<name>.css'.",
+    },
+    {
+        symptom: "An 'error' event fires / a feature option is ignored.",
+        cause: 'A plugin (range, timezone, wheel) was used without being registered.',
+        fix: "Import the plugin and call PluginRegistry.register(Plugin) once at startup before creating the picker.",
+    },
+    {
+        symptom: 'Wheel / compact-wheel mode renders as a normal clock.',
+        cause: 'The wheel plugin is required for those modes.',
+        fix: "Register WheelPlugin from 'timepicker-ui/plugins/wheel' and set ui.mode to 'wheel' or 'compact-wheel'.",
+    },
+    {
+        symptom: 'Modal appears in the wrong place or behind other UI.',
+        cause: 'It is appended to <body> by default.',
+        fix: "Set ui.appendTo to a container selector or element, or check stacking context / z-index of ancestors.",
+    },
+    {
+        symptom: 'Setting ui.theme to a custom name does nothing.',
+        cause: 'The theme CSS was not loaded, or the data-theme name does not match.',
+        fix: "Author [data-theme='name'] { --tp-*: ... }, import it after main.css, and pass ui.theme = 'name'.",
+    },
+    {
+        symptom: 'Listeners or modal linger after the input is removed (e.g. SPA route change).',
+        cause: 'The instance was not destroyed.',
+        fix: 'Call picker.destroy() in your framework cleanup hook (useEffect cleanup, onBeforeUnmount, ngOnDestroy).',
+    },
+    {
+        symptom: 'TypeScript complains about a custom theme name.',
+        cause: 'ui.theme is a union of built-in theme names.',
+        fix: "Cast the custom name: ui: { theme: 'ocean' as any }.",
+    },
+];
+export const IO_CONTRACT = {
+    getValue: 'getValue() returns { hour: string; minutes: string; type?: string; time: string; degreesHours: number | null; degreesMinutes: number | null }.',
+    setValue: 'setValue(time, updateInput?) accepts "HH:MM" (24h) or "h:MM AM/PM" (12h), e.g. "14:30" or "2:30 PM". updateInput defaults to writing the input value.',
+};

package/build/data.js

@@ -0,0 +1,81 @@
+export const PACKAGE_VERSION = '4.5';
+export const THEMES = [
+    { name: 'basic', cssImport: 'timepicker-ui/main.css', note: 'default theme, bundled in main.css' },
+    { name: 'ai', cssImport: 'timepicker-ui/theme-ai.css' },
+    { name: 'blueprint', cssImport: 'timepicker-ui/theme-blueprint.css', note: 'added in v4.4' },
+    { name: 'blueprint-dark', cssImport: 'timepicker-ui/theme-blueprint-dark.css', note: 'added in v4.4' },
+    { name: 'crane', cssImport: 'timepicker-ui/theme-crane.css' },
+    { name: 'crane-straight', cssImport: 'timepicker-ui/theme-crane-straight.css' },
+    { name: 'cyberpunk', cssImport: 'timepicker-ui/theme-cyberpunk.css' },
+    { name: 'dark', cssImport: 'timepicker-ui/theme-dark.css' },
+    { name: 'glassmorphic', cssImport: 'timepicker-ui/theme-glassmorphic.css' },
+    { name: 'm2', cssImport: 'timepicker-ui/theme-m2.css' },
+    { name: 'm3-green', cssImport: 'timepicker-ui/theme-m3-green.css' },
+    { name: 'pastel', cssImport: 'timepicker-ui/theme-pastel.css' },
+];
+export const THEME_NAMES = THEMES.map((t) => t.name);
+export const MODES = [
+    { name: 'clock', description: 'Analog clock face with draggable hands (default).' },
+    {
+        name: 'wheel',
+        description: 'Scrollable wheel picker for hours/minutes.',
+        requiresPlugin: 'wheel',
+    },
+    {
+        name: 'compact-wheel',
+        description: 'Condensed inline wheel variant.',
+        requiresPlugin: 'wheel',
+    },
+];
+export const MODE_NAMES = MODES.map((m) => m.name);
+export const PLUGINS = [
+    {
+        name: 'range',
+        export: 'RangePlugin',
+        importPath: 'timepicker-ui/plugins/range',
+        description: 'Start/end time selection with a tab UI.',
+        enableOption: 'range: { enabled: true }',
+    },
+    {
+        name: 'timezone',
+        export: 'TimezonePlugin',
+        importPath: 'timepicker-ui/plugins/timezone',
+        description: 'Timezone dropdown with keyboard navigation.',
+        enableOption: "timezone: { enabled: true, default: 'Europe/Warsaw' }",
+    },
+    {
+        name: 'wheel',
+        export: 'WheelPlugin',
+        importPath: 'timepicker-ui/plugins/wheel',
+        description: 'Enables the wheel / compact-wheel UI modes, drag and momentum.',
+        enableOption: "ui: { mode: 'wheel' }",
+    },
+];
+export const PLUGIN_NAMES = PLUGINS.map((p) => p.name);
+export const API_METHODS = [
+    { signature: 'new TimepickerUI(selectorOrElement, options?)', description: 'Construct an instance.' },
+    { signature: 'create()', description: 'Initialize and render the picker.' },
+    { signature: 'open(callback?)', description: 'Open the modal.' },
+    { signature: 'close(update?, callback?)', description: 'Close the modal.' },
+    {
+        signature: 'destroy(options?)',
+        description: 'Clean up DOM and listeners. options: { keepInputValue?, callback? }.',
+    },
+    {
+        signature: 'getValue()',
+        description: 'Returns { hour, minutes, type?, time, degreesHours, degreesMinutes }.',
+    },
+    { signature: 'setValue(time, updateInput?)', description: 'Set time, e.g. "14:30" or "2:30 PM".' },
+    { signature: 'setOptions(options)', description: 'Change options at runtime; groups you leave out keep their values.' },
+    {
+        signature: 'update({ options, create? }, callback?)',
+        description: 'Deprecated, use setOptions(). Removed in 5.0.',
+    },
+    { signature: 'on(event, handler)', description: 'Subscribe to an event.' },
+    { signature: 'once(event, handler)', description: 'Subscribe once.' },
+    { signature: 'off(event, handler?)', description: 'Unsubscribe.' },
+    { signature: 'TimepickerUI.getById(id)', description: 'Get an instance by custom behavior.id.', static: true },
+    { signature: 'TimepickerUI.getAllInstances()', description: 'All live instances.', static: true },
+    { signature: 'TimepickerUI.isAvailable(selector)', description: 'Check the element exists.', static: true },
+    { signature: 'TimepickerUI.destroyAll()', description: 'Destroy every instance.', static: true },
+];

package/build/generated/css-classes.json

@@ -0,0 +1,67 @@
+[
+  "tp-ui-am",
+  "tp-ui-body",
+  "tp-ui-cancel-btn",
+  "tp-ui-circle-hand",
+  "tp-ui-clear-btn",
+  "tp-ui-clock-face",
+  "tp-ui-clock-hand",
+  "tp-ui-compact-wheel-mode",
+  "tp-ui-dot",
+  "tp-ui-dots",
+  "tp-ui-footer",
+  "tp-ui-has-seconds",
+  "tp-ui-header",
+  "tp-ui-hour",
+  "tp-ui-hour-text",
+  "tp-ui-input-ripple-wrapper",
+  "tp-ui-input-wrapper",
+  "tp-ui-keyboard-icon",
+  "tp-ui-keyboard-icon-wrapper",
+  "tp-ui-label-",
+  "tp-ui-minute-text",
+  "tp-ui-minutes",
+  "tp-ui-mobile-clock-wrapper",
+  "tp-ui-modal",
+  "tp-ui-ok-btn",
+  "tp-ui-pm",
+  "tp-ui-range-from",
+  "tp-ui-range-from-time",
+  "tp-ui-range-header",
+  "tp-ui-range-mode",
+  "tp-ui-range-tab",
+  "tp-ui-range-tab-label",
+  "tp-ui-range-tab-value",
+  "tp-ui-range-to",
+  "tp-ui-range-to-time",
+  "tp-ui-second-text",
+  "tp-ui-seconds",
+  "tp-ui-select-time",
+  "tp-ui-timezone",
+  "tp-ui-timezone-arrow",
+  "tp-ui-timezone-dropdown",
+  "tp-ui-timezone-label",
+  "tp-ui-timezone-menu",
+  "tp-ui-timezone-selected",
+  "tp-ui-tips-wrapper",
+  "tp-ui-tips-wrapper-24h",
+  "tp-ui-type-mode",
+  "tp-ui-tz-mode",
+  "tp-ui-wheel-ampm",
+  "tp-ui-wheel-column",
+  "tp-ui-wheel-column-wrapper",
+  "tp-ui-wheel-container",
+  "tp-ui-wheel-highlight",
+  "tp-ui-wheel-hours",
+  "tp-ui-wheel-item",
+  "tp-ui-wheel-minutes",
+  "tp-ui-wheel-mode",
+  "tp-ui-wheel-padding",
+  "tp-ui-wheel-seconds",
+  "tp-ui-wheel-separator",
+  "tp-ui-wrapper",
+  "tp-ui-wrapper-btn",
+  "tp-ui-wrapper-time",
+  "tp-ui-wrapper-time-24h",
+  "tp-ui-wrapper-type-time"
+]