@kubex/zinc 1.1.120 → 1.1.121

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.
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
3
3
  "name": "@kubex/zinc",
4
- "version": "1.1.120",
4
+ "version": "1.1.121",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
@@ -15,6 +15,28 @@
15
15
  "events": [],
16
16
  "js": { "properties": [], "events": [] }
17
17
  },
18
+ {
19
+ "name": "zn-action-bar",
20
+ "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.",
21
+ "doc-url": "",
22
+ "attributes": [],
23
+ "slots": [
24
+ { "name": "", "description": "The default slot." },
25
+ { "name": "example", "description": "An example slot." }
26
+ ],
27
+ "events": [
28
+ { "name": "zn-event-name", "description": "Emitted as an example." }
29
+ ],
30
+ "js": {
31
+ "properties": [],
32
+ "events": [
33
+ {
34
+ "name": "zn-event-name",
35
+ "description": "Emitted as an example."
36
+ }
37
+ ]
38
+ }
39
+ },
18
40
  {
19
41
  "name": "zn-alert",
20
42
  "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.",
@@ -83,28 +105,6 @@
83
105
  ]
84
106
  }
85
107
  },
86
- {
87
- "name": "zn-action-bar",
88
- "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.",
89
- "doc-url": "",
90
- "attributes": [],
91
- "slots": [
92
- { "name": "", "description": "The default slot." },
93
- { "name": "example", "description": "An example slot." }
94
- ],
95
- "events": [
96
- { "name": "zn-event-name", "description": "Emitted as an example." }
97
- ],
98
- "js": {
99
- "properties": [],
100
- "events": [
101
- {
102
- "name": "zn-event-name",
103
- "description": "Emitted as an example."
104
- }
105
- ]
106
- }
107
- },
108
108
  {
109
109
  "name": "zn-animated-button",
110
110
  "description": "\n---\n\n\n### **Methods:**\n - **purchase(): _void_** - Programmatically trigger the purchase flow\n- **setSuccess(): _void_** - Set the button to success state manually\n- **setFailure(message): _void_** - Set the button to failure state manually with optional error message\n- **reset(): _void_** - Reset the button to idle state",
@@ -3666,130 +3666,6 @@
3666
3666
  ]
3667
3667
  }
3668
3668
  },
3669
- {
3670
- "name": "zn-editor",
3671
- "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.",
3672
- "doc-url": "",
3673
- "attributes": [
3674
- { "name": "id", "value": { "type": "string" } },
3675
- { "name": "name", "value": { "type": "string" } },
3676
- { "name": "value", "value": { "type": "string" } },
3677
- {
3678
- "name": "interaction-type",
3679
- "value": { "type": "'ticket' | 'chat'", "default": "'chat'" }
3680
- },
3681
- { "name": "attachment-url", "value": { "type": "string" } },
3682
- {
3683
- "name": "code-blocks",
3684
- "value": { "type": "boolean", "default": "false" }
3685
- },
3686
- {
3687
- "name": "dividers",
3688
- "value": { "type": "boolean", "default": "false" }
3689
- },
3690
- {
3691
- "name": "links",
3692
- "value": { "type": "boolean", "default": "false" }
3693
- },
3694
- {
3695
- "name": "attachments",
3696
- "value": { "type": "boolean", "default": "false" }
3697
- },
3698
- {
3699
- "name": "images",
3700
- "value": { "type": "boolean", "default": "false" }
3701
- },
3702
- {
3703
- "name": "videos",
3704
- "value": { "type": "boolean", "default": "false" }
3705
- },
3706
- {
3707
- "name": "dates",
3708
- "value": { "type": "boolean", "default": "false" }
3709
- },
3710
- {
3711
- "name": "emojis",
3712
- "value": { "type": "boolean", "default": "false" }
3713
- },
3714
- {
3715
- "name": "code",
3716
- "value": { "type": "boolean", "default": "false" }
3717
- },
3718
- {
3719
- "name": "ai",
3720
- "value": { "type": "boolean", "default": "false" }
3721
- },
3722
- {
3723
- "name": "ai-path",
3724
- "value": { "type": "string", "default": "''" }
3725
- },
3726
- {
3727
- "name": "store-key",
3728
- "description": "Caches unsent content while typing and restores it when the editor next loads,\nso agent replies in tickets/chats survive reloads and navigation. Use a key\nunique to the conversation (e.g. the ticket ID). The cache is cleared on submit.",
3729
- "value": { "type": "string", "default": "\"\"" }
3730
- },
3731
- {
3732
- "name": "store-ttl",
3733
- "description": "Cached-content expiry in seconds. Defaults to 1 day.",
3734
- "value": { "type": "number", "default": "86400" }
3735
- },
3736
- {
3737
- "name": "local-storage",
3738
- "description": "Cache to localStorage instead of sessionStorage, persisting across tabs and browser restarts.",
3739
- "value": { "type": "boolean" }
3740
- }
3741
- ],
3742
- "slots": [
3743
- { "name": "", "description": "The default slot." },
3744
- { "name": "example", "description": "An example slot." }
3745
- ],
3746
- "events": [
3747
- { "name": "zn-event-name", "description": "Emitted as an example." }
3748
- ],
3749
- "js": {
3750
- "properties": [
3751
- { "name": "id", "type": "string" },
3752
- { "name": "name", "type": "string" },
3753
- { "name": "value", "type": "string" },
3754
- { "name": "interactionType", "type": "'ticket' | 'chat'" },
3755
- { "name": "uploadAttachmentUrl", "type": "string" },
3756
- { "name": "codeBlocksEnabled", "type": "boolean" },
3757
- { "name": "dividersEnabled", "type": "boolean" },
3758
- { "name": "linksEnabled", "type": "boolean" },
3759
- { "name": "attachmentsEnabled", "type": "boolean" },
3760
- { "name": "imagesEnabled", "type": "boolean" },
3761
- { "name": "videosEnabled", "type": "boolean" },
3762
- { "name": "datesEnabled", "type": "boolean" },
3763
- { "name": "emojisEnabled", "type": "boolean" },
3764
- { "name": "codeEnabled", "type": "boolean" },
3765
- { "name": "aiEnabled", "type": "boolean" },
3766
- { "name": "aiPath", "type": "string" },
3767
- {
3768
- "name": "storeKey",
3769
- "description": "Caches unsent content while typing and restores it when the editor next loads,\nso agent replies in tickets/chats survive reloads and navigation. Use a key\nunique to the conversation (e.g. the ticket ID). The cache is cleared on submit.",
3770
- "type": "string"
3771
- },
3772
- {
3773
- "name": "storeTtl",
3774
- "description": "Cached-content expiry in seconds. Defaults to 1 day.",
3775
- "type": "number"
3776
- },
3777
- {
3778
- "name": "localStorage",
3779
- "description": "Cache to localStorage instead of sessionStorage, persisting across tabs and browser restarts.",
3780
- "type": "boolean"
3781
- },
3782
- { "name": "validity", "type": "ValidityState" },
3783
- { "name": "validationMessage", "type": "string" }
3784
- ],
3785
- "events": [
3786
- {
3787
- "name": "zn-event-name",
3788
- "description": "Emitted as an example."
3789
- }
3790
- ]
3791
- }
3792
- },
3793
3669
  {
3794
3670
  "name": "zn-empty-state",
3795
3671
  "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.",
@@ -3908,106 +3784,230 @@
3908
3784
  }
3909
3785
  },
3910
3786
  {
3911
- "name": "zn-file",
3912
- "description": "File controls allow selecting an arbitrary number of files for uploading.\n---\n\n\n### **Events:**\n - **zn-blur** - Emitted when the control loses focus.\n- **zn-change** - Emitted when an alteration to the control's value is committed by the user.\n- **zn-clear** - Emitted when the user confirms clearing the selected file or `src`.\n- **zn-error** - Emitted when multiple files are selected via drag and drop, without the `multiple` property being set.\n- **zn-focus** - Emitted when the control gains focus.\n- **zn-input** - Emitted when the control receives input.\n\n### **Methods:**\n - **checkValidity()** - Checks for validity but does not show a validation message.\nReturns `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(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **focus(options: _FocusOptions_)** - Sets focus on the button or droparea.\n- **blur()** - Removes focus from the button or droparea.\n- **clear()** - Programmatically clears the selected file and any external `src` without\nconfirmation. Unlike a user-initiated clear, this does not flag the control\nto submit an empty value.\n\n### **Slots:**\n - **label** - The file control's label. Alternatively, you can use the `label` attribute.\n- **help-text** - Text that describes how to use the file control. Alternatively, you can use the `help-text` attribute.\n- **trigger** - Optional content to be used as trigger instead of the default content. Opening the file dialog on click and as well as drag and drop will work for this content. Following attributes will no longer work: *label*, *droparea*, *help-text*, *size*, *hide-value*. Also if using the disabled attribute, the disabled styling will not be applied and must be taken care of yourself.\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **button-wrapper** - The wrapper around the button and text value.\n- **button** - The zn-button acting as a file input.\n- **button__base** - The zn-button's exported `base` part.\n- **value** - The chosen files or placeholder text for the file input.\n- **droparea** - The element wrapping the drop zone.\n- **droparea-background** - The background of the drop zone.\n- **upload** - The upload button shown in the droparea when no file is selected.\n- **preview** - The image preview rendered in the droparea for previewable files.\n- **filename** - The filename label rendered in the droparea for non-previewable files.\n- **clear** - The clear button rendered in the droparea when a file is present.\n- **clear-confirm** - The confirmation dialog shown before clearing the file.\n- **link** - The current link anchor rendered when `show-link` is enabled.\n- **trigger** - The container that wraps the trigger.",
3787
+ "name": "zn-editor",
3788
+ "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.",
3913
3789
  "doc-url": "",
3914
3790
  "attributes": [
3791
+ { "name": "id", "value": { "type": "string" } },
3792
+ { "name": "name", "value": { "type": "string" } },
3793
+ { "name": "value", "value": { "type": "string" } },
3915
3794
  {
3916
- "name": "files",
3917
- "description": "The selected files as a FileList object containing a list of File objects.\nThe FileList behaves like an array, so you can get the number of selected files\nvia its length property.\n[see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#getting_information_on_selected_files)",
3918
- "value": { "type": "string" }
3919
- },
3920
- {
3921
- "name": "name",
3922
- "description": "The name of the file control, submitted as a name/value pair with form data.",
3923
- "value": { "type": "string", "default": "''" }
3924
- },
3925
- {
3926
- "name": "value",
3927
- "description": "The value of the file control contains a string that represents the path of the selected file.\nIf multiple files are selected, the value represents the first file in the list.\nIf no file is selected, the value is an empty string.\nBeware that the only valid value when setting a file control is an empty string!\n[see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#value)",
3928
- "value": { "type": "string" }
3929
- },
3930
- {
3931
- "name": "size",
3932
- "description": "The file control's size.",
3933
- "value": {
3934
- "type": "'small' | 'medium' | 'large'",
3935
- "default": "'medium'"
3936
- }
3937
- },
3938
- {
3939
- "name": "label",
3940
- "description": "The file control's label. If you need to display HTML, use the `label` slot instead.",
3941
- "value": { "type": "string", "default": "''" }
3795
+ "name": "interaction-type",
3796
+ "value": { "type": "'ticket' | 'chat'", "default": "'chat'" }
3942
3797
  },
3798
+ { "name": "attachment-url", "value": { "type": "string" } },
3943
3799
  {
3944
- "name": "clearable",
3945
- "description": "If this is set, then the only way to remove files is to click the cross next to them.",
3800
+ "name": "code-blocks",
3946
3801
  "value": { "type": "boolean", "default": "false" }
3947
3802
  },
3948
3803
  {
3949
- "name": "help-text",
3950
- "description": "The file control's help text.\nIf you need to display HTML, use the `help-text` slot instead.",
3951
- "value": { "type": "string", "default": "''" }
3952
- },
3953
- {
3954
- "name": "disabled",
3955
- "description": "Disables the file control.",
3804
+ "name": "dividers",
3956
3805
  "value": { "type": "boolean", "default": "false" }
3957
3806
  },
3958
3807
  {
3959
- "name": "droparea",
3960
- "description": "Draw the file control as a drop area",
3808
+ "name": "links",
3961
3809
  "value": { "type": "boolean", "default": "false" }
3962
3810
  },
3963
3811
  {
3964
- "name": "accept",
3965
- "description": "Comma separated list of supported file types\n[see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept)",
3966
- "value": { "type": "string", "default": "''" }
3812
+ "name": "attachments",
3813
+ "value": { "type": "boolean", "default": "false" }
3967
3814
  },
3968
3815
  {
3969
- "name": "capture",
3970
- "description": "Specifies the types of files that the server accepts.\nCan be set either to user or environment.\nWorks only when not using a droparea!\n[see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture)",
3971
- "value": { "type": "'user' | 'environment'" }
3816
+ "name": "images",
3817
+ "value": { "type": "boolean", "default": "false" }
3972
3818
  },
3973
3819
  {
3974
- "name": "multiple",
3975
- "description": "Indicates whether the user can select more than one file.\nHas no effect if webkitdirectory is set.\n[see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#multiple)",
3820
+ "name": "videos",
3976
3821
  "value": { "type": "boolean", "default": "false" }
3977
3822
  },
3978
3823
  {
3979
- "name": "webkitdirectory",
3980
- "description": "Indicates that the file control should let the user select directories instead of files.\nWhen a directory is selected, the directory and its entire hierarchy of contents are included\nin the set of selected items.\nNote: This is a non-standard attribute but is supported in the major browsers.\n[see MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitdirectory)",
3824
+ "name": "dates",
3981
3825
  "value": { "type": "boolean", "default": "false" }
3982
3826
  },
3983
3827
  {
3984
- "name": "form",
3985
- "description": "By default, form controls are associated with the nearest containing `<form>` element.\nThis attribute allows you to place the form control outside of a form and associate it\nwith the form that has this `id`. The form must be in the same document\nor shadow root for this to work.",
3986
- "value": { "type": "string", "default": "''" }
3828
+ "name": "emojis",
3829
+ "value": { "type": "boolean", "default": "false" }
3987
3830
  },
3988
3831
  {
3989
- "name": "required",
3990
- "description": "Makes the input a required field.",
3832
+ "name": "code",
3991
3833
  "value": { "type": "boolean", "default": "false" }
3992
3834
  },
3993
3835
  {
3994
- "name": "hide-value",
3995
- "description": "Suppress the value from being displayed in the file control",
3836
+ "name": "ai",
3996
3837
  "value": { "type": "boolean", "default": "false" }
3997
3838
  },
3998
3839
  {
3999
- "name": "src",
4000
- "description": "URL of an already-uploaded file (e.g., from a CDN) to display as the current value\nwhen no file has been selected locally. If the URL points to an image, it is rendered\nas a preview inside the droparea. Otherwise the URL is shown as a filename.",
3840
+ "name": "ai-path",
4001
3841
  "value": { "type": "string", "default": "''" }
4002
3842
  },
4003
3843
  {
4004
- "name": "trigger-submit",
4005
- "description": "When enabled, automatically submit the surrounding form whenever the value changes\n(file selected, dropped, or cleared). Useful for forms that only contain this control\nand a CSRF token.",
4006
- "value": { "type": "boolean", "default": "false" }
3844
+ "name": "store-key",
3845
+ "description": "Caches unsent content while typing and restores it when the editor next loads,\nso agent replies in tickets/chats survive reloads and navigation. Use a key\nunique to the conversation (e.g. the ticket ID). The cache is cleared on submit.",
3846
+ "value": { "type": "string", "default": "\"\"" }
4007
3847
  },
4008
3848
  {
4009
- "name": "show-link",
4010
- "description": "When enabled, render the current link (`previewSrc`) as a clickable URL below the control.\nUseful for showing the existing CDN link alongside the preview.",
3849
+ "name": "store-ttl",
3850
+ "description": "Cached-content expiry in seconds. Defaults to 1 day.",
3851
+ "value": { "type": "number", "default": "86400" }
3852
+ },
3853
+ {
3854
+ "name": "local-storage",
3855
+ "description": "Cache to localStorage instead of sessionStorage, persisting across tabs and browser restarts.",
3856
+ "value": { "type": "boolean" }
3857
+ }
3858
+ ],
3859
+ "slots": [
3860
+ { "name": "", "description": "The default slot." },
3861
+ { "name": "example", "description": "An example slot." }
3862
+ ],
3863
+ "events": [
3864
+ { "name": "zn-event-name", "description": "Emitted as an example." }
3865
+ ],
3866
+ "js": {
3867
+ "properties": [
3868
+ { "name": "id", "type": "string" },
3869
+ { "name": "name", "type": "string" },
3870
+ { "name": "value", "type": "string" },
3871
+ { "name": "interactionType", "type": "'ticket' | 'chat'" },
3872
+ { "name": "uploadAttachmentUrl", "type": "string" },
3873
+ { "name": "codeBlocksEnabled", "type": "boolean" },
3874
+ { "name": "dividersEnabled", "type": "boolean" },
3875
+ { "name": "linksEnabled", "type": "boolean" },
3876
+ { "name": "attachmentsEnabled", "type": "boolean" },
3877
+ { "name": "imagesEnabled", "type": "boolean" },
3878
+ { "name": "videosEnabled", "type": "boolean" },
3879
+ { "name": "datesEnabled", "type": "boolean" },
3880
+ { "name": "emojisEnabled", "type": "boolean" },
3881
+ { "name": "codeEnabled", "type": "boolean" },
3882
+ { "name": "aiEnabled", "type": "boolean" },
3883
+ { "name": "aiPath", "type": "string" },
3884
+ {
3885
+ "name": "storeKey",
3886
+ "description": "Caches unsent content while typing and restores it when the editor next loads,\nso agent replies in tickets/chats survive reloads and navigation. Use a key\nunique to the conversation (e.g. the ticket ID). The cache is cleared on submit.",
3887
+ "type": "string"
3888
+ },
3889
+ {
3890
+ "name": "storeTtl",
3891
+ "description": "Cached-content expiry in seconds. Defaults to 1 day.",
3892
+ "type": "number"
3893
+ },
3894
+ {
3895
+ "name": "localStorage",
3896
+ "description": "Cache to localStorage instead of sessionStorage, persisting across tabs and browser restarts.",
3897
+ "type": "boolean"
3898
+ },
3899
+ { "name": "validity", "type": "ValidityState" },
3900
+ { "name": "validationMessage", "type": "string" }
3901
+ ],
3902
+ "events": [
3903
+ {
3904
+ "name": "zn-event-name",
3905
+ "description": "Emitted as an example."
3906
+ }
3907
+ ]
3908
+ }
3909
+ },
3910
+ {
3911
+ "name": "zn-file",
3912
+ "description": "File controls allow selecting an arbitrary number of files for uploading.\n---\n\n\n### **Events:**\n - **zn-blur** - Emitted when the control loses focus.\n- **zn-change** - Emitted when an alteration to the control's value is committed by the user.\n- **zn-clear** - Emitted when the user confirms clearing the selected file or `src`.\n- **zn-error** - Emitted when multiple files are selected via drag and drop, without the `multiple` property being set.\n- **zn-focus** - Emitted when the control gains focus.\n- **zn-input** - Emitted when the control receives input.\n\n### **Methods:**\n - **checkValidity()** - Checks for validity but does not show a validation message.\nReturns `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(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **focus(options: _FocusOptions_)** - Sets focus on the button or droparea.\n- **blur()** - Removes focus from the button or droparea.\n- **clear()** - Programmatically clears the selected file and any external `src` without\nconfirmation. Unlike a user-initiated clear, this does not flag the control\nto submit an empty value.\n\n### **Slots:**\n - **label** - The file control's label. Alternatively, you can use the `label` attribute.\n- **help-text** - Text that describes how to use the file control. Alternatively, you can use the `help-text` attribute.\n- **trigger** - Optional content to be used as trigger instead of the default content. Opening the file dialog on click and as well as drag and drop will work for this content. Following attributes will no longer work: *label*, *droparea*, *help-text*, *size*, *hide-value*. Also if using the disabled attribute, the disabled styling will not be applied and must be taken care of yourself.\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **button-wrapper** - The wrapper around the button and text value.\n- **button** - The zn-button acting as a file input.\n- **button__base** - The zn-button's exported `base` part.\n- **value** - The chosen files or placeholder text for the file input.\n- **droparea** - The element wrapping the drop zone.\n- **droparea-background** - The background of the drop zone.\n- **upload** - The upload button shown in the droparea when no file is selected.\n- **preview** - The image preview rendered in the droparea for previewable files.\n- **filename** - The filename label rendered in the droparea for non-previewable files.\n- **clear** - The clear button rendered in the droparea when a file is present.\n- **clear-confirm** - The confirmation dialog shown before clearing the file.\n- **link** - The current link anchor rendered when `show-link` is enabled.\n- **trigger** - The container that wraps the trigger.",
3913
+ "doc-url": "",
3914
+ "attributes": [
3915
+ {
3916
+ "name": "files",
3917
+ "description": "The selected files as a FileList object containing a list of File objects.\nThe FileList behaves like an array, so you can get the number of selected files\nvia its length property.\n[see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#getting_information_on_selected_files)",
3918
+ "value": { "type": "string" }
3919
+ },
3920
+ {
3921
+ "name": "name",
3922
+ "description": "The name of the file control, submitted as a name/value pair with form data.",
3923
+ "value": { "type": "string", "default": "''" }
3924
+ },
3925
+ {
3926
+ "name": "value",
3927
+ "description": "The value of the file control contains a string that represents the path of the selected file.\nIf multiple files are selected, the value represents the first file in the list.\nIf no file is selected, the value is an empty string.\nBeware that the only valid value when setting a file control is an empty string!\n[see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#value)",
3928
+ "value": { "type": "string" }
3929
+ },
3930
+ {
3931
+ "name": "size",
3932
+ "description": "The file control's size.",
3933
+ "value": {
3934
+ "type": "'small' | 'medium' | 'large'",
3935
+ "default": "'medium'"
3936
+ }
3937
+ },
3938
+ {
3939
+ "name": "label",
3940
+ "description": "The file control's label. If you need to display HTML, use the `label` slot instead.",
3941
+ "value": { "type": "string", "default": "''" }
3942
+ },
3943
+ {
3944
+ "name": "clearable",
3945
+ "description": "If this is set, then the only way to remove files is to click the cross next to them.",
3946
+ "value": { "type": "boolean", "default": "false" }
3947
+ },
3948
+ {
3949
+ "name": "help-text",
3950
+ "description": "The file control's help text.\nIf you need to display HTML, use the `help-text` slot instead.",
3951
+ "value": { "type": "string", "default": "''" }
3952
+ },
3953
+ {
3954
+ "name": "disabled",
3955
+ "description": "Disables the file control.",
3956
+ "value": { "type": "boolean", "default": "false" }
3957
+ },
3958
+ {
3959
+ "name": "droparea",
3960
+ "description": "Draw the file control as a drop area",
3961
+ "value": { "type": "boolean", "default": "false" }
3962
+ },
3963
+ {
3964
+ "name": "accept",
3965
+ "description": "Comma separated list of supported file types\n[see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept)",
3966
+ "value": { "type": "string", "default": "''" }
3967
+ },
3968
+ {
3969
+ "name": "capture",
3970
+ "description": "Specifies the types of files that the server accepts.\nCan be set either to user or environment.\nWorks only when not using a droparea!\n[see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture)",
3971
+ "value": { "type": "'user' | 'environment'" }
3972
+ },
3973
+ {
3974
+ "name": "multiple",
3975
+ "description": "Indicates whether the user can select more than one file.\nHas no effect if webkitdirectory is set.\n[see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#multiple)",
3976
+ "value": { "type": "boolean", "default": "false" }
3977
+ },
3978
+ {
3979
+ "name": "webkitdirectory",
3980
+ "description": "Indicates that the file control should let the user select directories instead of files.\nWhen a directory is selected, the directory and its entire hierarchy of contents are included\nin the set of selected items.\nNote: This is a non-standard attribute but is supported in the major browsers.\n[see MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitdirectory)",
3981
+ "value": { "type": "boolean", "default": "false" }
3982
+ },
3983
+ {
3984
+ "name": "form",
3985
+ "description": "By default, form controls are associated with the nearest containing `<form>` element.\nThis attribute allows you to place the form control outside of a form and associate it\nwith the form that has this `id`. The form must be in the same document\nor shadow root for this to work.",
3986
+ "value": { "type": "string", "default": "''" }
3987
+ },
3988
+ {
3989
+ "name": "required",
3990
+ "description": "Makes the input a required field.",
3991
+ "value": { "type": "boolean", "default": "false" }
3992
+ },
3993
+ {
3994
+ "name": "hide-value",
3995
+ "description": "Suppress the value from being displayed in the file control",
3996
+ "value": { "type": "boolean", "default": "false" }
3997
+ },
3998
+ {
3999
+ "name": "src",
4000
+ "description": "URL of an already-uploaded file (e.g., from a CDN) to display as the current value\nwhen no file has been selected locally. If the URL points to an image, it is rendered\nas a preview inside the droparea. Otherwise the URL is shown as a filename.",
4001
+ "value": { "type": "string", "default": "''" }
4002
+ },
4003
+ {
4004
+ "name": "trigger-submit",
4005
+ "description": "When enabled, automatically submit the surrounding form whenever the value changes\n(file selected, dropped, or cleared). Useful for forms that only contain this control\nand a CSRF token.",
4006
+ "value": { "type": "boolean", "default": "false" }
4007
+ },
4008
+ {
4009
+ "name": "show-link",
4010
+ "description": "When enabled, render the current link (`previewSrc`) as a clickable URL below the control.\nUseful for showing the existing CDN link alongside the preview.",
4011
4011
  "value": { "type": "boolean", "default": "false" }
4012
4012
  },
4013
4013
  {
@@ -5962,80 +5962,6 @@
5962
5962
  ]
5963
5963
  }
5964
5964
  },
5965
- {
5966
- "name": "zn-linked-select",
5967
- "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.",
5968
- "doc-url": "",
5969
- "attributes": [
5970
- {
5971
- "name": "name",
5972
- "value": { "type": "string", "default": "\"\"" }
5973
- },
5974
- { "name": "value", "value": { "type": "string" } },
5975
- {
5976
- "name": "checked",
5977
- "value": { "type": "boolean", "default": "false" }
5978
- },
5979
- { "name": "options", "value": { "type": "linkedSelectOptions" } },
5980
- {
5981
- "name": "linked-select",
5982
- "value": { "type": "string", "default": "\"\"" }
5983
- },
5984
- {
5985
- "name": "cache-key",
5986
- "value": { "type": "string", "default": "\"\"" }
5987
- },
5988
- {
5989
- "name": "label",
5990
- "value": { "type": "string", "default": "\"\"" }
5991
- },
5992
- {
5993
- "name": "select-first",
5994
- "description": "Automatically select the first option of the linked group when no value is set.",
5995
- "value": { "type": "boolean", "default": "false" }
5996
- }
5997
- ],
5998
- "slots": [
5999
- { "name": "", "description": "The default slot." },
6000
- { "name": "example", "description": "An example slot." }
6001
- ],
6002
- "events": [
6003
- { "name": "zn-event-name", "description": "Emitted as an example." }
6004
- ],
6005
- "js": {
6006
- "properties": [
6007
- { "name": "name", "type": "string" },
6008
- { "name": "value", "type": "string" },
6009
- {
6010
- "name": "defaultValue",
6011
- "description": "The default value of the form control. Primarily used for resetting the form control.",
6012
- "type": "string"
6013
- },
6014
- { "name": "checked", "type": "boolean" },
6015
- { "name": "options", "type": "linkedSelectOptions" },
6016
- { "name": "linkedSelect", "type": "string" },
6017
- { "name": "cacheKey", "type": "string" },
6018
- { "name": "label", "type": "string" },
6019
- {
6020
- "name": "selectFirst",
6021
- "description": "Automatically select the first option of the linked group when no value is set.",
6022
- "type": "boolean"
6023
- },
6024
- { "name": "input", "type": "ZnSelect" },
6025
- { "name": "displayLabel" },
6026
- { "name": "validity" },
6027
- { "name": "validationMessage" },
6028
- { "name": "handleLinkedSelectChange" },
6029
- { "name": "handleSelectChange" }
6030
- ],
6031
- "events": [
6032
- {
6033
- "name": "zn-event-name",
6034
- "description": "Emitted as an example."
6035
- }
6036
- ]
6037
- }
6038
- },
6039
5965
  {
6040
5966
  "name": "zn-markdown-editor",
6041
5967
  "description": "A markdown editor with live preview, split view, and a fullscreen mode.\n---\n\n\n### **Events:**\n - **zn-view-mode-change** - Emitted when the user switches between editor / split / preview.\n- **zn-change** - Emitted when the markdown content changes.\n- **zn-input** - Emitted on each keystroke in the editor.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Sets focus on the editor.\n- **blur()** - Removes focus from the editor.\n\n### **Slots:**\n - **label** - The editor label. Alternatively, use the `label` attribute.\n- **help-text** - Help text shown below the editor. Alternatively, use the `help-text` attribute.\n- _default_ - The panel's main content.\n- **actions** - Actions displayed in the panel header (buttons, chips, etc).\n- **footer** - Content displayed in the panel footer.\n\n### **CSS Properties:**\n - **--zn-panel-basis** - The flex-basis of the panel. Can be set using the basis-px attribute. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **toolbar** - The toolbar containing the view-mode and fullscreen controls.\n- **editor** - The textarea wrapper.\n- **preview** - The rendered markdown preview.",
@@ -6256,26 +6182,100 @@
6256
6182
  }
6257
6183
  },
6258
6184
  {
6259
- "name": "zn-menu",
6260
- "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- **--zn-menu-max-height** - Caps the menu's height and makes it scroll internally. Unset (`none`) by default, so the menu grows to fit its items unless a consumer sets this. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
6185
+ "name": "zn-linked-select",
6186
+ "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.",
6261
6187
  "doc-url": "",
6262
6188
  "attributes": [
6263
6189
  {
6264
- "name": "actions",
6265
- "value": { "type": "array", "default": "[]" }
6190
+ "name": "name",
6191
+ "value": { "type": "string", "default": "\"\"" }
6266
6192
  },
6193
+ { "name": "value", "value": { "type": "string" } },
6267
6194
  {
6268
- "name": "variant",
6269
- "description": "The menu's visual style. `shell` renders the app-shell header dropdown\nlook: a padded panel with floating rounded items. Propagated to the\nmenu's items.",
6270
- "value": { "type": "'default' | 'shell'", "default": "'default'" }
6271
- }
6272
- ],
6273
- "slots": [
6274
- { "name": "", "description": "The default slot." },
6275
- { "name": "example", "description": "An example slot." }
6276
- ],
6277
- "events": [
6278
- { "name": "zn-event-name", "description": "Emitted as an example." }
6195
+ "name": "checked",
6196
+ "value": { "type": "boolean", "default": "false" }
6197
+ },
6198
+ { "name": "options", "value": { "type": "linkedSelectOptions" } },
6199
+ {
6200
+ "name": "linked-select",
6201
+ "value": { "type": "string", "default": "\"\"" }
6202
+ },
6203
+ {
6204
+ "name": "cache-key",
6205
+ "value": { "type": "string", "default": "\"\"" }
6206
+ },
6207
+ {
6208
+ "name": "label",
6209
+ "value": { "type": "string", "default": "\"\"" }
6210
+ },
6211
+ {
6212
+ "name": "select-first",
6213
+ "description": "Automatically select the first option of the linked group when no value is set.",
6214
+ "value": { "type": "boolean", "default": "false" }
6215
+ }
6216
+ ],
6217
+ "slots": [
6218
+ { "name": "", "description": "The default slot." },
6219
+ { "name": "example", "description": "An example slot." }
6220
+ ],
6221
+ "events": [
6222
+ { "name": "zn-event-name", "description": "Emitted as an example." }
6223
+ ],
6224
+ "js": {
6225
+ "properties": [
6226
+ { "name": "name", "type": "string" },
6227
+ { "name": "value", "type": "string" },
6228
+ {
6229
+ "name": "defaultValue",
6230
+ "description": "The default value of the form control. Primarily used for resetting the form control.",
6231
+ "type": "string"
6232
+ },
6233
+ { "name": "checked", "type": "boolean" },
6234
+ { "name": "options", "type": "linkedSelectOptions" },
6235
+ { "name": "linkedSelect", "type": "string" },
6236
+ { "name": "cacheKey", "type": "string" },
6237
+ { "name": "label", "type": "string" },
6238
+ {
6239
+ "name": "selectFirst",
6240
+ "description": "Automatically select the first option of the linked group when no value is set.",
6241
+ "type": "boolean"
6242
+ },
6243
+ { "name": "input", "type": "ZnSelect" },
6244
+ { "name": "displayLabel" },
6245
+ { "name": "validity" },
6246
+ { "name": "validationMessage" },
6247
+ { "name": "handleLinkedSelectChange" },
6248
+ { "name": "handleSelectChange" }
6249
+ ],
6250
+ "events": [
6251
+ {
6252
+ "name": "zn-event-name",
6253
+ "description": "Emitted as an example."
6254
+ }
6255
+ ]
6256
+ }
6257
+ },
6258
+ {
6259
+ "name": "zn-menu",
6260
+ "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- **--zn-menu-max-height** - Caps the menu's height and makes it scroll internally. Unset (`none`) by default, so the menu grows to fit its items unless a consumer sets this. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
6261
+ "doc-url": "",
6262
+ "attributes": [
6263
+ {
6264
+ "name": "actions",
6265
+ "value": { "type": "array", "default": "[]" }
6266
+ },
6267
+ {
6268
+ "name": "variant",
6269
+ "description": "The menu's visual style. `shell` renders the app-shell header dropdown\nlook: a padded panel with floating rounded items. Propagated to the\nmenu's items.",
6270
+ "value": { "type": "'default' | 'shell'", "default": "'default'" }
6271
+ }
6272
+ ],
6273
+ "slots": [
6274
+ { "name": "", "description": "The default slot." },
6275
+ { "name": "example", "description": "An example slot." }
6276
+ ],
6277
+ "events": [
6278
+ { "name": "zn-event-name", "description": "Emitted as an example." }
6279
6279
  ],
6280
6280
  "js": {
6281
6281
  "properties": [
@@ -7153,28 +7153,6 @@
7153
7153
  "events": []
7154
7154
  }
7155
7155
  },
7156
- {
7157
- "name": "zn-pane",
7158
- "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.",
7159
- "doc-url": "",
7160
- "attributes": [{ "name": "flush", "value": { "type": "boolean" } }],
7161
- "slots": [
7162
- { "name": "", "description": "The default slot." },
7163
- { "name": "example", "description": "An example slot." }
7164
- ],
7165
- "events": [
7166
- { "name": "zn-event-name", "description": "Emitted as an example." }
7167
- ],
7168
- "js": {
7169
- "properties": [{ "name": "flush", "type": "boolean" }],
7170
- "events": [
7171
- {
7172
- "name": "zn-event-name",
7173
- "description": "Emitted as an example."
7174
- }
7175
- ]
7176
- }
7177
- },
7178
7156
  {
7179
7157
  "name": "zn-panel",
7180
7158
  "description": "Panels are versatile containers that provide structure for organizing content with optional headers and footers.\n---\n\n\n### **Slots:**\n - _default_ - The panel's main content.\n- **actions** - Actions displayed in the panel header (buttons, chips, etc).\n- **footer** - Content displayed in the panel footer.\n\n### **CSS Properties:**\n - **--zn-panel-basis** - The flex-basis of the panel. Can be set using the basis-px attribute. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
@@ -7223,6 +7201,28 @@
7223
7201
  "events": []
7224
7202
  }
7225
7203
  },
7204
+ {
7205
+ "name": "zn-pane",
7206
+ "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.",
7207
+ "doc-url": "",
7208
+ "attributes": [{ "name": "flush", "value": { "type": "boolean" } }],
7209
+ "slots": [
7210
+ { "name": "", "description": "The default slot." },
7211
+ { "name": "example", "description": "An example slot." }
7212
+ ],
7213
+ "events": [
7214
+ { "name": "zn-event-name", "description": "Emitted as an example." }
7215
+ ],
7216
+ "js": {
7217
+ "properties": [{ "name": "flush", "type": "boolean" }],
7218
+ "events": [
7219
+ {
7220
+ "name": "zn-event-name",
7221
+ "description": "Emitted as an example."
7222
+ }
7223
+ ]
7224
+ }
7225
+ },
7226
7226
  {
7227
7227
  "name": "zn-popup",
7228
7228
  "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 - **reposition()** - Forces the popup to recalculate and reposition itself.\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.",
@@ -8643,6 +8643,45 @@
8643
8643
  ]
8644
8644
  }
8645
8645
  },
8646
+ {
8647
+ "name": "zn-scroll-container",
8648
+ "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 - **--zn-scroll-container-height** - The height and maximum height of the scroll container. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
8649
+ "doc-url": "",
8650
+ "attributes": [
8651
+ {
8652
+ "name": "height",
8653
+ "description": "The height and maximum height of the scroll container.",
8654
+ "value": { "type": "string", "default": "''" }
8655
+ },
8656
+ {
8657
+ "name": "start-scrolled",
8658
+ "value": { "type": "boolean", "default": "false" }
8659
+ }
8660
+ ],
8661
+ "slots": [
8662
+ { "name": "", "description": "The default slot." },
8663
+ { "name": "example", "description": "An example slot." }
8664
+ ],
8665
+ "events": [
8666
+ { "name": "zn-event-name", "description": "Emitted as an example." }
8667
+ ],
8668
+ "js": {
8669
+ "properties": [
8670
+ {
8671
+ "name": "height",
8672
+ "description": "The height and maximum height of the scroll container.",
8673
+ "type": "string"
8674
+ },
8675
+ { "name": "startScrolled", "type": "boolean" }
8676
+ ],
8677
+ "events": [
8678
+ {
8679
+ "name": "zn-event-name",
8680
+ "description": "Emitted as an example."
8681
+ }
8682
+ ]
8683
+ }
8684
+ },
8646
8685
  {
8647
8686
  "name": "zn-schedule-builder",
8648
8687
  "description": "Builds a weekly opening-hours schedule as a drag-to-paint calendar or a compact list of\ntime ranges, and posts the result as JSON.\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when the schedule changes.\n\n### **Methods:**\n - **checkValidity(): _boolean_** - Checks validity but does not show a validation message.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity(): _boolean_** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **setDay(day: _ScheduleDay_, ranges: _ScheduleRange[]_)** - Replaces the hours for a single day, in the save timezone.\n- **getDay(day: _ScheduleDay_): _ScheduleRange[]_** - Reads the hours for a single day, in the save timezone.\n- **setDisplayDay(day: _ScheduleDay_, ranges: _ScheduleRange[]_)** - Replaces the hours for a single day, given in the display timezone.\n\n### **Slots:**\n - **label** - The schedule's label. Alternatively, use the `label` attribute.\n- **help-text** - Text that describes how to use the schedule. Alternatively, use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--slot-height** - The height of a single time slot in the calendar. Defaults to `18px`. _(default: undefined)_\n- **--gutter-width** - The width of the calendar's time gutter. Defaults to `64px`. _(default: undefined)_\n- **--open-color** - The fill used for open hours. _(default: undefined)_\n- **--reduced-color** - The fill used for hours an exception removes. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the builder, label and help text.\n- **base** - The component's base wrapper.\n- **toolbar** - The row above the builder holding the hint, legend and view toggle.\n- **calendar** - The calendar view wrapper.\n- **list** - The form (list) view wrapper.\n- **summary** - The summary panel beside the calendar.",
@@ -8936,45 +8975,6 @@
8936
8975
  ]
8937
8976
  }
8938
8977
  },
8939
- {
8940
- "name": "zn-scroll-container",
8941
- "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 - **--zn-scroll-container-height** - The height and maximum height of the scroll container. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
8942
- "doc-url": "",
8943
- "attributes": [
8944
- {
8945
- "name": "height",
8946
- "description": "The height and maximum height of the scroll container.",
8947
- "value": { "type": "string", "default": "''" }
8948
- },
8949
- {
8950
- "name": "start-scrolled",
8951
- "value": { "type": "boolean", "default": "false" }
8952
- }
8953
- ],
8954
- "slots": [
8955
- { "name": "", "description": "The default slot." },
8956
- { "name": "example", "description": "An example slot." }
8957
- ],
8958
- "events": [
8959
- { "name": "zn-event-name", "description": "Emitted as an example." }
8960
- ],
8961
- "js": {
8962
- "properties": [
8963
- {
8964
- "name": "height",
8965
- "description": "The height and maximum height of the scroll container.",
8966
- "type": "string"
8967
- },
8968
- { "name": "startScrolled", "type": "boolean" }
8969
- ],
8970
- "events": [
8971
- {
8972
- "name": "zn-event-name",
8973
- "description": "Emitted as an example."
8974
- }
8975
- ]
8976
- }
8977
- },
8978
8978
  {
8979
8979
  "name": "zn-select",
8980
8980
  "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when the control's value changes.\n- **zn-clear** - Emitted when the control's value is cleared.\n- **zn-input** - Emitted when the control receives input.\n- **zn-focus** - Emitted when the control gains focus.\n- **zn-blur** - Emitted when the control loses focus.\n- **zn-show** - Emitted when the select's menu opens.\n- **zn-after-show** - Emitted after the select's menu opens and all animations are complete.\n- **zn-hide** - Emitted when the select's menu closes.\n- **zn-after-hide** - Emitted after the select's menu closes and all animations are complete.\n- **zn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n- **zn-load** - Emitted when options have been successfully loaded from the `src` URL.\n- **zn-error** - Emitted when loading options from the `src` URL fails.\n\n### **Methods:**\n - **fetchOptions(searchQuery: _string_)** - Fetches options from the URL specified by the `data-uri` property. Optionally appends a search query.\n- **show()** - Shows the listbox.\n- **hide()** - Hides the listbox.\n- **checkValidity()** - Checks for 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(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **focus(options: _FocusOptions_)** - Sets focus on the control.\n- **blur()** - Removes focus from the control.\n\n### **Slots:**\n - _default_ - The listbox options. Must be `<zn-option>` elements. You can use `<zn-opt-group>` to group options under a labeled header, or `<zn-divider>` to group items visually.\n- **label** - The input's label. Alternatively, you can use the `label` attribute.\n- **label-tooltip** - Used to add text that is displayed in a tooltip next to the label. Alternatively, you can use the `label-tooltip` attribute.\n- **context-note** - Used to add contextual text that is displayed above the select, on the right. Alternatively, you can use the `context-note` attribute.\n- **prefix** - Used to prepend a presentational icon or similar element to the combobox.\n- **suffix** - Used to append a presentational element — a chip marking the selected option's state, for instance — to the combobox, between the value and the clear and expand icons.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **expand-icon** - The icon to show when the control is expanded and collapsed. Rotates on open and close.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Parts:**\n - **search-loading** - The container shown while a remote search request is in flight.\n- **max-results-indicator** - The message shown when results are truncated by `max-results`.\n- **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The select's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **combobox** - The container the wraps the prefix, combobox, clear icon, and expand button.\n- **prefix** - The container that wraps the prefix slot.\n- **suffix** - The container that wraps the suffix slot.\n- **display-input** - The element that displays the selected option's label, an `<input>` element.\n- **listbox** - The listbox container where options are slotted.\n- **tags** - The container that houses option tags when `multiselect` is used.\n- **tag** - The individual tags that represent each multiselect option.\n- **tag__base** - The tag's base part.\n- **tag__content** - The tag's content part.\n- **tag__remove-button** - The tag's remove button.\n- **tag__remove-button__base** - The tag's remove button base part.\n- **clear-button** - The clear button.\n- **expand-icon** - The container that wraps the expand icon.",
@@ -11669,44 +11669,164 @@
11669
11669
  }
11670
11670
  },
11671
11671
  {
11672
- "name": "zn-thumbnail-group",
11673
- "description": "Lays a set of `zn-thumbnail` elements out as a single scrollable row, with a\n\"Show All\" toggle that expands them into a wrapping grid.\n---\n\n\n### **Events:**\n - **zn-expand** - Emitted when the group expands into the full grid.\n- **zn-collapse** - Emitted when the group collapses back to a single row.\n- **zn-change** - Emitted when the selected thumbnail changes (`selectable` groups only).\n\n### **Methods:**\n - **show()** - Expands the group into the full grid.\n- **hide()** - Collapses the group back to a single row.\n\n### **Slots:**\n - _default_ - One or more `zn-thumbnail` elements.\n- **caption** - Replaces the heading text.\n- **actions** - Extra content in the header, before the toggle.\n\n### **CSS Properties:**\n - **--zn-thumbnail-width** - Track width of a thumbnail. Defaults to 180px. Also settable with the `thumbnail-width` attribute. _(default: undefined)_\n- **--zn-thumbnail-gap** - Gap between thumbnails. Also settable with the `gap` attribute. _(default: undefined)_\n- **--zn-thumbnail-aspect-ratio** - Aspect ratio of every thumbnail in the group. Also settable with the `aspect-ratio` attribute. Any `zn-thumbnail` custom property set here is inherited by the slotted thumbnails. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **header** - The header row holding the caption and toggle.\n- **caption** - The heading text.\n- **toggle** - The show all / show less button.\n- **items** - The scrolling row / expanded grid that holds the thumbnails.",
11672
+ "name": "zn-tile",
11673
+ "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.",
11674
11674
  "doc-url": "",
11675
11675
  "attributes": [
11676
+ { "name": "caption", "value": { "type": "string" } },
11677
+ { "name": "description", "value": { "type": "string" } },
11678
+ { "name": "href", "value": { "type": "string" } },
11679
+ { "name": "data-target", "value": { "type": "string" } },
11680
+ { "name": "gaid", "value": { "type": "string" } },
11681
+ { "name": "data-uri", "value": { "type": "string" } },
11682
+ { "name": "flush", "value": { "type": "boolean" } },
11683
+ { "name": "flush-x", "value": { "type": "boolean" } },
11684
+ { "name": "flush-y", "value": { "type": "boolean" } },
11685
+ { "name": "inline", "value": { "type": "boolean" } },
11676
11686
  {
11677
- "name": "caption",
11678
- "description": "The heading shown at the top left of the group.",
11679
- "value": { "type": "string", "default": "''" }
11680
- },
11681
- {
11682
- "name": "expanded",
11683
- "description": "Expands the group into the full wrapping grid.",
11684
- "value": { "type": "boolean", "default": "false" }
11685
- },
11686
- {
11687
- "name": "total",
11688
- "description": "Total number of thumbnails in the underlying set, shown in the \"Show All (n)\" label. Set this when\nthe row only holds the first page of a larger set; otherwise the slotted thumbnails are counted.",
11689
- "value": { "type": "number", "default": "0" }
11690
- },
11691
- {
11692
- "name": "show-all-label",
11693
- "description": "Label of the expand toggle. The count is appended in brackets.",
11694
- "value": { "type": "string", "default": "'Show All'" }
11695
- },
11696
- {
11697
- "name": "show-less-label",
11698
- "description": "Label of the collapse toggle.",
11699
- "value": { "type": "string", "default": "'Show Less'" }
11700
- },
11701
- {
11702
- "name": "hide-toggle",
11703
- "description": "Never render the toggle, even when the row overflows.",
11704
- "value": { "type": "boolean", "default": "false" }
11705
- },
11706
- {
11707
- "name": "always-toggle",
11708
- "description": "Always render the toggle, even when every thumbnail already fits on the row.",
11709
- "value": { "type": "boolean", "default": "false" }
11687
+ "name": "plain",
11688
+ "description": "Renders the caption in the normal table-content weight instead of bold.",
11689
+ "value": { "type": "boolean" }
11690
+ },
11691
+ {
11692
+ "name": "grouped",
11693
+ "description": "Set by `zn-tile-group` to lay the tile out as a shared-column subgrid row.",
11694
+ "value": { "type": "boolean" }
11695
+ }
11696
+ ],
11697
+ "slots": [
11698
+ { "name": "", "description": "The default slot." },
11699
+ { "name": "example", "description": "An example slot." }
11700
+ ],
11701
+ "events": [
11702
+ { "name": "zn-event-name", "description": "Emitted as an example." }
11703
+ ],
11704
+ "js": {
11705
+ "properties": [
11706
+ { "name": "caption", "type": "string" },
11707
+ { "name": "description", "type": "string" },
11708
+ { "name": "href", "type": "string" },
11709
+ { "name": "dataTarget", "type": "string" },
11710
+ { "name": "gaid", "type": "string" },
11711
+ { "name": "dataUri", "type": "string" },
11712
+ { "name": "flush", "type": "boolean" },
11713
+ { "name": "flushX", "type": "boolean" },
11714
+ { "name": "flushY", "type": "boolean" },
11715
+ { "name": "inline", "type": "boolean" },
11716
+ {
11717
+ "name": "plain",
11718
+ "description": "Renders the caption in the normal table-content weight instead of bold.",
11719
+ "type": "boolean"
11720
+ },
11721
+ {
11722
+ "name": "grouped",
11723
+ "description": "Set by `zn-tile-group` to lay the tile out as a shared-column subgrid row.",
11724
+ "type": "boolean"
11725
+ }
11726
+ ],
11727
+ "events": [
11728
+ {
11729
+ "name": "zn-event-name",
11730
+ "description": "Emitted as an example."
11731
+ }
11732
+ ]
11733
+ }
11734
+ },
11735
+ {
11736
+ "name": "zn-tile-group",
11737
+ "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).",
11738
+ "doc-url": "",
11739
+ "attributes": [
11740
+ {
11741
+ "name": "divide",
11742
+ "description": "Draws a dividing border between rows.",
11743
+ "value": { "type": "boolean", "default": "false" }
11744
+ }
11745
+ ],
11746
+ "slots": [
11747
+ { "name": "", "description": "One or more `zn-tile` elements." }
11748
+ ],
11749
+ "events": [],
11750
+ "js": {
11751
+ "properties": [
11752
+ {
11753
+ "name": "divide",
11754
+ "description": "Draws a dividing border between rows.",
11755
+ "type": "boolean"
11756
+ }
11757
+ ],
11758
+ "events": []
11759
+ }
11760
+ },
11761
+ {
11762
+ "name": "zn-tile-property",
11763
+ "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.",
11764
+ "doc-url": "",
11765
+ "attributes": [
11766
+ { "name": "caption", "value": { "type": "string" } },
11767
+ { "name": "description", "value": { "type": "string" } },
11768
+ { "name": "icon", "value": { "type": "string" } }
11769
+ ],
11770
+ "slots": [
11771
+ { "name": "", "description": "The default slot." },
11772
+ { "name": "example", "description": "An example slot." }
11773
+ ],
11774
+ "events": [
11775
+ { "name": "zn-event-name", "description": "Emitted as an example." }
11776
+ ],
11777
+ "js": {
11778
+ "properties": [
11779
+ { "name": "caption", "type": "string" },
11780
+ { "name": "description", "type": "string" },
11781
+ { "name": "icon", "type": "string" }
11782
+ ],
11783
+ "events": [
11784
+ {
11785
+ "name": "zn-event-name",
11786
+ "description": "Emitted as an example."
11787
+ }
11788
+ ]
11789
+ }
11790
+ },
11791
+ {
11792
+ "name": "zn-thumbnail-group",
11793
+ "description": "Lays a set of `zn-thumbnail` elements out as a single scrollable row, with a\n\"Show All\" toggle that expands them into a wrapping grid.\n---\n\n\n### **Events:**\n - **zn-expand** - Emitted when the group expands into the full grid.\n- **zn-collapse** - Emitted when the group collapses back to a single row.\n- **zn-change** - Emitted when the selected thumbnail changes (`selectable` groups only).\n\n### **Methods:**\n - **show()** - Expands the group into the full grid.\n- **hide()** - Collapses the group back to a single row.\n\n### **Slots:**\n - _default_ - One or more `zn-thumbnail` elements.\n- **caption** - Replaces the heading text.\n- **actions** - Extra content in the header, before the toggle.\n\n### **CSS Properties:**\n - **--zn-thumbnail-width** - Track width of a thumbnail. Defaults to 180px. Also settable with the `thumbnail-width` attribute. _(default: undefined)_\n- **--zn-thumbnail-gap** - Gap between thumbnails. Also settable with the `gap` attribute. _(default: undefined)_\n- **--zn-thumbnail-aspect-ratio** - Aspect ratio of every thumbnail in the group. Also settable with the `aspect-ratio` attribute. Any `zn-thumbnail` custom property set here is inherited by the slotted thumbnails. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **header** - The header row holding the caption and toggle.\n- **caption** - The heading text.\n- **toggle** - The show all / show less button.\n- **items** - The scrolling row / expanded grid that holds the thumbnails.",
11794
+ "doc-url": "",
11795
+ "attributes": [
11796
+ {
11797
+ "name": "caption",
11798
+ "description": "The heading shown at the top left of the group.",
11799
+ "value": { "type": "string", "default": "''" }
11800
+ },
11801
+ {
11802
+ "name": "expanded",
11803
+ "description": "Expands the group into the full wrapping grid.",
11804
+ "value": { "type": "boolean", "default": "false" }
11805
+ },
11806
+ {
11807
+ "name": "total",
11808
+ "description": "Total number of thumbnails in the underlying set, shown in the \"Show All (n)\" label. Set this when\nthe row only holds the first page of a larger set; otherwise the slotted thumbnails are counted.",
11809
+ "value": { "type": "number", "default": "0" }
11810
+ },
11811
+ {
11812
+ "name": "show-all-label",
11813
+ "description": "Label of the expand toggle. The count is appended in brackets.",
11814
+ "value": { "type": "string", "default": "'Show All'" }
11815
+ },
11816
+ {
11817
+ "name": "show-less-label",
11818
+ "description": "Label of the collapse toggle.",
11819
+ "value": { "type": "string", "default": "'Show Less'" }
11820
+ },
11821
+ {
11822
+ "name": "hide-toggle",
11823
+ "description": "Never render the toggle, even when the row overflows.",
11824
+ "value": { "type": "boolean", "default": "false" }
11825
+ },
11826
+ {
11827
+ "name": "always-toggle",
11828
+ "description": "Always render the toggle, even when every thumbnail already fits on the row.",
11829
+ "value": { "type": "boolean", "default": "false" }
11710
11830
  },
11711
11831
  {
11712
11832
  "name": "selectable",
@@ -11838,126 +11958,6 @@
11838
11958
  ]
11839
11959
  }
11840
11960
  },
11841
- {
11842
- "name": "zn-tile",
11843
- "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.",
11844
- "doc-url": "",
11845
- "attributes": [
11846
- { "name": "caption", "value": { "type": "string" } },
11847
- { "name": "description", "value": { "type": "string" } },
11848
- { "name": "href", "value": { "type": "string" } },
11849
- { "name": "data-target", "value": { "type": "string" } },
11850
- { "name": "gaid", "value": { "type": "string" } },
11851
- { "name": "data-uri", "value": { "type": "string" } },
11852
- { "name": "flush", "value": { "type": "boolean" } },
11853
- { "name": "flush-x", "value": { "type": "boolean" } },
11854
- { "name": "flush-y", "value": { "type": "boolean" } },
11855
- { "name": "inline", "value": { "type": "boolean" } },
11856
- {
11857
- "name": "plain",
11858
- "description": "Renders the caption in the normal table-content weight instead of bold.",
11859
- "value": { "type": "boolean" }
11860
- },
11861
- {
11862
- "name": "grouped",
11863
- "description": "Set by `zn-tile-group` to lay the tile out as a shared-column subgrid row.",
11864
- "value": { "type": "boolean" }
11865
- }
11866
- ],
11867
- "slots": [
11868
- { "name": "", "description": "The default slot." },
11869
- { "name": "example", "description": "An example slot." }
11870
- ],
11871
- "events": [
11872
- { "name": "zn-event-name", "description": "Emitted as an example." }
11873
- ],
11874
- "js": {
11875
- "properties": [
11876
- { "name": "caption", "type": "string" },
11877
- { "name": "description", "type": "string" },
11878
- { "name": "href", "type": "string" },
11879
- { "name": "dataTarget", "type": "string" },
11880
- { "name": "gaid", "type": "string" },
11881
- { "name": "dataUri", "type": "string" },
11882
- { "name": "flush", "type": "boolean" },
11883
- { "name": "flushX", "type": "boolean" },
11884
- { "name": "flushY", "type": "boolean" },
11885
- { "name": "inline", "type": "boolean" },
11886
- {
11887
- "name": "plain",
11888
- "description": "Renders the caption in the normal table-content weight instead of bold.",
11889
- "type": "boolean"
11890
- },
11891
- {
11892
- "name": "grouped",
11893
- "description": "Set by `zn-tile-group` to lay the tile out as a shared-column subgrid row.",
11894
- "type": "boolean"
11895
- }
11896
- ],
11897
- "events": [
11898
- {
11899
- "name": "zn-event-name",
11900
- "description": "Emitted as an example."
11901
- }
11902
- ]
11903
- }
11904
- },
11905
- {
11906
- "name": "zn-tile-group",
11907
- "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).",
11908
- "doc-url": "",
11909
- "attributes": [
11910
- {
11911
- "name": "divide",
11912
- "description": "Draws a dividing border between rows.",
11913
- "value": { "type": "boolean", "default": "false" }
11914
- }
11915
- ],
11916
- "slots": [
11917
- { "name": "", "description": "One or more `zn-tile` elements." }
11918
- ],
11919
- "events": [],
11920
- "js": {
11921
- "properties": [
11922
- {
11923
- "name": "divide",
11924
- "description": "Draws a dividing border between rows.",
11925
- "type": "boolean"
11926
- }
11927
- ],
11928
- "events": []
11929
- }
11930
- },
11931
- {
11932
- "name": "zn-tile-property",
11933
- "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.",
11934
- "doc-url": "",
11935
- "attributes": [
11936
- { "name": "caption", "value": { "type": "string" } },
11937
- { "name": "description", "value": { "type": "string" } },
11938
- { "name": "icon", "value": { "type": "string" } }
11939
- ],
11940
- "slots": [
11941
- { "name": "", "description": "The default slot." },
11942
- { "name": "example", "description": "An example slot." }
11943
- ],
11944
- "events": [
11945
- { "name": "zn-event-name", "description": "Emitted as an example." }
11946
- ],
11947
- "js": {
11948
- "properties": [
11949
- { "name": "caption", "type": "string" },
11950
- { "name": "description", "type": "string" },
11951
- { "name": "icon", "type": "string" }
11952
- ],
11953
- "events": [
11954
- {
11955
- "name": "zn-event-name",
11956
- "description": "Emitted as an example."
11957
- }
11958
- ]
11959
- }
11960
- },
11961
11961
  {
11962
11962
  "name": "zn-timer",
11963
11963
  "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.",
@@ -12219,6 +12219,120 @@
12219
12219
  ]
12220
12220
  }
12221
12221
  },
12222
+ {
12223
+ "name": "zn-translation-group",
12224
+ "description": "Puts several zn-translations fields behind one language select, so a whole form's worth of copy is\ntranslated a language at a time.\n---\n\n\n### **Events:**\n - **zn-language-change** - Emitted when the active language changes. Detail: `{ language: string }`.\n\n### **Slots:**\n - _default_ - The `zn-translations` fields the select drives.\n- **actions** - Buttons for the bottom of the panel, on the white body rather than the grey footer. They sit on the right, as zinc's form action rows do; `align=\"start\"` moves one to the left. Write them in the order they should be read — the sides are set by CSS ordering, so markup order is what a keyboard follows.\n- **footer** - Content displayed in the grey panel footer.\n\n### **CSS Properties:**\n - **--zn-panel-basis** - The flex-basis of the panel. Can be set using the basis-px attribute. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **form-group** - The form group holding the caption, the language select and the fields.\n- **actions** - The row of buttons at the bottom of the body.\n- **language-field** - The select that chooses the language every child is editing, in the group's chip slot.\n- **language-select** - The select itself.",
12225
+ "doc-url": "",
12226
+ "attributes": [
12227
+ {
12228
+ "name": "label",
12229
+ "description": "The form group's label. An alias for the inherited `caption`, which wins where both are set.",
12230
+ "value": { "type": "string", "default": "''" }
12231
+ },
12232
+ {
12233
+ "name": "help-text",
12234
+ "description": "Sits under the label, above the language select, as help text does in any other form group.",
12235
+ "value": { "type": "string", "default": "''" }
12236
+ },
12237
+ {
12238
+ "name": "inline",
12239
+ "description": "Drops the panel chrome — border, background and padding — so the group reads as a section of the surrounding form\nrather than a panel of its own. For groups nested inside another panel, where the fields would otherwise sit\nindented behind a second border.",
12240
+ "value": { "type": "boolean", "default": "false" }
12241
+ },
12242
+ {
12243
+ "name": "language-label",
12244
+ "description": "The select's accessible name. Not shown — the caption is what names the section on screen — but read out by a\nscreen reader, which has nothing else to go on once the visible label is gone.",
12245
+ "value": { "type": "string", "default": "'Edit Languages'" }
12246
+ },
12247
+ {
12248
+ "name": "languages",
12249
+ "description": "The languages on offer, as language code to display name — `{\"en\": \"English\", \"fr\": \"French\"}`. Writing the code\nas the name (`{\"en\": \"EN\"}`) is also accepted. `en` is the language every other one falls back to. Set on every\nchild, so they do not need their own copy.",
12250
+ "value": {
12251
+ "type": "Record<string, string>",
12252
+ "default": "{ 'en': 'EN' }"
12253
+ }
12254
+ },
12255
+ { "name": "basis-px", "value": { "type": "number" } },
12256
+ { "name": "caption", "value": { "type": "string" } },
12257
+ { "name": "icon", "value": { "type": "string" } },
12258
+ { "name": "tabbed", "value": { "type": "boolean" } },
12259
+ { "name": "header-borderless", "value": { "type": "boolean" } },
12260
+ { "name": "cosmic", "value": { "type": "boolean" } },
12261
+ { "name": "flush", "value": { "type": "boolean" } },
12262
+ { "name": "flush-x", "value": { "type": "boolean" } },
12263
+ { "name": "flush-y", "value": { "type": "boolean" } },
12264
+ { "name": "flush-footer", "value": { "type": "boolean" } },
12265
+ { "name": "transparent", "value": { "type": "boolean" } },
12266
+ { "name": "shadow", "value": { "type": "boolean" } }
12267
+ ],
12268
+ "slots": [
12269
+ {
12270
+ "name": "",
12271
+ "description": "The `zn-translations` fields the select drives."
12272
+ },
12273
+ {
12274
+ "name": "actions",
12275
+ "description": "Buttons for the bottom of the panel, on the white body rather than the grey footer. They sit on the right, as zinc's form action rows do; `align=\"start\"` moves one to the left. Write them in the order they should be read — the sides are set by CSS ordering, so markup order is what a keyboard follows."
12276
+ },
12277
+ {
12278
+ "name": "footer",
12279
+ "description": "Content displayed in the grey panel footer."
12280
+ }
12281
+ ],
12282
+ "events": [
12283
+ {
12284
+ "name": "zn-language-change",
12285
+ "description": "Emitted when the active language changes. Detail: `{ language: string }`."
12286
+ }
12287
+ ],
12288
+ "js": {
12289
+ "properties": [
12290
+ {
12291
+ "name": "label",
12292
+ "description": "The form group's label. An alias for the inherited `caption`, which wins where both are set.",
12293
+ "type": "string"
12294
+ },
12295
+ {
12296
+ "name": "helpText",
12297
+ "description": "Sits under the label, above the language select, as help text does in any other form group.",
12298
+ "type": "string"
12299
+ },
12300
+ {
12301
+ "name": "inline",
12302
+ "description": "Drops the panel chrome — border, background and padding — so the group reads as a section of the surrounding form\nrather than a panel of its own. For groups nested inside another panel, where the fields would otherwise sit\nindented behind a second border.",
12303
+ "type": "boolean"
12304
+ },
12305
+ {
12306
+ "name": "languageLabel",
12307
+ "description": "The select's accessible name. Not shown — the caption is what names the section on screen — but read out by a\nscreen reader, which has nothing else to go on once the visible label is gone.",
12308
+ "type": "string"
12309
+ },
12310
+ {
12311
+ "name": "languages",
12312
+ "description": "The languages on offer, as language code to display name — `{\"en\": \"English\", \"fr\": \"French\"}`. Writing the code\nas the name (`{\"en\": \"EN\"}`) is also accepted. `en` is the language every other one falls back to. Set on every\nchild, so they do not need their own copy.",
12313
+ "type": "Record<string, string>"
12314
+ },
12315
+ { "name": "basis", "type": "number" },
12316
+ { "name": "caption", "type": "string" },
12317
+ { "name": "icon", "type": "string" },
12318
+ { "name": "tabbed", "type": "boolean" },
12319
+ { "name": "headerBorderless", "type": "boolean" },
12320
+ { "name": "cosmic", "type": "boolean" },
12321
+ { "name": "flush", "type": "boolean" },
12322
+ { "name": "flushX", "type": "boolean" },
12323
+ { "name": "flushY", "type": "boolean" },
12324
+ { "name": "flushFooter", "type": "boolean" },
12325
+ { "name": "transparent", "type": "boolean" },
12326
+ { "name": "shadow", "type": "boolean" }
12327
+ ],
12328
+ "events": [
12329
+ {
12330
+ "name": "zn-language-change",
12331
+ "description": "Emitted when the active language changes. Detail: `{ language: string }`."
12332
+ }
12333
+ ]
12334
+ }
12335
+ },
12222
12336
  {
12223
12337
  "name": "zn-translations",
12224
12338
  "description": "Collects one piece of text in several languages, one language at a time.\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when a translation's value changes.\n- **zn-input** - Emitted when a translation receives input.\n\n### **Methods:**\n - **setActiveLanguage(language: _string_)** - Sets the active language externally. Used by zn-translation-group. Browsing to a language does not create a key\nfor it — an untouched language stays absent from `values` so it is not submitted as an empty translation.\n- **getActiveLanguage(): _string_** - Returns the currently active language.\n- **addLanguageKey(languageCode: _string_)** - Adds a language key to this component's values if not already present. Used by zn-translation-group.\n- **getValueLanguages(): _string[]_** - Returns all language codes that have values.\n- **hasTranslation(language: _string_): _boolean_** - Whether the language carries a translation of its own, rather than falling back to English.\n\n### **Slots:**\n - **label** - The field's label. Alternatively, use the `label` attribute.\n- **help-text** - Text describing how to fill the field in, shown below it and shared by every language. Alternatively, use the `help-text` attribute.\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, the language select, the field and the help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The wrapper around the field being edited.\n- **form-control-help-text** - The help text's wrapper.\n- **language-select** - The select that chooses the language being edited.",
@@ -12468,120 +12582,6 @@
12468
12582
  ]
12469
12583
  }
12470
12584
  },
12471
- {
12472
- "name": "zn-translation-group",
12473
- "description": "Puts several zn-translations fields behind one language select, so a whole form's worth of copy is\ntranslated a language at a time.\n---\n\n\n### **Events:**\n - **zn-language-change** - Emitted when the active language changes. Detail: `{ language: string }`.\n\n### **Slots:**\n - _default_ - The `zn-translations` fields the select drives.\n- **actions** - Buttons for the bottom of the panel, on the white body rather than the grey footer. They sit on the right, as zinc's form action rows do; `align=\"start\"` moves one to the left. Write them in the order they should be read — the sides are set by CSS ordering, so markup order is what a keyboard follows.\n- **footer** - Content displayed in the grey panel footer.\n\n### **CSS Properties:**\n - **--zn-panel-basis** - The flex-basis of the panel. Can be set using the basis-px attribute. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **form-group** - The form group holding the caption, the language select and the fields.\n- **actions** - The row of buttons at the bottom of the body.\n- **language-field** - The select that chooses the language every child is editing, in the group's chip slot.\n- **language-select** - The select itself.",
12474
- "doc-url": "",
12475
- "attributes": [
12476
- {
12477
- "name": "label",
12478
- "description": "The form group's label. An alias for the inherited `caption`, which wins where both are set.",
12479
- "value": { "type": "string", "default": "''" }
12480
- },
12481
- {
12482
- "name": "help-text",
12483
- "description": "Sits under the label, above the language select, as help text does in any other form group.",
12484
- "value": { "type": "string", "default": "''" }
12485
- },
12486
- {
12487
- "name": "inline",
12488
- "description": "Drops the panel chrome — border, background and padding — so the group reads as a section of the surrounding form\nrather than a panel of its own. For groups nested inside another panel, where the fields would otherwise sit\nindented behind a second border.",
12489
- "value": { "type": "boolean", "default": "false" }
12490
- },
12491
- {
12492
- "name": "language-label",
12493
- "description": "The select's accessible name. Not shown — the caption is what names the section on screen — but read out by a\nscreen reader, which has nothing else to go on once the visible label is gone.",
12494
- "value": { "type": "string", "default": "'Edit Languages'" }
12495
- },
12496
- {
12497
- "name": "languages",
12498
- "description": "The languages on offer, as language code to display name — `{\"en\": \"English\", \"fr\": \"French\"}`. Writing the code\nas the name (`{\"en\": \"EN\"}`) is also accepted. `en` is the language every other one falls back to. Set on every\nchild, so they do not need their own copy.",
12499
- "value": {
12500
- "type": "Record<string, string>",
12501
- "default": "{ 'en': 'EN' }"
12502
- }
12503
- },
12504
- { "name": "basis-px", "value": { "type": "number" } },
12505
- { "name": "caption", "value": { "type": "string" } },
12506
- { "name": "icon", "value": { "type": "string" } },
12507
- { "name": "tabbed", "value": { "type": "boolean" } },
12508
- { "name": "header-borderless", "value": { "type": "boolean" } },
12509
- { "name": "cosmic", "value": { "type": "boolean" } },
12510
- { "name": "flush", "value": { "type": "boolean" } },
12511
- { "name": "flush-x", "value": { "type": "boolean" } },
12512
- { "name": "flush-y", "value": { "type": "boolean" } },
12513
- { "name": "flush-footer", "value": { "type": "boolean" } },
12514
- { "name": "transparent", "value": { "type": "boolean" } },
12515
- { "name": "shadow", "value": { "type": "boolean" } }
12516
- ],
12517
- "slots": [
12518
- {
12519
- "name": "",
12520
- "description": "The `zn-translations` fields the select drives."
12521
- },
12522
- {
12523
- "name": "actions",
12524
- "description": "Buttons for the bottom of the panel, on the white body rather than the grey footer. They sit on the right, as zinc's form action rows do; `align=\"start\"` moves one to the left. Write them in the order they should be read — the sides are set by CSS ordering, so markup order is what a keyboard follows."
12525
- },
12526
- {
12527
- "name": "footer",
12528
- "description": "Content displayed in the grey panel footer."
12529
- }
12530
- ],
12531
- "events": [
12532
- {
12533
- "name": "zn-language-change",
12534
- "description": "Emitted when the active language changes. Detail: `{ language: string }`."
12535
- }
12536
- ],
12537
- "js": {
12538
- "properties": [
12539
- {
12540
- "name": "label",
12541
- "description": "The form group's label. An alias for the inherited `caption`, which wins where both are set.",
12542
- "type": "string"
12543
- },
12544
- {
12545
- "name": "helpText",
12546
- "description": "Sits under the label, above the language select, as help text does in any other form group.",
12547
- "type": "string"
12548
- },
12549
- {
12550
- "name": "inline",
12551
- "description": "Drops the panel chrome — border, background and padding — so the group reads as a section of the surrounding form\nrather than a panel of its own. For groups nested inside another panel, where the fields would otherwise sit\nindented behind a second border.",
12552
- "type": "boolean"
12553
- },
12554
- {
12555
- "name": "languageLabel",
12556
- "description": "The select's accessible name. Not shown — the caption is what names the section on screen — but read out by a\nscreen reader, which has nothing else to go on once the visible label is gone.",
12557
- "type": "string"
12558
- },
12559
- {
12560
- "name": "languages",
12561
- "description": "The languages on offer, as language code to display name — `{\"en\": \"English\", \"fr\": \"French\"}`. Writing the code\nas the name (`{\"en\": \"EN\"}`) is also accepted. `en` is the language every other one falls back to. Set on every\nchild, so they do not need their own copy.",
12562
- "type": "Record<string, string>"
12563
- },
12564
- { "name": "basis", "type": "number" },
12565
- { "name": "caption", "type": "string" },
12566
- { "name": "icon", "type": "string" },
12567
- { "name": "tabbed", "type": "boolean" },
12568
- { "name": "headerBorderless", "type": "boolean" },
12569
- { "name": "cosmic", "type": "boolean" },
12570
- { "name": "flush", "type": "boolean" },
12571
- { "name": "flushX", "type": "boolean" },
12572
- { "name": "flushY", "type": "boolean" },
12573
- { "name": "flushFooter", "type": "boolean" },
12574
- { "name": "transparent", "type": "boolean" },
12575
- { "name": "shadow", "type": "boolean" }
12576
- ],
12577
- "events": [
12578
- {
12579
- "name": "zn-language-change",
12580
- "description": "Emitted when the active language changes. Detail: `{ language: string }`."
12581
- }
12582
- ]
12583
- }
12584
- },
12585
12585
  {
12586
12586
  "name": "zn-vertical-stepper",
12587
12587
  "description": "Vertical steppers display a sequence of steps in a vertical layout with descriptions and optional icons.\n---\n\n\n### **Slots:**\n - **icon** - Optional slot for adding an icon or indicator before the step content.\n\n### **CSS Parts:**\n - **vs** - The main container for the vertical stepper.\n- **vs__left** - The left section containing the icon and connecting line.\n- **vs__icon** - The icon container.\n- **vs__line** - The vertical connecting line between steps.\n- **vs__right** - The right section containing caption and description text.\n- **vs__caption** - The caption/title text element.\n- **vs__description** - The description text element.",