@vielzeug/codex 26.10.4 → 26.10.5

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.
package/data/refine.json CHANGED
@@ -7926,555 +7926,555 @@
7926
7926
  }
7927
7927
  ]
7928
7928
  },
7929
+ {
7930
+ "kind": "function",
7931
+ "name": "formatBytes",
7932
+ "return": {
7933
+ "type": {
7934
+ "text": "string"
7935
+ }
7936
+ },
7937
+ "parameters": [
7938
+ {
7939
+ "name": "bytes",
7940
+ "type": {
7941
+ "text": "number"
7942
+ }
7943
+ }
7944
+ ]
7945
+ },
7946
+ {
7947
+ "kind": "function",
7948
+ "name": "createFileQueue",
7949
+ "return": {
7950
+ "type": {
7951
+ "text": "FileQueue"
7952
+ }
7953
+ },
7954
+ "parameters": [
7955
+ {
7956
+ "name": "options",
7957
+ "type": {
7958
+ "text": "FileQueueOptions"
7959
+ }
7960
+ }
7961
+ ],
7962
+ "description": "Owns file selection *and* the opt-in upload lifecycle together: they were never really\nseparable (adding a file starts its upload; removing one must abort it; replacing one is both\nat once). Independent of `html`/rendering, following the same shape as `datagrid`'s\n`createDataGridControls` and `combobox`'s `combobox-options.ts`: a factory `file-input.ts`\nwires into drag/drop/native-input events and the template, directly unit-testable without\nmounting a component.\n\nEvery file-level rule (accept, max-size, max-files, disabled) and every upload-lifecycle rule\n(progress, retry-from-offset, per-file isolation) lives here in one place."
7963
+ },
7929
7964
  {
7930
7965
  "kind": "variable",
7931
- "name": "INPUT_TAG",
7966
+ "name": "FILE_INPUT_TAG",
7932
7967
  "type": {
7933
- "text": "'ore-input'"
7968
+ "text": "'ore-file-input'"
7934
7969
  },
7935
- "default": "'ore-input'",
7936
- "description": "A customizable text input component with multiple variants, label placements, and form features."
7970
+ "default": "'ore-file-input'",
7971
+ "description": "A file upload field with drag-and-drop support, built-in validation messaging, and: once a\n`upload` transport is wired up: a full per-file upload lifecycle: live progress/speed/ETA,\nretry-on-failure, a success confirmation card, and fully independent handling of concurrent\nfiles (one failing never blocks or cancels the others). Picking files with no `upload` set\nkeeps the original, upload-free selection-only behavior."
7937
7972
  },
7938
7973
  {
7939
7974
  "kind": "class",
7940
- "name": "OreInputElement",
7941
- "tagName": "ore-input",
7975
+ "name": "OreFileInputElement",
7976
+ "tagName": "ore-file-input",
7942
7977
  "customElement": true,
7943
- "description": "A customizable text input component with multiple variants, label placements, and form features.",
7978
+ "description": "A file upload field with drag-and-drop support, built-in validation messaging, and: once a\n`upload` transport is wired up: a full per-file upload lifecycle: live progress/speed/ETA,\nretry-on-failure, a success confirmation card, and fully independent handling of concurrent\nfiles (one failing never blocks or cancels the others). Picking files with no `upload` set\nkeeps the original, upload-free selection-only behavior.",
7944
7979
  "summary": "",
7945
7980
  "attributes": [
7946
7981
  {
7947
- "name": "aria-label",
7982
+ "name": "accept",
7948
7983
  "type": {
7949
7984
  "text": "string"
7950
7985
  },
7951
- "description": "Accessible name used when no visible label is rendered"
7986
+ "description": "Comma-separated file extensions or MIME types"
7952
7987
  },
7953
7988
  {
7954
- "name": "label",
7989
+ "name": "multiple",
7955
7990
  "type": {
7956
- "text": "string"
7991
+ "text": "boolean"
7957
7992
  },
7958
- "description": "Label text"
7993
+ "description": "Enable multiple files selection"
7959
7994
  },
7960
7995
  {
7961
- "name": "label-placement",
7996
+ "name": "gallery",
7962
7997
  "type": {
7963
- "text": "'inset' | 'outside'"
7998
+ "text": "boolean"
7964
7999
  },
7965
- "description": "Label placement: 'inset' | 'outside'"
8000
+ "description": "Show selected files as an image thumbnail/preview grid"
7966
8001
  },
7967
8002
  {
7968
- "name": "type",
8003
+ "name": "max-files",
7969
8004
  "type": {
7970
- "text": "'text' | 'email' | 'password' | 'number' | 'tel' | 'url' | 'search'"
8005
+ "text": "number"
7971
8006
  },
7972
- "description": "HTML input type: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url' | 'search'"
8007
+ "description": "Max number of files allowed"
7973
8008
  },
7974
8009
  {
7975
- "name": "value",
8010
+ "name": "max-size",
7976
8011
  "type": {
7977
- "text": "string"
8012
+ "text": "number"
7978
8013
  },
7979
- "description": "Current input value"
8014
+ "description": "Max size of each file in bytes"
7980
8015
  },
7981
8016
  {
7982
- "name": "placeholder",
8017
+ "name": "disabled",
7983
8018
  "type": {
7984
- "text": "string"
8019
+ "text": "boolean"
7985
8020
  },
7986
- "description": "Placeholder text"
8021
+ "description": "Disable interaction"
7987
8022
  },
7988
8023
  {
7989
- "name": "name",
8024
+ "name": "error",
7990
8025
  "type": {
7991
8026
  "text": "string"
7992
8027
  },
7993
- "description": "Form field name"
8028
+ "description": "Show an error state/message"
7994
8029
  },
7995
8030
  {
7996
8031
  "name": "helper",
7997
8032
  "type": {
7998
8033
  "text": "string"
7999
8034
  },
8000
- "description": "Helper text displayed below the input (fallback when the `helper` slot is empty)"
8035
+ "description": "Provide helper context below the dropzone"
8001
8036
  },
8002
8037
  {
8003
- "name": "error",
8038
+ "name": "browse-label",
8004
8039
  "type": {
8005
8040
  "text": "string"
8006
8041
  },
8007
- "description": "Error message: marks the field as invalid (fallback when the `error` slot is empty)"
8042
+ "description": "Action half of the dropzone line (default 'click to browse')"
8008
8043
  },
8009
8044
  {
8010
- "name": "disabled",
8045
+ "name": "dropzone-label",
8011
8046
  "type": {
8012
- "text": "boolean"
8047
+ "text": "string"
8013
8048
  },
8014
- "description": "Disable input interaction"
8049
+ "description": "Main half of the dropzone line (default 'Drop files here or')"
8015
8050
  },
8016
8051
  {
8017
- "name": "readonly",
8052
+ "name": "dropzone-active-label",
8018
8053
  "type": {
8019
- "text": "boolean"
8054
+ "text": "string"
8020
8055
  },
8021
- "description": "Make the input read-only"
8056
+ "description": "Dropzone line while a drag is active (default 'Release to upload')"
8022
8057
  },
8023
8058
  {
8024
- "name": "required",
8059
+ "name": "dropzone-hint",
8025
8060
  "type": {
8026
- "text": "boolean"
8061
+ "text": "string"
8027
8062
  },
8028
- "description": "Mark the field as required"
8063
+ "description": "Replace the auto-generated accept/max-size hint with this text"
8029
8064
  },
8030
8065
  {
8031
- "name": "loading",
8066
+ "name": "files-label",
8032
8067
  "type": {
8033
- "text": "boolean"
8068
+ "text": "string"
8034
8069
  },
8035
- "description": "Show an inline spinner and force the field disabled"
8036
- },
8070
+ "description": "Accessible name of the selected-files list (default 'Selected files')"
8071
+ }
8072
+ ],
8073
+ "events": [
8037
8074
  {
8038
- "name": "success",
8075
+ "name": "change",
8076
+ "description": "detail: { files: File[], value: File[] }",
8039
8077
  "type": {
8040
- "text": "boolean"
8041
- },
8042
- "description": "Show an inline success check icon (suppressed while `error` is set)"
8078
+ "text": "CustomEvent"
8079
+ }
8043
8080
  },
8044
8081
  {
8045
- "name": "color",
8082
+ "name": "remove",
8083
+ "description": "detail: { file: File, files: File[] }",
8046
8084
  "type": {
8047
- "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
8048
- },
8049
- "description": "Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
8085
+ "text": "CustomEvent"
8086
+ }
8050
8087
  },
8051
8088
  {
8052
- "name": "variant",
8089
+ "name": "reject",
8090
+ "description": "detail: { files: File[], reasons: ('size' | 'type')[] }: nothing was added",
8053
8091
  "type": {
8054
- "text": "'solid' | 'flat' | 'bordered' | 'outline' | 'ghost' | 'text'"
8055
- },
8056
- "description": "Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost' | 'text'"
8092
+ "text": "CustomEvent"
8093
+ }
8057
8094
  },
8058
8095
  {
8059
- "name": "size",
8096
+ "name": "upload-progress",
8097
+ "description": "detail: { file: File, loaded: number, total: number }",
8060
8098
  "type": {
8061
- "text": "'sm' | 'md' | 'lg'"
8062
- },
8063
- "description": "Input size: 'sm' | 'md' | 'lg'"
8099
+ "text": "CustomEvent"
8100
+ }
8064
8101
  },
8065
8102
  {
8066
- "name": "rounded",
8067
- "type": {
8068
- "text": "'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'"
8069
- },
8070
- "description": "Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'"
8071
- }
8072
- ],
8073
- "events": [
8074
- {
8075
- "name": "input",
8076
- "description": "Emitted when input value changes (on every keystroke).",
8103
+ "name": "upload-success",
8104
+ "description": "detail: { file: File }",
8077
8105
  "type": {
8078
8106
  "text": "CustomEvent"
8079
8107
  }
8080
8108
  },
8081
8109
  {
8082
- "name": "change",
8083
- "description": "Emitted when input loses focus with changed value.",
8110
+ "name": "upload-error",
8111
+ "description": "detail: { file: File, error: unknown }",
8084
8112
  "type": {
8085
8113
  "text": "CustomEvent"
8086
8114
  }
8087
8115
  }
8088
8116
  ],
8089
- "slots": [
8090
- {
8091
- "name": "prefix",
8092
- "description": "Content before the input (e.g., icons)"
8093
- },
8094
- {
8095
- "name": "suffix",
8096
- "description": "Content after the input (e.g., clear button, validation icon)"
8097
- },
8098
- {
8099
- "name": "label",
8100
- "description": "Replaces the label text: slotted content takes precedence over the `label` prop"
8101
- },
8102
- {
8103
- "name": "helper",
8104
- "description": "Replaces the helper text: slotted content takes precedence over the `helper` prop"
8105
- },
8106
- {
8107
- "name": "error",
8108
- "description": "Replaces the error text: slotted content takes precedence over the `error` prop"
8109
- }
8110
- ],
8111
8117
  "cssParts": [
8112
8118
  {
8113
8119
  "name": "wrapper",
8114
- "description": "The input wrapper element"
8120
+ "description": "Root wrapper around the file input field"
8115
8121
  },
8116
8122
  {
8117
8123
  "name": "label",
8118
- "description": "The label element (inset or outside)"
8119
- },
8120
- {
8121
- "name": "field",
8122
- "description": "The field container element"
8124
+ "description": "Visible label rendered above the dropzone"
8123
8125
  },
8124
8126
  {
8125
- "name": "input-row",
8126
- "description": "The input row container element"
8127
+ "name": "dropzone",
8128
+ "description": "Interactive drag-and-drop target"
8127
8129
  },
8128
8130
  {
8129
8131
  "name": "input",
8130
- "description": "The input element"
8132
+ "description": "Native file input element"
8131
8133
  },
8132
8134
  {
8133
- "name": "status-icon",
8134
- "description": "The inline error/success icon shown inside the field"
8135
+ "name": "gallery",
8136
+ "description": "Gallery grid container (rendered instead of `file-list` when `gallery` is set)"
8135
8137
  },
8136
8138
  {
8137
- "name": "spinner",
8138
- "description": "The inline loading spinner shown inside the field while `loading`"
8139
+ "name": "helper",
8140
+ "description": "Helper text shown beneath the dropzone"
8139
8141
  },
8140
8142
  {
8141
- "name": "helper",
8142
- "description": "The helper text element"
8143
+ "name": "error",
8144
+ "description": "Error message shown beneath the field"
8143
8145
  }
8144
8146
  ],
8145
8147
  "cssProperties": [
8146
8148
  {
8147
- "name": "--input-bg",
8148
- "description": "Background color"
8149
- },
8150
- {
8151
- "name": "--input-color",
8152
- "description": "Text color"
8153
- },
8154
- {
8155
- "name": "--input-border-color",
8156
- "description": "Border color"
8157
- },
8158
- {
8159
- "name": "--input-placeholder-color",
8160
- "description": "Placeholder text color"
8161
- },
8162
- {
8163
- "name": "--input-radius",
8164
- "description": "Border radius"
8165
- },
8166
- {
8167
- "name": "--input-padding",
8168
- "description": "Inner padding (block inline)"
8149
+ "name": "--file-input-bg",
8150
+ "description": "Dropzone background color"
8169
8151
  },
8170
8152
  {
8171
- "name": "--input-label-block-inset",
8172
- "description": "Inset from the field block start for an inset label"
8153
+ "name": "--file-input-border-color",
8154
+ "description": "Dropzone border color"
8173
8155
  },
8174
8156
  {
8175
- "name": "--input-label-inset",
8176
- "description": "Inset from the field inline start for an inset label"
8157
+ "name": "--file-input-font-size",
8158
+ "description": "Font size"
8177
8159
  },
8178
8160
  {
8179
- "name": "--input-gap",
8180
- "description": "Gap between prefix/suffix icons and input text"
8161
+ "name": "--file-input-radius",
8162
+ "description": "Dropzone border radius"
8181
8163
  },
8182
8164
  {
8183
- "name": "--input-font-size",
8184
- "description": "Font size"
8165
+ "name": "--file-input-min-height",
8166
+ "description": "Minimum dropzone height"
8185
8167
  },
8186
8168
  {
8187
- "name": "--input-height",
8188
- "description": "Field height"
8169
+ "name": "--file-input-hover-bg",
8170
+ "description": "Dropzone background on hover (flat/ghost variants)"
8189
8171
  },
8190
8172
  {
8191
- "name": "--input-hover-bg",
8192
- "description": "Field background on hover (flat/ghost variants)"
8173
+ "name": "--file-input-hover-border-color",
8174
+ "description": "Dropzone border on hover (flat/bordered variants)"
8193
8175
  },
8194
8176
  {
8195
- "name": "--input-hover-border-color",
8196
- "description": "Field border on hover (flat/bordered variants)"
8177
+ "name": "--file-input-focus-bg",
8178
+ "description": "Dropzone background when focused/drag-over (flat variant)"
8197
8179
  },
8198
8180
  {
8199
- "name": "--input-focus-bg",
8200
- "description": "Field background when focused (flat variant)"
8181
+ "name": "--file-input-focus-border-color",
8182
+ "description": "Dropzone border when focused/drag-over (flat variant)"
8201
8183
  },
8202
8184
  {
8203
- "name": "--input-focus-border-color",
8204
- "description": "Field border when focused (flat/text variants)"
8185
+ "name": "--file-input-thumb-size",
8186
+ "description": "Gallery thumbnail width/height"
8205
8187
  }
8206
8188
  ],
8207
8189
  "demos": [
8208
8190
  {
8209
8191
  "url": "",
8210
- "description": "```html\n<ore-input type=\"email\" label=\"Email\" placeholder=\"you@example.com\" />\n<ore-input label=\"Name\" variant=\"bordered\" color=\"primary\" />\n<ore-input label=\"Username\" error=\"That username is taken\" />\n<ore-input label=\"Username\" success />\n<ore-input label=\"Username\" loading />\n```"
8211
- }
8212
- ]
8213
- },
8214
- {
8215
- "kind": "function",
8216
- "name": "formatBytes",
8217
- "return": {
8218
- "type": {
8219
- "text": "string"
8220
- }
8221
- },
8222
- "parameters": [
8223
- {
8224
- "name": "bytes",
8225
- "type": {
8226
- "text": "number"
8227
- }
8192
+ "description": "```html\n<ore-file-input label=\"Upload files\" accept=\"image/*\" multiple />\n<ore-file-input label=\"Photos\" accept=\"image/*\" multiple gallery />\n<ore-file-input label=\"Resume\" accept=\".pdf,.doc,.docx\" max-size=\"5242880\" />\n<ore-file-input variant=\"bordered\" color=\"primary\" />\n```\n```ts\n// Wire up a real upload transport: progress/retry/success are then handled automatically.\n// `XMLHttpRequest` is used here (not `fetch`) because it's the only browser API that reports\n// upload progress; swap in whatever transport the app already uses.\nconst input = document.querySelector('ore-file-input');\ninput.upload = (file, { onProgress, signal, resumeFrom }) =>\n new Promise((resolve, reject) => {\n const xhr = new XMLHttpRequest();\n xhr.upload.addEventListener('progress', (e) => onProgress(resumeFrom + e.loaded, file.size));\n xhr.addEventListener('load', () => (xhr.status < 400 ? resolve() : reject(new Error(xhr.statusText))));\n xhr.addEventListener('error', () => reject(new Error('Network error')));\n signal.addEventListener('abort', () => xhr.abort());\n xhr.open('PUT', '/uploads');\n if (resumeFrom > 0) xhr.setRequestHeader('Content-Range', `bytes ${resumeFrom}-/${file.size}`);\n xhr.send(file);\n });\n```"
8228
8193
  }
8229
8194
  ]
8230
8195
  },
8231
- {
8232
- "kind": "function",
8233
- "name": "createFileQueue",
8234
- "return": {
8235
- "type": {
8236
- "text": "FileQueue"
8237
- }
8238
- },
8239
- "parameters": [
8240
- {
8241
- "name": "options",
8242
- "type": {
8243
- "text": "FileQueueOptions"
8244
- }
8245
- }
8246
- ],
8247
- "description": "Owns file selection *and* the opt-in upload lifecycle together: they were never really\nseparable (adding a file starts its upload; removing one must abort it; replacing one is both\nat once). Independent of `html`/rendering, following the same shape as `datagrid`'s\n`createDataGridControls` and `combobox`'s `combobox-options.ts`: a factory `file-input.ts`\nwires into drag/drop/native-input events and the template, directly unit-testable without\nmounting a component.\n\nEvery file-level rule (accept, max-size, max-files, disabled) and every upload-lifecycle rule\n(progress, retry-from-offset, per-file isolation) lives here in one place."
8248
- },
8249
8196
  {
8250
8197
  "kind": "variable",
8251
- "name": "FILE_INPUT_TAG",
8198
+ "name": "INPUT_TAG",
8252
8199
  "type": {
8253
- "text": "'ore-file-input'"
8200
+ "text": "'ore-input'"
8254
8201
  },
8255
- "default": "'ore-file-input'",
8256
- "description": "A file upload field with drag-and-drop support, built-in validation messaging, and: once a\n`upload` transport is wired up: a full per-file upload lifecycle: live progress/speed/ETA,\nretry-on-failure, a success confirmation card, and fully independent handling of concurrent\nfiles (one failing never blocks or cancels the others). Picking files with no `upload` set\nkeeps the original, upload-free selection-only behavior."
8202
+ "default": "'ore-input'",
8203
+ "description": "A customizable text input component with multiple variants, label placements, and form features."
8257
8204
  },
8258
8205
  {
8259
8206
  "kind": "class",
8260
- "name": "OreFileInputElement",
8261
- "tagName": "ore-file-input",
8207
+ "name": "OreInputElement",
8208
+ "tagName": "ore-input",
8262
8209
  "customElement": true,
8263
- "description": "A file upload field with drag-and-drop support, built-in validation messaging, and: once a\n`upload` transport is wired up: a full per-file upload lifecycle: live progress/speed/ETA,\nretry-on-failure, a success confirmation card, and fully independent handling of concurrent\nfiles (one failing never blocks or cancels the others). Picking files with no `upload` set\nkeeps the original, upload-free selection-only behavior.",
8210
+ "description": "A customizable text input component with multiple variants, label placements, and form features.",
8264
8211
  "summary": "",
8265
8212
  "attributes": [
8266
8213
  {
8267
- "name": "accept",
8214
+ "name": "aria-label",
8268
8215
  "type": {
8269
8216
  "text": "string"
8270
8217
  },
8271
- "description": "Comma-separated file extensions or MIME types"
8218
+ "description": "Accessible name used when no visible label is rendered"
8272
8219
  },
8273
8220
  {
8274
- "name": "multiple",
8221
+ "name": "label",
8275
8222
  "type": {
8276
- "text": "boolean"
8223
+ "text": "string"
8277
8224
  },
8278
- "description": "Enable multiple files selection"
8225
+ "description": "Label text"
8279
8226
  },
8280
8227
  {
8281
- "name": "gallery",
8228
+ "name": "label-placement",
8282
8229
  "type": {
8283
- "text": "boolean"
8230
+ "text": "'inset' | 'outside'"
8284
8231
  },
8285
- "description": "Show selected files as an image thumbnail/preview grid"
8232
+ "description": "Label placement: 'inset' | 'outside'"
8286
8233
  },
8287
8234
  {
8288
- "name": "max-files",
8235
+ "name": "type",
8289
8236
  "type": {
8290
- "text": "number"
8237
+ "text": "'text' | 'email' | 'password' | 'number' | 'tel' | 'url' | 'search'"
8291
8238
  },
8292
- "description": "Max number of files allowed"
8239
+ "description": "HTML input type: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url' | 'search'"
8293
8240
  },
8294
8241
  {
8295
- "name": "max-size",
8242
+ "name": "value",
8296
8243
  "type": {
8297
- "text": "number"
8244
+ "text": "string"
8298
8245
  },
8299
- "description": "Max size of each file in bytes"
8246
+ "description": "Current input value"
8300
8247
  },
8301
8248
  {
8302
- "name": "disabled",
8249
+ "name": "placeholder",
8303
8250
  "type": {
8304
- "text": "boolean"
8251
+ "text": "string"
8305
8252
  },
8306
- "description": "Disable interaction"
8253
+ "description": "Placeholder text"
8307
8254
  },
8308
8255
  {
8309
- "name": "error",
8256
+ "name": "name",
8310
8257
  "type": {
8311
8258
  "text": "string"
8312
8259
  },
8313
- "description": "Show an error state/message"
8260
+ "description": "Form field name"
8314
8261
  },
8315
8262
  {
8316
8263
  "name": "helper",
8317
8264
  "type": {
8318
8265
  "text": "string"
8319
8266
  },
8320
- "description": "Provide helper context below the dropzone"
8267
+ "description": "Helper text displayed below the input (fallback when the `helper` slot is empty)"
8321
8268
  },
8322
8269
  {
8323
- "name": "browse-label",
8270
+ "name": "error",
8324
8271
  "type": {
8325
8272
  "text": "string"
8326
8273
  },
8327
- "description": "Action half of the dropzone line (default 'click to browse')"
8274
+ "description": "Error message: marks the field as invalid (fallback when the `error` slot is empty)"
8328
8275
  },
8329
8276
  {
8330
- "name": "dropzone-label",
8277
+ "name": "disabled",
8331
8278
  "type": {
8332
- "text": "string"
8279
+ "text": "boolean"
8333
8280
  },
8334
- "description": "Main half of the dropzone line (default 'Drop files here or')"
8281
+ "description": "Disable input interaction"
8335
8282
  },
8336
8283
  {
8337
- "name": "dropzone-active-label",
8284
+ "name": "readonly",
8338
8285
  "type": {
8339
- "text": "string"
8286
+ "text": "boolean"
8340
8287
  },
8341
- "description": "Dropzone line while a drag is active (default 'Release to upload')"
8288
+ "description": "Make the input read-only"
8342
8289
  },
8343
8290
  {
8344
- "name": "dropzone-hint",
8291
+ "name": "required",
8345
8292
  "type": {
8346
- "text": "string"
8293
+ "text": "boolean"
8347
8294
  },
8348
- "description": "Replace the auto-generated accept/max-size hint with this text"
8295
+ "description": "Mark the field as required"
8349
8296
  },
8350
8297
  {
8351
- "name": "files-label",
8298
+ "name": "loading",
8352
8299
  "type": {
8353
- "text": "string"
8300
+ "text": "boolean"
8354
8301
  },
8355
- "description": "Accessible name of the selected-files list (default 'Selected files')"
8356
- }
8357
- ],
8358
- "events": [
8302
+ "description": "Show an inline spinner and force the field disabled"
8303
+ },
8359
8304
  {
8360
- "name": "change",
8361
- "description": "detail: { files: File[], value: File[] }",
8305
+ "name": "success",
8362
8306
  "type": {
8363
- "text": "CustomEvent"
8364
- }
8307
+ "text": "boolean"
8308
+ },
8309
+ "description": "Show an inline success check icon (suppressed while `error` is set)"
8365
8310
  },
8366
8311
  {
8367
- "name": "remove",
8368
- "description": "detail: { file: File, files: File[] }",
8312
+ "name": "color",
8369
8313
  "type": {
8370
- "text": "CustomEvent"
8371
- }
8314
+ "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
8315
+ },
8316
+ "description": "Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
8372
8317
  },
8373
8318
  {
8374
- "name": "reject",
8375
- "description": "detail: { files: File[], reasons: ('size' | 'type')[] }: nothing was added",
8319
+ "name": "variant",
8376
8320
  "type": {
8377
- "text": "CustomEvent"
8378
- }
8321
+ "text": "'solid' | 'flat' | 'bordered' | 'outline' | 'ghost' | 'text'"
8322
+ },
8323
+ "description": "Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost' | 'text'"
8379
8324
  },
8380
8325
  {
8381
- "name": "upload-progress",
8382
- "description": "detail: { file: File, loaded: number, total: number }",
8326
+ "name": "size",
8383
8327
  "type": {
8384
- "text": "CustomEvent"
8385
- }
8328
+ "text": "'sm' | 'md' | 'lg'"
8329
+ },
8330
+ "description": "Input size: 'sm' | 'md' | 'lg'"
8386
8331
  },
8387
8332
  {
8388
- "name": "upload-success",
8389
- "description": "detail: { file: File }",
8333
+ "name": "rounded",
8334
+ "type": {
8335
+ "text": "'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'"
8336
+ },
8337
+ "description": "Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'"
8338
+ }
8339
+ ],
8340
+ "events": [
8341
+ {
8342
+ "name": "input",
8343
+ "description": "Emitted when input value changes (on every keystroke).",
8390
8344
  "type": {
8391
8345
  "text": "CustomEvent"
8392
8346
  }
8393
8347
  },
8394
8348
  {
8395
- "name": "upload-error",
8396
- "description": "detail: { file: File, error: unknown }",
8349
+ "name": "change",
8350
+ "description": "Emitted when input loses focus with changed value.",
8397
8351
  "type": {
8398
8352
  "text": "CustomEvent"
8399
8353
  }
8400
8354
  }
8401
8355
  ],
8356
+ "slots": [
8357
+ {
8358
+ "name": "prefix",
8359
+ "description": "Content before the input (e.g., icons)"
8360
+ },
8361
+ {
8362
+ "name": "suffix",
8363
+ "description": "Content after the input (e.g., clear button, validation icon)"
8364
+ },
8365
+ {
8366
+ "name": "label",
8367
+ "description": "Replaces the label text: slotted content takes precedence over the `label` prop"
8368
+ },
8369
+ {
8370
+ "name": "helper",
8371
+ "description": "Replaces the helper text: slotted content takes precedence over the `helper` prop"
8372
+ },
8373
+ {
8374
+ "name": "error",
8375
+ "description": "Replaces the error text: slotted content takes precedence over the `error` prop"
8376
+ }
8377
+ ],
8402
8378
  "cssParts": [
8403
8379
  {
8404
8380
  "name": "wrapper",
8405
- "description": "Root wrapper around the file input field"
8381
+ "description": "The input wrapper element"
8406
8382
  },
8407
8383
  {
8408
8384
  "name": "label",
8409
- "description": "Visible label rendered above the dropzone"
8385
+ "description": "The label element (inset or outside)"
8410
8386
  },
8411
8387
  {
8412
- "name": "dropzone",
8413
- "description": "Interactive drag-and-drop target"
8388
+ "name": "field",
8389
+ "description": "The field container element"
8390
+ },
8391
+ {
8392
+ "name": "input-row",
8393
+ "description": "The input row container element"
8414
8394
  },
8415
8395
  {
8416
8396
  "name": "input",
8417
- "description": "Native file input element"
8397
+ "description": "The input element"
8418
8398
  },
8419
8399
  {
8420
- "name": "gallery",
8421
- "description": "Gallery grid container (rendered instead of `file-list` when `gallery` is set)"
8400
+ "name": "status-icon",
8401
+ "description": "The inline error/success icon shown inside the field"
8422
8402
  },
8423
8403
  {
8424
- "name": "helper",
8425
- "description": "Helper text shown beneath the dropzone"
8404
+ "name": "spinner",
8405
+ "description": "The inline loading spinner shown inside the field while `loading`"
8426
8406
  },
8427
8407
  {
8428
- "name": "error",
8429
- "description": "Error message shown beneath the field"
8408
+ "name": "helper",
8409
+ "description": "The helper text element"
8430
8410
  }
8431
8411
  ],
8432
8412
  "cssProperties": [
8433
8413
  {
8434
- "name": "--file-input-bg",
8435
- "description": "Dropzone background color"
8414
+ "name": "--input-bg",
8415
+ "description": "Background color"
8436
8416
  },
8437
8417
  {
8438
- "name": "--file-input-border-color",
8439
- "description": "Dropzone border color"
8418
+ "name": "--input-color",
8419
+ "description": "Text color"
8440
8420
  },
8441
8421
  {
8442
- "name": "--file-input-font-size",
8443
- "description": "Font size"
8422
+ "name": "--input-border-color",
8423
+ "description": "Border color"
8444
8424
  },
8445
8425
  {
8446
- "name": "--file-input-radius",
8447
- "description": "Dropzone border radius"
8426
+ "name": "--input-placeholder-color",
8427
+ "description": "Placeholder text color"
8448
8428
  },
8449
8429
  {
8450
- "name": "--file-input-min-height",
8451
- "description": "Minimum dropzone height"
8430
+ "name": "--input-radius",
8431
+ "description": "Border radius"
8452
8432
  },
8453
8433
  {
8454
- "name": "--file-input-hover-bg",
8455
- "description": "Dropzone background on hover (flat/ghost variants)"
8434
+ "name": "--input-padding",
8435
+ "description": "Inner padding (block inline)"
8456
8436
  },
8457
8437
  {
8458
- "name": "--file-input-hover-border-color",
8459
- "description": "Dropzone border on hover (flat/bordered variants)"
8438
+ "name": "--input-label-block-inset",
8439
+ "description": "Inset from the field block start for an inset label"
8460
8440
  },
8461
8441
  {
8462
- "name": "--file-input-focus-bg",
8463
- "description": "Dropzone background when focused/drag-over (flat variant)"
8442
+ "name": "--input-label-inset",
8443
+ "description": "Inset from the field inline start for an inset label"
8464
8444
  },
8465
8445
  {
8466
- "name": "--file-input-focus-border-color",
8467
- "description": "Dropzone border when focused/drag-over (flat variant)"
8446
+ "name": "--input-gap",
8447
+ "description": "Gap between prefix/suffix icons and input text"
8468
8448
  },
8469
8449
  {
8470
- "name": "--file-input-thumb-size",
8471
- "description": "Gallery thumbnail width/height"
8450
+ "name": "--input-font-size",
8451
+ "description": "Font size"
8452
+ },
8453
+ {
8454
+ "name": "--input-height",
8455
+ "description": "Field height"
8456
+ },
8457
+ {
8458
+ "name": "--input-hover-bg",
8459
+ "description": "Field background on hover (flat/ghost variants)"
8460
+ },
8461
+ {
8462
+ "name": "--input-hover-border-color",
8463
+ "description": "Field border on hover (flat/bordered variants)"
8464
+ },
8465
+ {
8466
+ "name": "--input-focus-bg",
8467
+ "description": "Field background when focused (flat variant)"
8468
+ },
8469
+ {
8470
+ "name": "--input-focus-border-color",
8471
+ "description": "Field border when focused (flat/text variants)"
8472
8472
  }
8473
8473
  ],
8474
8474
  "demos": [
8475
8475
  {
8476
8476
  "url": "",
8477
- "description": "```html\n<ore-file-input label=\"Upload files\" accept=\"image/*\" multiple />\n<ore-file-input label=\"Photos\" accept=\"image/*\" multiple gallery />\n<ore-file-input label=\"Resume\" accept=\".pdf,.doc,.docx\" max-size=\"5242880\" />\n<ore-file-input variant=\"bordered\" color=\"primary\" />\n```\n```ts\n// Wire up a real upload transport: progress/retry/success are then handled automatically.\n// `XMLHttpRequest` is used here (not `fetch`) because it's the only browser API that reports\n// upload progress; swap in whatever transport the app already uses.\nconst input = document.querySelector('ore-file-input');\ninput.upload = (file, { onProgress, signal, resumeFrom }) =>\n new Promise((resolve, reject) => {\n const xhr = new XMLHttpRequest();\n xhr.upload.addEventListener('progress', (e) => onProgress(resumeFrom + e.loaded, file.size));\n xhr.addEventListener('load', () => (xhr.status < 400 ? resolve() : reject(new Error(xhr.statusText))));\n xhr.addEventListener('error', () => reject(new Error('Network error')));\n signal.addEventListener('abort', () => xhr.abort());\n xhr.open('PUT', '/uploads');\n if (resumeFrom > 0) xhr.setRequestHeader('Content-Range', `bytes ${resumeFrom}-/${file.size}`);\n xhr.send(file);\n });\n```"
8477
+ "description": "```html\n<ore-input type=\"email\" label=\"Email\" placeholder=\"you@example.com\" />\n<ore-input label=\"Name\" variant=\"bordered\" color=\"primary\" />\n<ore-input label=\"Username\" error=\"That username is taken\" />\n<ore-input label=\"Username\" success />\n<ore-input label=\"Username\" loading />\n```"
8478
8478
  }
8479
8479
  ]
8480
8480
  },
@@ -12515,6 +12515,13 @@
12515
12515
  }
12516
12516
  ],
12517
12517
  "events": [
12518
+ {
12519
+ "name": "active-change",
12520
+ "description": "Fired when the focused row changes (keyboard, hover, typing, open, close). detail: `{ value, label, item }`; `item` is `undefined` and `value` empty when no row is active",
12521
+ "type": {
12522
+ "text": "CustomEvent"
12523
+ }
12524
+ },
12518
12525
  {
12519
12526
  "name": "open-change",
12520
12527
  "description": "Fired when the palette state changes. detail: `{ open, reason }`",
@@ -12541,6 +12548,10 @@
12541
12548
  {
12542
12549
  "name": "",
12543
12550
  "description": "`<ore-command-palette-item>` elements (alternative/supplement to the `items` prop)"
12551
+ },
12552
+ {
12553
+ "name": "preview",
12554
+ "description": "Optional detail panel rendered beside the list, shown while it has content. Pair it with `active-change` to preview the focused row"
12544
12555
  }
12545
12556
  ],
12546
12557
  "cssParts": [
@@ -12559,6 +12570,10 @@
12559
12570
  {
12560
12571
  "name": "listbox",
12561
12572
  "description": "Listbox of matching commands"
12573
+ },
12574
+ {
12575
+ "name": "preview",
12576
+ "description": "Preview panel shown beside the list"
12562
12577
  }
12563
12578
  ],
12564
12579
  "cssProperties": [
@@ -12593,6 +12608,10 @@
12593
12608
  {
12594
12609
  "name": "--command-palette-option-focus-bg",
12595
12610
  "description": "Item background when keyboard-focused"
12611
+ },
12612
+ {
12613
+ "name": "--command-palette-preview-width",
12614
+ "description": "Preview panel width when the `preview` slot has content"
12596
12615
  }
12597
12616
  ],
12598
12617
  "demos": [