@nextcloud/vue
Version:
Nextcloud vue components
215 lines (214 loc) • 6.55 kB
JavaScript
import { r as register, w as t24, a as t, x as t40 } from "./_l10n-DDKxBWQL.mjs";
import { getTimezoneManager as getTimezoneManager$1 } from "@nextcloud/timezones";
import { G as GenRandomId } from "./GenRandomId-CMooMQt0.mjs";
import { N as NcSelect } from "./NcSelect-BQ-NFBXI.mjs";
import { u as useModelMigration } from "./useModelMigration-EhAWvqDD.mjs";
import { n as normalizeComponent } from "./_plugin-vue2_normalizer-DU4iP6Vu.mjs";
register(t24);
function getSortedTimezoneList(timezoneList = [], additionalTimezones = []) {
const sortedByContinent = {};
const sortedList = [];
for (const timezoneId of timezoneList) {
const components = timezoneId.split("/");
let [continent, name] = [components.shift(), components.join("/")];
if (!name) {
name = continent;
continent = t("Global");
}
sortedByContinent[continent] = sortedByContinent[continent] || {
continent,
regions: []
};
sortedByContinent[continent].regions.push({
label: getReadableTimezoneName(name),
cities: [],
timezoneId
});
}
for (const additionalTimezone of additionalTimezones) {
const { continent, label, timezoneId } = additionalTimezone;
sortedByContinent[continent] = sortedByContinent[continent] || {
continent,
regions: []
};
sortedByContinent[continent].regions.push({
label,
cities: [],
timezoneId
});
}
for (const continent in sortedByContinent) {
if (!Object.prototype.hasOwnProperty.call(sortedByContinent, continent)) {
continue;
}
sortedByContinent[continent].regions.sort((a, b) => {
if (a.label < b.label) {
return -1;
}
return 1;
});
sortedList.push(sortedByContinent[continent]);
}
sortedList.sort((a, b) => {
if (a.continent < b.continent) {
return -1;
}
return 1;
});
return sortedList;
}
function getReadableTimezoneName(timezoneId) {
return timezoneId.split("_").join(" ").replace("St ", "St. ").split("/").join(" - ");
}
const timezoneManager = getTimezoneManager$1();
let initialized = false;
function getTimezoneManager() {
if (!initialized) {
timezoneManager.registerDefaultTimezones();
initialized = true;
}
return timezoneManager;
}
register(t40);
const _sfc_main = {
name: "NcTimezonePicker",
components: {
NcSelect
},
model: {
prop: "modelValue",
event: "update:modelValue"
},
props: {
/**
* An array of additional timezones to include with the standard database. Useful if there is a custom timezone, e.g. read from user data
*/
additionalTimezones: {
type: Array,
default: () => []
},
/**
* Removed in v9 - use `modelValue` (`v-model`) instead
* @deprecated
*/
value: {
type: String,
default: void 0
},
/**
* The selected timezone. Use v-model for two-way binding. The default timezone is floating, which means a time independent of timezone. See https://icalendar.org/CalDAV-Access-RFC-4791/7-3-date-and-floating-time.html for details.
*/
modelValue: {
type: String,
default: "floating"
},
/**
* ID of the inner vue-select element, can be used for labels like: `vs-${uid}__combobox`
*/
uid: {
type: [String, Number],
default: () => `tz-${GenRandomId(5)}`
}
},
emits: [
/**
* Removed in v9 - use `update:modelValue` (`v-model`) instead
* @deprecated
*/
"input",
/**
* Two-way binding of the value prop. Use v-model="selectedTimezone" for two-way binding
*/
"update:modelValue",
/** Same as update:modelValue for Vue 2 compatibility */
"update:model-value"
],
setup() {
const model = useModelMigration("value", "input");
return {
model
};
},
computed: {
placeholder() {
return t("Type to search time zone");
},
selectedTimezone() {
for (const additionalTimezone of this.additionalTimezones) {
if (additionalTimezone.timezoneId === this.model) {
return additionalTimezone;
}
}
return {
label: getReadableTimezoneName(this.model),
timezoneId: this.model
};
},
options() {
const timezoneManager2 = getTimezoneManager();
const timezoneList = getSortedTimezoneList(timezoneManager2.listAllTimezones(), this.additionalTimezones);
let timezonesGrouped = [];
Object.values(timezoneList).forEach((group) => {
timezonesGrouped = timezonesGrouped.concat(group.regions);
});
return timezonesGrouped;
}
},
methods: {
t,
change(newValue) {
if (!newValue) {
return;
}
this.model = newValue.timezoneId;
},
/**
* Returns whether this is a continent label,
* or an actual timezone. Continent labels are not selectable.
*
* @param {string} option The option
* @return {boolean}
*/
isSelectable(option) {
return !option.timezoneId.startsWith("tz-group__");
},
/**
* Function to filter the timezone list.
* We search in the timezoneId, so both continent and region names can be matched.
*
* @param {object} option The timezone option
* @param {string} label The label of the timezone
* @param {string} search The search string
* @return {boolean}
*/
filterBy(option, label, search) {
const terms = search.trim().split(" ");
if (option.timezoneId.startsWith("tz-group__")) {
return option.regions.some((region) => {
return this.matchTimezoneId(region.timezoneId, terms);
});
}
return this.matchTimezoneId(option.timezoneId, terms);
},
matchTimezoneId(timezoneId, terms) {
return terms.every((term) => timezoneId.toLowerCase().includes(term.toLowerCase()));
}
}
};
var _sfc_render = function render() {
var _vm = this, _c = _vm._self._c;
return _c("NcSelect", { attrs: { "aria-label-combobox": _vm.t("Search for time zone"), "clearable": false, "filter-by": _vm.filterBy, "multiple": false, "options": _vm.options, "placeholder": _vm.placeholder, "selectable": _vm.isSelectable, "uid": _vm.uid, "value": _vm.selectedTimezone, "label": "label" }, on: { "option:selected": _vm.change } });
};
var _sfc_staticRenderFns = [];
var __component__ = /* @__PURE__ */ normalizeComponent(
_sfc_main,
_sfc_render,
_sfc_staticRenderFns,
false,
null,
null
);
const NcTimezonePicker = __component__.exports;
export {
NcTimezonePicker as N
};