@kubex/zinc 1.1.158 → 1.1.160

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2933,7 +2933,7 @@
2933
2933
  },
2934
2934
  {
2935
2935
  "name": "zn-page",
2936
- "description": "Combines a page header with tab navigation and tab panels.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Methods:**\n \n\n\n### **Slots:**\n - _default_ - Page content. Use zn-tab for named tabs and header-action/header-actions for header actions.\n- **description** - Rich subtitle/description content. Falls back to the `summary` attribute when empty.\n- **bottom** - Content rendered below the navbar row (e.g. chips, filters). Forwarded to the navbar's bottom slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
2936
+ "description": "Combines a page header with tab navigation and tab panels.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Methods:**\n \n\n\n### **Slots:**\n - _default_ - Page content. Use zn-tab for named tabs and header-action/header-actions for header actions. Clicking an element in the content with `tab=\"<tab id>\"` opens that tab.\n- **description** - Rich subtitle/description content. Falls back to the `summary` attribute when empty.\n- **bottom** - Content rendered below the navbar row (e.g. chips, filters). Forwarded to the navbar's bottom slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
2937
2937
  "attributes": [
2938
2938
  { "name": "caption", "values": [] },
2939
2939
  { "name": "entity-id", "values": [] },
@@ -3629,43 +3629,23 @@
3629
3629
  ]
3630
3630
  },
3631
3631
  {
3632
- "name": "zn-rating",
3633
- "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Methods:**\n - **checkValidity(): _boolean_** - Checks the validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity()** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n- **help-text** - Text that describes how to use the rating. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n- **--preview-color** - The color of the preview value. _(default: undefined)_\n- **--preview-size** - The font size of the preview value. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the symbols and help text.\n- **form-control-help-text** - The help text's wrapper.\n- **base** - The component's base wrapper.\n- **preview** - The value shown next to the symbols when `preview` is enabled.",
3632
+ "name": "zn-reveal",
3633
+ "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
3634
3634
  "attributes": [
3635
- { "name": "label", "values": [] },
3636
- {
3637
- "name": "help-text",
3638
- "description": "The rating's help text. If you need to display HTML, use the `help-text` slot instead.",
3639
- "values": []
3640
- },
3641
- { "name": "name", "values": [] },
3642
- { "name": "value", "values": [] },
3643
- { "name": "max", "values": [] },
3644
- { "name": "precision", "values": [] },
3645
- { "name": "readonly", "values": [] },
3646
- { "name": "disabled", "values": [] },
3635
+ { "name": "duration", "values": [] },
3636
+ { "name": "initial", "values": [] },
3637
+ { "name": "revealed", "values": [] },
3638
+ { "name": "hide-delay", "values": [] },
3647
3639
  {
3648
- "name": "preview",
3649
- "description": "Displays the value alongside the symbols, updating live as the pointer moves across them.",
3640
+ "name": "no-toggle",
3641
+ "description": "Disables click-to-toggle so the value is only revealed on hover. Clicks still bubble to the parent.",
3650
3642
  "values": []
3651
- },
3652
- {
3653
- "name": "size",
3654
- "values": [
3655
- { "name": "small" },
3656
- { "name": "medium" },
3657
- { "name": "large" }
3658
- ]
3659
- },
3660
- {
3661
- "name": "getSymbol",
3662
- "values": [{ "name": "(value: number) => string" }]
3663
3643
  }
3664
3644
  ],
3665
3645
  "references": [
3666
3646
  {
3667
3647
  "name": "Documentation",
3668
- "url": "https://zinc.style/components/rating"
3648
+ "url": "https://zinc.style/components/reveal"
3669
3649
  }
3670
3650
  ]
3671
3651
  },
@@ -3737,23 +3717,43 @@
3737
3717
  ]
3738
3718
  },
3739
3719
  {
3740
- "name": "zn-reveal",
3741
- "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
3720
+ "name": "zn-rating",
3721
+ "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Methods:**\n - **checkValidity(): _boolean_** - Checks the validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity()** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n- **help-text** - Text that describes how to use the rating. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n- **--preview-color** - The color of the preview value. _(default: undefined)_\n- **--preview-size** - The font size of the preview value. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the symbols and help text.\n- **form-control-help-text** - The help text's wrapper.\n- **base** - The component's base wrapper.\n- **preview** - The value shown next to the symbols when `preview` is enabled.",
3742
3722
  "attributes": [
3743
- { "name": "duration", "values": [] },
3744
- { "name": "initial", "values": [] },
3745
- { "name": "revealed", "values": [] },
3746
- { "name": "hide-delay", "values": [] },
3723
+ { "name": "label", "values": [] },
3747
3724
  {
3748
- "name": "no-toggle",
3749
- "description": "Disables click-to-toggle so the value is only revealed on hover. Clicks still bubble to the parent.",
3725
+ "name": "help-text",
3726
+ "description": "The rating's help text. If you need to display HTML, use the `help-text` slot instead.",
3750
3727
  "values": []
3728
+ },
3729
+ { "name": "name", "values": [] },
3730
+ { "name": "value", "values": [] },
3731
+ { "name": "max", "values": [] },
3732
+ { "name": "precision", "values": [] },
3733
+ { "name": "readonly", "values": [] },
3734
+ { "name": "disabled", "values": [] },
3735
+ {
3736
+ "name": "preview",
3737
+ "description": "Displays the value alongside the symbols, updating live as the pointer moves across them.",
3738
+ "values": []
3739
+ },
3740
+ {
3741
+ "name": "size",
3742
+ "values": [
3743
+ { "name": "small" },
3744
+ { "name": "medium" },
3745
+ { "name": "large" }
3746
+ ]
3747
+ },
3748
+ {
3749
+ "name": "getSymbol",
3750
+ "values": [{ "name": "(value: number) => string" }]
3751
3751
  }
3752
3752
  ],
3753
3753
  "references": [
3754
3754
  {
3755
3755
  "name": "Documentation",
3756
- "url": "https://zinc.style/components/reveal"
3756
+ "url": "https://zinc.style/components/rating"
3757
3757
  }
3758
3758
  ]
3759
3759
  },
@@ -4921,6 +4921,52 @@
4921
4921
  }
4922
4922
  ]
4923
4923
  },
4924
+ {
4925
+ "name": "zn-tile",
4926
+ "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
4927
+ "attributes": [
4928
+ { "name": "caption", "values": [] },
4929
+ { "name": "description", "values": [] },
4930
+ { "name": "href", "values": [] },
4931
+ { "name": "data-target", "values": [] },
4932
+ { "name": "gaid", "values": [] },
4933
+ { "name": "data-uri", "values": [] },
4934
+ { "name": "flush", "values": [] },
4935
+ { "name": "flush-x", "values": [] },
4936
+ { "name": "flush-y", "values": [] },
4937
+ { "name": "inline", "values": [] },
4938
+ {
4939
+ "name": "plain",
4940
+ "description": "Renders the caption in the normal table-content weight instead of bold.",
4941
+ "values": []
4942
+ },
4943
+ {
4944
+ "name": "grouped",
4945
+ "description": "Set by `zn-tile-group` to lay the tile out as a shared-column subgrid row.",
4946
+ "values": []
4947
+ }
4948
+ ],
4949
+ "references": [
4950
+ { "name": "Documentation", "url": "https://zinc.style/components/tile" }
4951
+ ]
4952
+ },
4953
+ {
4954
+ "name": "zn-tile-group",
4955
+ "description": "Aligns a list of `zn-tile` rows into shared, content-driven columns so values\nand actions line up across every row, with optional dividing borders.\n---\n\n\n### **Slots:**\n - _default_ - One or more `zn-tile` elements.\n\n### **CSS Properties:**\n - **--zn-tile-cols** - The number of value/action columns (set automatically). _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper (the grid container).",
4956
+ "attributes": [
4957
+ {
4958
+ "name": "divide",
4959
+ "description": "Draws a dividing border between rows.",
4960
+ "values": []
4961
+ }
4962
+ ],
4963
+ "references": [
4964
+ {
4965
+ "name": "Documentation",
4966
+ "url": "https://zinc.style/components/tile-group"
4967
+ }
4968
+ ]
4969
+ },
4924
4970
  {
4925
4971
  "name": "zn-thumbnail",
4926
4972
  "description": "A captioned image tile — a fixed aspect-ratio preview with a title beneath it, optional\ncorner badges and actions, and an optional full-screen preview that grows out of the thumbnail.\n---\n\n\n### **Events:**\n - **zn-select** - Emitted when an enabled thumbnail is activated by click or keyboard. Cancelable — call `preventDefault()` to stop the preview from opening and to stop a parent `zn-thumbnail-group` from changing its selection.\n- **zn-show** - Emitted when the preview overlay starts opening.\n- **zn-close** - Emitted once the preview overlay has finished closing.\n\n### **Methods:**\n - **showPreview()** - Opens the preview overlay.\n- **hidePreview()** - Closes the preview overlay.\n\n### **Slots:**\n - _default_ - Fallback content rendered in place of the media when no `src` is set.\n- **image** - Replaces the built-in `<img>` (e.g. a video, canvas or `zn-icon`).\n- **caption** - Replaces the caption text.\n- **badge** - Content pinned to the bottom-left of the media (e.g. a play indicator). Badges take no pointer events and are held back on opacity, so they read as information about the asset rather than as something to click.\n- **actions** - Controls pinned to the bottom-right of the media (e.g. a download button). Each slotted element becomes its own chip, so several actions read as separate icons on the thumbnail rather than one grouped pill. This sits outside the thumbnail's link, so buttons and links here behave normally and never select the thumbnail or follow its `href`.\n- **preview** - Replaces the preview media (e.g. a `<video>` for the full-size asset).\n\n### **CSS Properties:**\n - **--zn-thumbnail-aspect-ratio** - Aspect ratio of the media frame. Defaults to 16 / 9. The `aspect-ratio` attribute sets this on the thumbnail itself; set the property on any ancestor (including a `zn-thumbnail-group`) to apply it to every thumbnail beneath it. _(default: undefined)_\n- **--zn-thumbnail-radius** - Corner radius of the media frame. _(default: undefined)_\n- **--zn-thumbnail-preview-aspect-ratio** - Overrides the measured aspect ratio of the preview panel. By default the panel takes the asset's own ratio so it wraps the image exactly. _(default: undefined)_\n- **--zn-thumbnail-preview-max-width** - Largest width the preview may take. Defaults to 70vw. _(default: undefined)_\n- **--zn-thumbnail-preview-max-height** - Largest height the preview may take. Defaults to 70vh. _(default: undefined)_\n- **--zn-thumbnail-preview-radius** - Corner radius of the preview panel. _(default: undefined)_\n- **--zn-thumbnail-chip-radius** - Corner radius of a badge, action or preview chip. _(default: undefined)_\n- **--zn-thumbnail-chip-background** - Background of a badge, action or preview chip. _(default: undefined)_\n- **--zn-thumbnail-chip-background-hover** - Hover background of an action or preview chip. _(default: undefined)_\n- **--zn-thumbnail-chip-color** - Foreground colour of a badge, action or preview chip. _(default: undefined)_\n- **--zn-thumbnail-chip-gap** - Gap between adjacent chips. _(default: undefined)_\n- **--zn-thumbnail-badge-opacity** - Opacity of a badge, holding it back from the action chips beside it. Defaults to 0.65. _(default: undefined)_\n- **--zn-thumbnail-selected-color** - Ring colour for the selected state. _(default: undefined)_\n- **--zn-thumbnail-active-color** - Ring colour for the active state. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **link** - The anchor (or div) covering the media and caption.\n- **media** - The fixed aspect-ratio media frame.\n- **image** - The built-in image element.\n- **overlay** - The layer holding the badge, actions and preview button.\n- **badge** - The bottom-left badge container.\n- **actions** - The bottom-right actions container.\n- **preview-button** - The built-in preview trigger, when `preview-trigger=\"button\"`.\n- **caption** - The caption beneath the media.\n- **preview** - The preview `<dialog>`.\n- **preview-backdrop** - The full-screen backdrop behind the preview.\n- **preview-frame** - The rounded panel the preview media sits in.\n- **preview-image** - The full-size image inside the preview.\n- **preview-close** - The preview's close button.",
@@ -5085,52 +5131,6 @@
5085
5131
  }
5086
5132
  ]
5087
5133
  },
5088
- {
5089
- "name": "zn-tile",
5090
- "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
5091
- "attributes": [
5092
- { "name": "caption", "values": [] },
5093
- { "name": "description", "values": [] },
5094
- { "name": "href", "values": [] },
5095
- { "name": "data-target", "values": [] },
5096
- { "name": "gaid", "values": [] },
5097
- { "name": "data-uri", "values": [] },
5098
- { "name": "flush", "values": [] },
5099
- { "name": "flush-x", "values": [] },
5100
- { "name": "flush-y", "values": [] },
5101
- { "name": "inline", "values": [] },
5102
- {
5103
- "name": "plain",
5104
- "description": "Renders the caption in the normal table-content weight instead of bold.",
5105
- "values": []
5106
- },
5107
- {
5108
- "name": "grouped",
5109
- "description": "Set by `zn-tile-group` to lay the tile out as a shared-column subgrid row.",
5110
- "values": []
5111
- }
5112
- ],
5113
- "references": [
5114
- { "name": "Documentation", "url": "https://zinc.style/components/tile" }
5115
- ]
5116
- },
5117
- {
5118
- "name": "zn-tile-group",
5119
- "description": "Aligns a list of `zn-tile` rows into shared, content-driven columns so values\nand actions line up across every row, with optional dividing borders.\n---\n\n\n### **Slots:**\n - _default_ - One or more `zn-tile` elements.\n\n### **CSS Properties:**\n - **--zn-tile-cols** - The number of value/action columns (set automatically). _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper (the grid container).",
5120
- "attributes": [
5121
- {
5122
- "name": "divide",
5123
- "description": "Draws a dividing border between rows.",
5124
- "values": []
5125
- }
5126
- ],
5127
- "references": [
5128
- {
5129
- "name": "Documentation",
5130
- "url": "https://zinc.style/components/tile-group"
5131
- }
5132
- ]
5133
- },
5134
5134
  {
5135
5135
  "name": "zn-tile-property",
5136
5136
  "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",