@keenthemes/ktui 1.0.16 → 1.0.17
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/dist/ktui.js +26 -13
- package/dist/ktui.min.js +1 -1
- package/dist/ktui.min.js.map +1 -1
- package/dist/styles.css +8 -0
- package/lib/cjs/components/select/config.js +1 -1
- package/lib/cjs/components/select/config.js.map +1 -1
- package/lib/cjs/components/select/option.js +2 -0
- package/lib/cjs/components/select/option.js.map +1 -1
- package/lib/cjs/components/select/search.js +1 -1
- package/lib/cjs/components/select/search.js.map +1 -1
- package/lib/cjs/components/select/select.js +2 -2
- package/lib/cjs/components/select/select.js.map +1 -1
- package/lib/cjs/components/select/templates.js +20 -9
- package/lib/cjs/components/select/templates.js.map +1 -1
- package/lib/esm/components/select/config.js +1 -1
- package/lib/esm/components/select/config.js.map +1 -1
- package/lib/esm/components/select/option.js +2 -0
- package/lib/esm/components/select/option.js.map +1 -1
- package/lib/esm/components/select/search.js +1 -1
- package/lib/esm/components/select/search.js.map +1 -1
- package/lib/esm/components/select/select.js +2 -2
- package/lib/esm/components/select/select.js.map +1 -1
- package/lib/esm/components/select/templates.js +20 -9
- package/lib/esm/components/select/templates.js.map +1 -1
- package/package.json +1 -1
- package/src/components/select/config.ts +4 -3
- package/src/components/select/option.ts +2 -0
- package/src/components/select/search.ts +1 -1
- package/src/components/select/select.css +5 -1
- package/src/components/select/select.ts +2 -2
- package/src/components/select/templates.ts +21 -9
package/dist/ktui.js
CHANGED
|
@@ -5685,6 +5685,8 @@ var KTSelectOption = /** @class */ (function (_super) {
|
|
|
5685
5685
|
if (_this._globalConfig) {
|
|
5686
5686
|
_this._globalConfig.optionsConfig = _this._globalConfig.optionsConfig || {};
|
|
5687
5687
|
_this._globalConfig.optionsConfig[element.value] = _this._config;
|
|
5688
|
+
// console.log('[KTSelectOption] Populating _globalConfig.optionsConfig for value', (element as HTMLInputElement).value, 'with:', JSON.parse(JSON.stringify(this._config)));
|
|
5689
|
+
// console.log('[KTSelectOption] _globalConfig.optionsConfig is now:', JSON.parse(JSON.stringify(this._globalConfig.optionsConfig)));
|
|
5688
5690
|
}
|
|
5689
5691
|
else {
|
|
5690
5692
|
// Handle case where _globalConfig might be undefined, though constructor expects it.
|
|
@@ -10193,7 +10195,7 @@ var KTSelectSearch = /** @class */ (function () {
|
|
|
10193
10195
|
KTSelectSearch.prototype._showNoResultsMessage = function () {
|
|
10194
10196
|
this._clearNoResultsMessage();
|
|
10195
10197
|
var config = this._select.getConfig();
|
|
10196
|
-
this._noResultsElement = templates_1.defaultTemplates.
|
|
10198
|
+
this._noResultsElement = templates_1.defaultTemplates.searchEmpty(config);
|
|
10197
10199
|
var dropdownElement = this._select.getDropdownElement();
|
|
10198
10200
|
var optionsContainer = dropdownElement.querySelector('[data-kt-select-options]');
|
|
10199
10201
|
if (optionsContainer) {
|
|
@@ -11495,7 +11497,7 @@ var KTSelect = /** @class */ (function (_super) {
|
|
|
11495
11497
|
optionsContainer.appendChild(templates_1.defaultTemplates.loading(this._config, message || 'Loading...'));
|
|
11496
11498
|
break;
|
|
11497
11499
|
case 'empty':
|
|
11498
|
-
optionsContainer.appendChild(templates_1.defaultTemplates.
|
|
11500
|
+
optionsContainer.appendChild(templates_1.defaultTemplates.searchEmpty(this._config));
|
|
11499
11501
|
break;
|
|
11500
11502
|
}
|
|
11501
11503
|
};
|
|
@@ -12563,7 +12565,7 @@ var KTSelect = /** @class */ (function (_super) {
|
|
|
12563
12565
|
optionsContainer.innerHTML = '';
|
|
12564
12566
|
if (items.length === 0) {
|
|
12565
12567
|
// Show no results message using template for consistency and customization
|
|
12566
|
-
var noResultsElement = templates_1.defaultTemplates.
|
|
12568
|
+
var noResultsElement = templates_1.defaultTemplates.searchEmpty(this._config);
|
|
12567
12569
|
optionsContainer.appendChild(noResultsElement);
|
|
12568
12570
|
return;
|
|
12569
12571
|
}
|
|
@@ -16141,7 +16143,7 @@ exports.coreTemplateStrings = {
|
|
|
16141
16143
|
display: "\n\t\t<div data-kt-select-display class=\"kt-select-display {{class}}\" tabindex=\"{{tabindex}}\" role=\"button\" data-selected=\"0\" aria-haspopup=\"listbox\" aria-expanded=\"false\" aria-label=\"{{label}}\" {{disabled}}>\n\t\t\t<div class=\"kt-select-option-text\" data-kt-text-container=\"true\">{{text}}</div>\n\t\t</div>\n\t",
|
|
16142
16144
|
option: "\n\t\t<li data-kt-select-option data-value=\"{{value}}\" data-text=\"{{text}}\" class=\"kt-select-option {{class}}\" role=\"option\" {{selected}} {{disabled}}>\n\t\t\t<div class=\"kt-select-option-text\" data-kt-text-container=\"true\">{{text}}</div><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"size-3.5 ms-auto hidden text-primary kt-select-option-selected:block\"><path d=\"M20 6 9 17l-5-5\"/></svg>\n\t\t</li>\n\t",
|
|
16143
16145
|
search: "<div data-kt-select-search class=\"kt-select-search {{class}}\"><input type=\"text\" data-kt-select-search=\"true\" placeholder=\"{{searchPlaceholder}}\" class=\"kt-input kt-input-ghost\" role=\"searchbox\" aria-label=\"{{searchPlaceholder}}\"/></div>",
|
|
16144
|
-
|
|
16146
|
+
searchEmpty: "<div data-kt-select-search-empty class=\"kt-select-search-empty {{class}}\"></div>",
|
|
16145
16147
|
loading: "<li class=\"kt-select-loading {{class}}\" role=\"status\" aria-live=\"polite\"></li>",
|
|
16146
16148
|
tag: "<div data-kt-select-tag=\"true\" class=\"kt-select-tag {{class}}\"></div>",
|
|
16147
16149
|
loadMore: "<li class=\"kt-select-load-more {{class}}\" data-kt-select-load-more=\"true\"></li>",
|
|
@@ -16276,7 +16278,7 @@ exports.defaultTemplates = {
|
|
|
16276
16278
|
* Renders a single option
|
|
16277
16279
|
*/
|
|
16278
16280
|
option: function (option, config) {
|
|
16279
|
-
var _a, _b;
|
|
16281
|
+
var _a, _b, _c;
|
|
16280
16282
|
var isHtmlOption = option instanceof HTMLOptionElement;
|
|
16281
16283
|
var optionData;
|
|
16282
16284
|
if (isHtmlOption) {
|
|
@@ -16291,7 +16293,7 @@ exports.defaultTemplates = {
|
|
|
16291
16293
|
// which should have the getOptionDataForTemplate method.
|
|
16292
16294
|
optionData = option.getOptionDataForTemplate();
|
|
16293
16295
|
}
|
|
16294
|
-
var content = optionData.text; // Default content to option's text
|
|
16296
|
+
var content = (_b = optionData === null || optionData === void 0 ? void 0 : optionData.text) === null || _b === void 0 ? void 0 : _b.trim(); // Default content to option's text
|
|
16295
16297
|
if (config.optionTemplate) {
|
|
16296
16298
|
// Use the user-provided template string, rendering with the full optionData.
|
|
16297
16299
|
// renderTemplateString will replace {{key}} with values from optionData.
|
|
@@ -16317,7 +16319,7 @@ exports.defaultTemplates = {
|
|
|
16317
16319
|
element.innerHTML = content;
|
|
16318
16320
|
}
|
|
16319
16321
|
// Ensure data-text attribute is set to the original, clean text for searching/filtering
|
|
16320
|
-
element.setAttribute('data-text', ((
|
|
16322
|
+
element.setAttribute('data-text', ((_c = optionData === null || optionData === void 0 ? void 0 : optionData.text) === null || _c === void 0 ? void 0 : _c.trim()) || '');
|
|
16321
16323
|
return element;
|
|
16322
16324
|
},
|
|
16323
16325
|
/**
|
|
@@ -16332,11 +16334,22 @@ exports.defaultTemplates = {
|
|
|
16332
16334
|
/**
|
|
16333
16335
|
* Renders the no results message
|
|
16334
16336
|
*/
|
|
16335
|
-
|
|
16336
|
-
var html = getTemplateStrings(config).
|
|
16337
|
-
var
|
|
16338
|
-
|
|
16339
|
-
|
|
16337
|
+
searchEmpty: function (config) {
|
|
16338
|
+
var html = getTemplateStrings(config).searchEmpty.replace('{{class}}', config.searchEmptyClass || '');
|
|
16339
|
+
var content = config.searchEmpty || 'No results';
|
|
16340
|
+
if (config.searchEmptyTemplate) {
|
|
16341
|
+
content = (0, utils_1.renderTemplateString)(config.searchEmptyTemplate, {
|
|
16342
|
+
class: config.searchEmptyClass || '',
|
|
16343
|
+
});
|
|
16344
|
+
var element = stringToElement(html);
|
|
16345
|
+
element.innerHTML = content; // For templates, content can be HTML
|
|
16346
|
+
return element;
|
|
16347
|
+
}
|
|
16348
|
+
else {
|
|
16349
|
+
var element = stringToElement(html);
|
|
16350
|
+
element.textContent = content; // For simple text, use textContent
|
|
16351
|
+
return element;
|
|
16352
|
+
}
|
|
16340
16353
|
},
|
|
16341
16354
|
/**
|
|
16342
16355
|
* Renders the loading state
|
|
@@ -17564,7 +17577,7 @@ exports.DefaultConfig = {
|
|
|
17564
17577
|
searchAutofocus: true, // Autofocus on search input when dropdown opens
|
|
17565
17578
|
searchMinLength: 0, // Minimum characters required to trigger search
|
|
17566
17579
|
searchMaxItems: 50, // Maximum number of search results to display
|
|
17567
|
-
|
|
17580
|
+
searchEmpty: 'No results', // Text to display when no search results are found
|
|
17568
17581
|
clearSearchOnClose: true, // Clear search input when dropdown closes
|
|
17569
17582
|
// Multi-Select Display
|
|
17570
17583
|
selectAllText: 'Select all', // Text for the "Select All" option (if implemented)
|