@hotosm/ui 0.2.0-b4 → 0.2.0-b6

package/components/icons.js

@@ -1,78 +0,0 @@
-//
-// Bundled icons hardcoded into hotosm/ui.
-// They are a subset of used Shoelace icons (which use Bootstrap icons)
-//
-import { registerIconLibrary } from '@shoelace-style/shoelace/dist/utilities/icon-library.js';
-const icons = {
-    list: `
-    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-list" viewBox="0 0 16 16">
-      <path fill-rule="evenodd" d="M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5z"/>
-    </svg>
-  `,
-    'info-circle': `
-    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-info-circle" viewBox="0 0 16 16">
-      <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
-      <path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/>
-    </svg>
-  `,
-    'arrow-counterclockwise': `
-    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-counterclockwise" viewBox="0 0 16 16">
-      <path fill-rule="evenodd" d="M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2v1z"/>
-      <path d="M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466z"/>
-    </svg>
-  `,
-    'arrow-clockwise': `
-    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-clockwise" viewBox="0 0 16 16">
-      <path fill-rule="evenodd" d="M8 3a5 5 0 1 0 4.546 2.914.5.5 0 0 1 .908-.417A6 6 0 1 1 8 2v1z"/>
-      <path d="M8 4.466V.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384L8.41 4.658A.25.25 0 0 1 8 4.466z"/>
-    </svg>
-  `,
-    'type-bold': `
-    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-bold" viewBox="0 0 16 16">
-      <path d="M8.21 13c2.106 0 3.412-1.087 3.412-2.823 0-1.306-.984-2.283-2.324-2.386v-.055a2.176 2.176 0 0 0 1.852-2.14c0-1.51-1.162-2.46-3.014-2.46H3.843V13H8.21zM5.908 4.674h1.696c.963 0 1.517.451 1.517 1.244 0 .834-.629 1.32-1.73 1.32H5.908V4.673zm0 6.788V8.598h1.73c1.217 0 1.88.492 1.88 1.415 0 .943-.643 1.449-1.832 1.449H5.907z"/>
-    </svg>
-  `,
-    'type-italic': `
-    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-italic" viewBox="0 0 16 16">
-      <path d="M7.991 11.674 9.53 4.455c.123-.595.246-.71 1.347-.807l.11-.52H7.211l-.11.52c1.06.096 1.128.212 1.005.807L6.57 11.674c-.123.595-.246.71-1.346.806l-.11.52h3.774l.11-.52c-1.06-.095-1.129-.211-1.006-.806z"/>
-    </svg>
-  `,
-    'type-underline': `
-    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-underline" viewBox="0 0 16 16">
-      <path d="M5.313 3.136h-1.23V9.54c0 2.105 1.47 3.623 3.917 3.623s3.917-1.518 3.917-3.623V3.136h-1.23v6.323c0 1.49-.978 2.57-2.687 2.57-1.709 0-2.687-1.08-2.687-2.57V3.136zM12.5 15h-9v-1h9v1z"/>
-    </svg>
-  `,
-    'justify-left': `
-    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-justify-left" viewBox="0 0 16 16">
-      <path fill-rule="evenodd" d="M2 12.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
-    </svg>
-  `,
-    justify: `
-    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-justify" viewBox="0 0 16 16">
-      <path fill-rule="evenodd" d="M2 12.5a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
-    </svg>
-  `,
-    'justify-right': `
-    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-justify-right" viewBox="0 0 16 16">
-      <path fill-rule="evenodd" d="M6 12.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-4-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
-    </svg>
-  `,
-    'person-circle': `
-    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-person-circle" viewBox="0 0 16 16">
-      <path d="M11 6a3 3 0 1 1-6 0 3 3 0 0 1 6 0z"/>
-      <path fill-rule="evenodd" d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8zm8-7a7 7 0 0 0-5.468 11.37C3.242 11.226 4.805 10 8 10s4.757 1.225 5.468 2.37A7 7 0 0 0 8 1z"/>
-    </svg>  
-  `
-};
-const libraryResolver = (name) => {
-    if (name in icons) {
-        return `data:image/svg+xml,${encodeURIComponent(icons[name])}`;
-    }
-    return '';
-};
-function registerBundledIcons() {
-    registerIconLibrary('bundled', {
-        resolver: libraryResolver,
-    });
-}
-export default registerBundledIcons;

package/components/index.d.ts

@@ -1,127 +0,0 @@
-import SlAlert from '@shoelace-style/shoelace/dist/components/alert/alert.component.js';
-import SlAnimatedImage from '@shoelace-style/shoelace/dist/components/animated-image/animated-image.component.js';
-import SlAnimation from '@shoelace-style/shoelace/dist/components/animation/animation.component.js';
-import SlAvatar from '@shoelace-style/shoelace/dist/components/avatar/avatar.component.js';
-import SlBadge from '@shoelace-style/shoelace/dist/components/badge/badge.component.js';
-import SlBreadcrumb from '@shoelace-style/shoelace/dist/components/breadcrumb/breadcrumb.component.js';
-import SlBreadcrumbItem from '@shoelace-style/shoelace/dist/components/breadcrumb-item/breadcrumb-item.component.js';
-import SlButton from '@shoelace-style/shoelace/dist/components/button/button.component.js';
-import SlButtonGroup from '@shoelace-style/shoelace/dist/components/button-group/button-group.component.js';
-import SlCard from '@shoelace-style/shoelace/dist/components/card/card.component.js';
-import SlCarousel from '@shoelace-style/shoelace/dist/components/carousel/carousel.component.js';
-import SlCarouselItem from '@shoelace-style/shoelace/dist/components/carousel-item/carousel-item.component.js';
-import SlCheckbox from '@shoelace-style/shoelace/dist/components/checkbox/checkbox.component.js';
-import SlColorPicker from '@shoelace-style/shoelace/dist/components/color-picker/color-picker.component.js';
-import SlCopyButton from '@shoelace-style/shoelace/dist/components/copy-button/copy-button.component.js';
-import SlDetails from '@shoelace-style/shoelace/dist/components/details/details.component.js';
-import SlDialog from '@shoelace-style/shoelace/dist/components/dialog/dialog.component.js';
-import SlDivider from '@shoelace-style/shoelace/dist/components/divider/divider.component.js';
-import SlDrawer from '@shoelace-style/shoelace/dist/components/drawer/drawer.component.js';
-import SlDropdown from '@shoelace-style/shoelace/dist/components/dropdown/dropdown.component.js';
-import SlFormatBytes from '@shoelace-style/shoelace/dist/components/format-bytes/format-bytes.component.js';
-import SlFormatDate from '@shoelace-style/shoelace/dist/components/format-date/format-date.component.js';
-import SlFormatNumber from '@shoelace-style/shoelace/dist/components/format-number/format-number.component.js';
-import SlIcon from '@shoelace-style/shoelace/dist/components/icon/icon.component.js';
-import SlIconButton from '@shoelace-style/shoelace/dist/components/icon-button/icon-button.component.js';
-import SlImageComparer from '@shoelace-style/shoelace/dist/components/image-comparer/image-comparer.component.js';
-import SlInclude from '@shoelace-style/shoelace/dist/components/include/include.component.js';
-import SlInput from '@shoelace-style/shoelace/dist/components/input/input.component.js';
-import SlMenu from '@shoelace-style/shoelace/dist/components/menu/menu.component.js';
-import SlMenuItem from '@shoelace-style/shoelace/dist/components/menu-item/menu-item.component.js';
-import SlMenuLabel from '@shoelace-style/shoelace/dist/components/menu-label/menu-label.component.js';
-import SlMutationObserver from '@shoelace-style/shoelace/dist/components/mutation-observer/mutation-observer.component.js';
-import SlOption from '@shoelace-style/shoelace/dist/components/option/option.component.js';
-import SlPopup from '@shoelace-style/shoelace/dist/components/popup/popup.component.js';
-import SlProgressBar from '@shoelace-style/shoelace/dist/components/progress-bar/progress-bar.component.js';
-import SlProgressRing from '@shoelace-style/shoelace/dist/components/progress-ring/progress-ring.component.js';
-import SlQRCode from '@shoelace-style/shoelace/dist/components/qr-code/qr-code.component.js';
-import SlRadio from '@shoelace-style/shoelace/dist/components/radio/radio.component.js';
-import SlRadioButton from '@shoelace-style/shoelace/dist/components/radio-button/radio-button.component.js';
-import SlRadioGroup from '@shoelace-style/shoelace/dist/components/radio-group/radio-group.component.js';
-import SlRange from '@shoelace-style/shoelace/dist/components/range/range.component.js';
-import SlRating from '@shoelace-style/shoelace/dist/components/rating/rating.component.js';
-import SlRelativeTime from '@shoelace-style/shoelace/dist/components/relative-time/relative-time.component.js';
-import SlResizeObserver from '@shoelace-style/shoelace/dist/components/resize-observer/resize-observer.component.js';
-import SlSelect from '@shoelace-style/shoelace/dist/components/select/select.component.js';
-import SlSkeleton from '@shoelace-style/shoelace/dist/components/skeleton/skeleton.component.js';
-import SlSpinner from '@shoelace-style/shoelace/dist/components/spinner/spinner.component.js';
-import SlSplitPanel from '@shoelace-style/shoelace/dist/components/split-panel/split-panel.component.js';
-import SlSwitch from '@shoelace-style/shoelace/dist/components/switch/switch.component.js';
-import SlTab from '@shoelace-style/shoelace/dist/components/tab/tab.component.js';
-import SlTabGroup from '@shoelace-style/shoelace/dist/components/tab-group/tab-group.component.js';
-import SlTabPanel from '@shoelace-style/shoelace/dist/components/tab-panel/tab-panel.component.js';
-import SlTag from '@shoelace-style/shoelace/dist/components/tag/tag.component.js';
-import SlTextarea from '@shoelace-style/shoelace/dist/components/textarea/textarea.component.js';
-import SlTooltip from '@shoelace-style/shoelace/dist/components/tooltip/tooltip.component.js';
-import SlTree from '@shoelace-style/shoelace/dist/components/tree/tree.component.js';
-import SlTreeItem from '@shoelace-style/shoelace/dist/components/tree-item/tree-item.component.js';
-import SlVisuallyHidden from '@shoelace-style/shoelace/dist/components/visually-hidden/visually-hidden.component.js';
-import HotHeader from './header/header';
-import HotToolbar from './toolbar/toolbar';
-import HotTracking from './tracking/tracking';
-declare global {
-    interface HTMLElementTagNameMap {
-        'hot-alert': SlAlert;
-        'hot-animated-image': SlAnimatedImage;
-        'hot-animation': SlAnimation;
-        'hot-avatar': SlAvatar;
-        'hot-badge': SlBadge;
-        'hot-breadcrumb': SlBreadcrumb;
-        'hot-breadcrumb-item': SlBreadcrumbItem;
-        'hot-button': SlButton;
-        'hot-button-group': SlButtonGroup;
-        'hot-card': SlCard;
-        'hot-carousel': SlCarousel;
-        'hot-carousel-item': SlCarouselItem;
-        'hot-checkbox': SlCheckbox;
-        'hot-color-picker': SlColorPicker;
-        'hot-copy-button': SlCopyButton;
-        'hot-details': SlDetails;
-        'hot-dialog': SlDialog;
-        'hot-divider': SlDivider;
-        'hot-drawer': SlDrawer;
-        'hot-dropdown': SlDropdown;
-        'hot-format-bytes': SlFormatBytes;
-        'hot-format-date': SlFormatDate;
-        'hot-format-number': SlFormatNumber;
-        'hot-icon': SlIcon;
-        'hot-icon-button': SlIconButton;
-        'hot-image-comparer': SlImageComparer;
-        'hot-include': SlInclude;
-        'hot-input': SlInput;
-        'hot-menu': SlMenu;
-        'hot-menu-item': SlMenuItem;
-        'hot-menu-label': SlMenuLabel;
-        'hot-mutation-observer': SlMutationObserver;
-        'hot-option': SlOption;
-        'hot-popup': SlPopup;
-        'hot-progress-bar': SlProgressBar;
-        'hot-progress-ring': SlProgressRing;
-        'hot-qrcode': SlQRCode;
-        'hot-radio': SlRadio;
-        'hot-radio-button': SlRadioButton;
-        'hot-radio-group': SlRadioGroup;
-        'hot-range': SlRange;
-        'hot-rating': SlRating;
-        'hot-relative-time': SlRelativeTime;
-        'hot-resize-observer': SlResizeObserver;
-        'hot-select': SlSelect;
-        'hot-skeleton': SlSkeleton;
-        'hot-spinner': SlSpinner;
-        'hot-split-panel': SlSplitPanel;
-        'hot-switch': SlSwitch;
-        'hot-tab': SlTab;
-        'hot-tab-group': SlTabGroup;
-        'hot-tab-panel': SlTabPanel;
-        'hot-tag': SlTag;
-        'hot-textarea': SlTextarea;
-        'hot-tooltip': SlTooltip;
-        'hot-tree': SlTree;
-        'hot-tree-item': SlTreeItem;
-        'hot-visually-hidden': SlVisuallyHidden;
-        'hot-header': HotHeader;
-        'hot-toolbar': HotToolbar;
-        'hot-tracking': HotTracking;
-    }
-}
-export { SlAlert, SlAnimatedImage, SlAnimation, SlAvatar, SlBadge, SlBreadcrumb, SlBreadcrumbItem, SlButton, SlButtonGroup, SlCard, SlCarousel, SlCarouselItem, SlCheckbox, SlColorPicker, SlCopyButton, SlDetails, SlDialog, SlDivider, SlDrawer, SlDropdown, SlFormatBytes, SlFormatDate, SlFormatNumber, SlIcon, SlIconButton, SlImageComparer, SlInclude, SlInput, SlMenu, SlMenuItem, SlMenuLabel, SlMutationObserver, SlOption, SlPopup, SlProgressBar, SlProgressRing, SlQRCode, SlRadio, SlRadioButton, SlRadioGroup, SlRange, SlRating, SlRelativeTime, SlResizeObserver, SlSelect, SlSkeleton, SlSpinner, SlSplitPanel, SlSwitch, SlTab, SlTabGroup, SlTabPanel, SlTag, SlTextarea, SlTooltip, SlTree, SlTreeItem, SlVisuallyHidden, HotHeader, HotToolbar, HotTracking, };

package/components/index.js

@@ -1,127 +0,0 @@
-// Index to import all components together
-// import '@hotosm/ui/components';
-// Default Shoelace exports
-import SlAlert from '@shoelace-style/shoelace/dist/components/alert/alert.component.js';
-import SlAnimatedImage from '@shoelace-style/shoelace/dist/components/animated-image/animated-image.component.js';
-import SlAnimation from '@shoelace-style/shoelace/dist/components/animation/animation.component.js';
-import SlAvatar from '@shoelace-style/shoelace/dist/components/avatar/avatar.component.js';
-import SlBadge from '@shoelace-style/shoelace/dist/components/badge/badge.component.js';
-import SlBreadcrumb from '@shoelace-style/shoelace/dist/components/breadcrumb/breadcrumb.component.js';
-import SlBreadcrumbItem from '@shoelace-style/shoelace/dist/components/breadcrumb-item/breadcrumb-item.component.js';
-import SlButton from '@shoelace-style/shoelace/dist/components/button/button.component.js';
-import SlButtonGroup from '@shoelace-style/shoelace/dist/components/button-group/button-group.component.js';
-import SlCard from '@shoelace-style/shoelace/dist/components/card/card.component.js';
-import SlCarousel from '@shoelace-style/shoelace/dist/components/carousel/carousel.component.js';
-import SlCarouselItem from '@shoelace-style/shoelace/dist/components/carousel-item/carousel-item.component.js';
-import SlCheckbox from '@shoelace-style/shoelace/dist/components/checkbox/checkbox.component.js';
-import SlColorPicker from '@shoelace-style/shoelace/dist/components/color-picker/color-picker.component.js';
-import SlCopyButton from '@shoelace-style/shoelace/dist/components/copy-button/copy-button.component.js';
-import SlDetails from '@shoelace-style/shoelace/dist/components/details/details.component.js';
-import SlDialog from '@shoelace-style/shoelace/dist/components/dialog/dialog.component.js';
-import SlDivider from '@shoelace-style/shoelace/dist/components/divider/divider.component.js';
-import SlDrawer from '@shoelace-style/shoelace/dist/components/drawer/drawer.component.js';
-import SlDropdown from '@shoelace-style/shoelace/dist/components/dropdown/dropdown.component.js';
-import SlFormatBytes from '@shoelace-style/shoelace/dist/components/format-bytes/format-bytes.component.js';
-import SlFormatDate from '@shoelace-style/shoelace/dist/components/format-date/format-date.component.js';
-import SlFormatNumber from '@shoelace-style/shoelace/dist/components/format-number/format-number.component.js';
-import SlIcon from '@shoelace-style/shoelace/dist/components/icon/icon.component.js';
-import SlIconButton from '@shoelace-style/shoelace/dist/components/icon-button/icon-button.component.js';
-import SlImageComparer from '@shoelace-style/shoelace/dist/components/image-comparer/image-comparer.component.js';
-import SlInclude from '@shoelace-style/shoelace/dist/components/include/include.component.js';
-import SlInput from '@shoelace-style/shoelace/dist/components/input/input.component.js';
-import SlMenu from '@shoelace-style/shoelace/dist/components/menu/menu.component.js';
-import SlMenuItem from '@shoelace-style/shoelace/dist/components/menu-item/menu-item.component.js';
-import SlMenuLabel from '@shoelace-style/shoelace/dist/components/menu-label/menu-label.component.js';
-import SlMutationObserver from '@shoelace-style/shoelace/dist/components/mutation-observer/mutation-observer.component.js';
-import SlOption from '@shoelace-style/shoelace/dist/components/option/option.component.js';
-import SlPopup from '@shoelace-style/shoelace/dist/components/popup/popup.component.js';
-import SlProgressBar from '@shoelace-style/shoelace/dist/components/progress-bar/progress-bar.component.js';
-import SlProgressRing from '@shoelace-style/shoelace/dist/components/progress-ring/progress-ring.component.js';
-import SlQRCode from '@shoelace-style/shoelace/dist/components/qr-code/qr-code.component.js';
-import SlRadio from '@shoelace-style/shoelace/dist/components/radio/radio.component.js';
-import SlRadioButton from '@shoelace-style/shoelace/dist/components/radio-button/radio-button.component.js';
-import SlRadioGroup from '@shoelace-style/shoelace/dist/components/radio-group/radio-group.component.js';
-import SlRange from '@shoelace-style/shoelace/dist/components/range/range.component.js';
-import SlRating from '@shoelace-style/shoelace/dist/components/rating/rating.component.js';
-import SlRelativeTime from '@shoelace-style/shoelace/dist/components/relative-time/relative-time.component.js';
-import SlResizeObserver from '@shoelace-style/shoelace/dist/components/resize-observer/resize-observer.component.js';
-import SlSelect from '@shoelace-style/shoelace/dist/components/select/select.component.js';
-import SlSkeleton from '@shoelace-style/shoelace/dist/components/skeleton/skeleton.component.js';
-import SlSpinner from '@shoelace-style/shoelace/dist/components/spinner/spinner.component.js';
-import SlSplitPanel from '@shoelace-style/shoelace/dist/components/split-panel/split-panel.component.js';
-import SlSwitch from '@shoelace-style/shoelace/dist/components/switch/switch.component.js';
-import SlTab from '@shoelace-style/shoelace/dist/components/tab/tab.component.js';
-import SlTabGroup from '@shoelace-style/shoelace/dist/components/tab-group/tab-group.component.js';
-import SlTabPanel from '@shoelace-style/shoelace/dist/components/tab-panel/tab-panel.component.js';
-import SlTag from '@shoelace-style/shoelace/dist/components/tag/tag.component.js';
-import SlTextarea from '@shoelace-style/shoelace/dist/components/textarea/textarea.component.js';
-import SlTooltip from '@shoelace-style/shoelace/dist/components/tooltip/tooltip.component.js';
-import SlTree from '@shoelace-style/shoelace/dist/components/tree/tree.component.js';
-import SlTreeItem from '@shoelace-style/shoelace/dist/components/tree-item/tree-item.component.js';
-import SlVisuallyHidden from '@shoelace-style/shoelace/dist/components/visually-hidden/visually-hidden.component.js';
-// Custom composite components
-import HotHeader from './header/header';
-import HotToolbar from './toolbar/toolbar';
-import HotTracking from './tracking/tracking';
-// Define web component names for Shoelace components
-SlAlert.define('hot-alert');
-SlAnimatedImage.define('hot-animated-image');
-SlAnimation.define('hot-animation');
-SlAvatar.define('hot-avatar');
-SlBadge.define('hot-badge');
-SlBreadcrumb.define('hot-breadcrumb');
-SlBreadcrumbItem.define('hot-breadcrumb-item');
-SlButton.define('hot-button');
-SlButtonGroup.define('hot-button-group');
-SlCard.define('hot-card');
-SlCarousel.define('hot-carousel');
-SlCarouselItem.define('hot-carousel-item');
-SlCheckbox.define('hot-checkbox');
-SlColorPicker.define('hot-color-picker');
-SlCopyButton.define('hot-copy-button');
-SlDetails.define('hot-details');
-SlDialog.define('hot-dialog');
-SlDivider.define('hot-divider');
-SlDrawer.define('hot-drawer');
-SlDropdown.define('hot-dropdown');
-SlFormatBytes.define('hot-format-bytes');
-SlFormatDate.define('hot-format-date');
-SlFormatNumber.define('hot-format-number');
-SlIcon.define('hot-icon');
-SlIconButton.define('hot-icon-button');
-SlImageComparer.define('hot-image-comparer');
-SlInclude.define('hot-include');
-SlInput.define('hot-input');
-SlMenu.define('hot-menu');
-SlMenuItem.define('hot-menu-item');
-SlMenuLabel.define('hot-menu-label');
-SlMutationObserver.define('hot-mutation-observer');
-SlOption.define('hot-option');
-SlPopup.define('hot-popup');
-SlProgressBar.define('hot-progress-bar');
-SlProgressRing.define('hot-progress-ring');
-SlQRCode.define('hot-qr-code');
-SlRadio.define('hot-radio');
-SlRadioButton.define('hot-radio-button');
-SlRadioGroup.define('hot-radio-group');
-SlRange.define('hot-range');
-SlRating.define('hot-rating');
-SlRelativeTime.define('hot-relative-time');
-SlResizeObserver.define('hot-resize-observer');
-SlSelect.define('hot-select');
-SlSkeleton.define('hot-skeleton');
-SlSpinner.define('hot-spinner');
-SlSplitPanel.define('hot-split-panel');
-SlSwitch.define('hot-switch');
-SlTab.define('hot-tab');
-SlTabGroup.define('hot-tab-group');
-SlTabPanel.define('hot-tab-panel');
-SlTag.define('hot-tag');
-SlTextarea.define('hot-textarea');
-SlTooltip.define('hot-tooltip');
-SlTree.define('hot-tree');
-SlTreeItem.define('hot-tree-item');
-SlVisuallyHidden.define('hot-visually-hidden');
-export { SlAlert, SlAnimatedImage, SlAnimation, SlAvatar, SlBadge, SlBreadcrumb, SlBreadcrumbItem, SlButton, SlButtonGroup, SlCard, SlCarousel, SlCarouselItem, SlCheckbox, SlColorPicker, SlCopyButton, SlDetails, SlDialog, SlDivider, SlDrawer, SlDropdown, SlFormatBytes, SlFormatDate, SlFormatNumber, SlIcon, SlIconButton, SlImageComparer, SlInclude, SlInput, SlMenu, SlMenuItem, SlMenuLabel, SlMutationObserver, SlOption, SlPopup, SlProgressBar, SlProgressRing, SlQRCode, SlRadio, SlRadioButton, SlRadioGroup, SlRange, SlRating, SlRelativeTime, SlResizeObserver, SlSelect, SlSkeleton, SlSpinner, SlSplitPanel, SlSwitch, SlTab, SlTabGroup, SlTabPanel, SlTag, SlTextarea, SlTooltip, SlTree, SlTreeItem, SlVisuallyHidden, 
-// Custom composite components
-HotHeader, HotToolbar, HotTracking, };

package/components/toolbar/toolbar.d.ts

@@ -1,24 +0,0 @@
-import "../../theme/sl-custom.css";
-import '@shoelace-style/shoelace/dist/components/button/button.js';
-import '@shoelace-style/shoelace/dist/components/button-group/button-group.js';
-import '@shoelace-style/shoelace/dist/components/icon/icon.js';
-import '@shoelace-style/shoelace/dist/components/tooltip/tooltip.js';
-import { LitElement } from "lit";
-export declare class Toolbar extends LitElement {
-    name: string;
-    /** Change the position of the tooltips relative to buttons. */
-    tooltipPosition: string;
-    static styles: import("lit").CSSResult[];
-    protected render(): import("lit").TemplateResult<1>;
-    private renderButtonGroup;
-    private renderButton;
-    private readonly undo;
-    private readonly redo;
-    private readonly bold;
-    private readonly italic;
-    private readonly underline;
-    private readonly alignLeft;
-    private readonly alignCenter;
-    private readonly alignRight;
-}
-export default Toolbar;

package/components/toolbar/toolbar.js

@@ -1,121 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import "../../theme/sl-custom.css";
-import '@shoelace-style/shoelace/dist/components/button/button.js';
-import '@shoelace-style/shoelace/dist/components/button-group/button-group.js';
-import '@shoelace-style/shoelace/dist/components/icon/icon.js';
-import '@shoelace-style/shoelace/dist/components/tooltip/tooltip.js';
-import { LitElement, css, html } from "lit";
-import { property } from "lit/decorators.js";
-import registerBundledIcons from '../../components/icons';
-registerBundledIcons();
-// import { cva } from "class-variance-authority";
-// const toolbarStyle = cva(
-//   "some-css-var",
-//   {
-//     variants: {
-//       someProperty: {
-//         true: "some-css-var",
-//         false: "some-css-var",
-//       },
-//     },
-//   },
-// );
-export class Toolbar extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.name = "hot-toolbar";
-        /** Change the position of the tooltips relative to buttons. */
-        this.tooltipPosition = "top";
-        this.undo = (e) => {
-            // As the original event is also named 'click'
-            // stop propagation of the original event
-            e.stopPropagation();
-            this.dispatchEvent(new Event("undo"));
-        };
-        this.redo = (e) => {
-            e.stopPropagation();
-            this.dispatchEvent(new Event("redo"));
-        };
-        this.bold = (e) => {
-            e.stopPropagation();
-            this.dispatchEvent(new Event("bold"));
-        };
-        this.italic = (e) => {
-            e.stopPropagation();
-            this.dispatchEvent(new Event("italic"));
-        };
-        this.underline = (e) => {
-            e.stopPropagation();
-            this.dispatchEvent(new Event("underline"));
-        };
-        this.alignLeft = (e) => {
-            e.stopPropagation();
-            this.dispatchEvent(new Event("leftalign"));
-        };
-        this.alignCenter = (e) => {
-            e.stopPropagation();
-            this.dispatchEvent(new Event("centeralign"));
-        };
-        this.alignRight = (e) => {
-            e.stopPropagation();
-            this.dispatchEvent(new Event("rightalign"));
-        };
-    }
-    // class=${toolbarStyle({
-    //   someProperty: this.someProperty,
-    // })}
-    render() {
-        return html `
-      <div class="button-group-toolbar">
-        ${this.renderButtonGroup('History', [
-            { content: 'Undo', icon: 'arrow-counterclockwise', label: 'Undo', action: this.undo },
-            { content: 'Redo', icon: 'arrow-clockwise', label: 'Redo', action: this.redo }
-        ])}
-        ${this.renderButtonGroup('Formatting', [
-            { content: 'Bold', icon: 'type-bold', label: 'Bold', action: this.bold },
-            { content: 'Italic', icon: 'type-italic', label: 'Italic', action: this.italic },
-            { content: 'Underline', icon: 'type-underline', label: 'Underline', action: this.underline }
-        ])}
-        ${this.renderButtonGroup('Alignment', [
-            { content: 'Align Left', icon: 'justify-left', label: 'Align Left', action: this.alignLeft },
-            { content: 'Align Center', icon: 'justify', label: 'Align Center', action: this.alignCenter },
-            { content: 'Align Right', icon: 'justify-right', label: 'Align Right', action: this.alignRight }
-        ])}
-      </div>
-    `;
-    }
-    renderButtonGroup(label, buttons) {
-        return html `
-      <sl-button-group label=${label}>
-        ${buttons.map(button => this.renderButton(button))}
-      </sl-button-group>
-    `;
-    }
-    renderButton({ content, icon, label, action }) {
-        return html `
-      <sl-tooltip content=${content} placement="${this.tooltipPosition}">
-        <sl-button @click=${action ?? (() => { })}><sl-icon library="bundled" name=${icon} label=${label}></sl-icon></sl-button>
-      </sl-tooltip>
-    `;
-    }
-}
-Toolbar.styles = [
-    css `
-      @unocss-placeholder;
-    `,
-    // unsafeCSS(reset),
-];
-__decorate([
-    property()
-], Toolbar.prototype, "name", void 0);
-__decorate([
-    property({ type: String, attribute: "tooltip-position" })
-], Toolbar.prototype, "tooltipPosition", void 0);
-export default Toolbar;
-// Define web component
-customElements.define("hot-toolbar", Toolbar);

package/components/tracking/tracking.js

@@ -1,164 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import "../../theme/sl-custom.css";
-import '@shoelace-style/shoelace/dist/components/alert/alert.js';
-import { LitElement, css, html } from "lit";
-import { property, state } from "lit/decorators.js";
-import registerBundledIcons from '../../components/icons';
-registerBundledIcons();
-export class Tracking extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.name = "hot-tracking";
-        /** The Matomo site id for tracking. */
-        this.siteId = "";
-        /** The domains to apply tracking. */
-        this.domain = "";
-        /** Force display the banner. */
-        this.force = false;
-        this.isOpen = true;
-    }
-    render() {
-        return html `<sl-alert
-      variant="danger"
-      ?open=${this.isOpen}
-    >
-    <sl-icon id="hot-red-text" library="bundled" slot="icon" name="info-circle"></sl-icon>
-
-    <p id="tracking-header">
-    About the information we collect
-    </p>
-
-    <p>
-    We use cookies and similar technologies to recognize and analyze your visits,
-    and measure traffic usage and activity. You can learn about how we use the data
-    about your visit or information you provide reading our
-      <a
-        style="color: #d63f3f;"
-        href="https://www.hotosm.org/privacy"
-        target="_blank"
-        rel="noopener noreferrer"
-      >privacy policy</a>.
-    By clicking "I Agree", you consent to the use of cookies.
-    </p>
-
-    <sl-button @click=${(e) => { this._setAgree(e); }}>I Agree</sl-button>
-    <sl-button @click=${(e) => { this._setDisagree(e); }}>I Do Not Agree</sl-button>
-    </sl-alert>`;
-    }
-    _setAgree(_e) {
-        // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
-        const _paq = (window._paq = window._paq || []);
-        if (_paq.length === 0)
-            return;
-        _paq.push(['rememberConsentGiven']);
-        this.isOpen = false;
-        localStorage.setItem(`${this.siteId}-matomo-agree`, 'true');
-        this.dispatchEvent(new Event('agree', { bubbles: true, composed: true }));
-    }
-    _setDisagree(_e) {
-        // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
-        const _paq = (window._paq = window._paq || []);
-        if (_paq.length === 0)
-            return;
-        _paq.push(['forgetConsentGiven']);
-        this.isOpen = false;
-        localStorage.setItem(`${this.siteId}-matomo-agree`, 'false');
-        this.dispatchEvent(new Event('disagree', { bubbles: true, composed: true }));
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        // Close and halt execution if wrong domain
-        if (!this.force && window.location.hostname !== this.domain) {
-            console.warn(`Matomo init failed. ${window.location.hostname} does not match ${this.domain}.`);
-            this.isOpen = false;
-            return;
-        }
-        const matomoTrackingId = this.siteId;
-        // Close and halt execution if siteId or domain not set
-        if (!this.force && (matomoTrackingId.length === 0 || this.domain.length === 0)) {
-            console.warn('Matomo init failed. No site id or domains provided.');
-            this.isOpen = false;
-            return;
-        }
-        // Close and halt execution if already disagreed
-        const consent = localStorage.getItem(`${this.siteId}-matomo-agree`);
-        if (consent === 'false') {
-            this.isOpen = false;
-            return;
-        }
-        // Close prompt only if already agreed, continue
-        if (consent === 'true') {
-            this.isOpen = false;
-        }
-        console.log(`Setting Matomo tracking for site=${matomoTrackingId} domain=${this.domain}`);
-        // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
-        const _paq = (window._paq = window._paq || []);
-        // tracker methods like "setCustomDimension" should be called before "trackPageView"
-        _paq.push(['requireConsent']);
-        _paq.push(['setDomains', [this.domain]]);
-        _paq.push(['trackPageView']);
-        _paq.push(['enableLinkTracking']); // Tracks downloads
-        _paq.push(['trackVisibleContentImpressions']); // Tracks content
-        (function () {
-            const u = '//matomo.hotosm.org/';
-            _paq.push(['setTrackerUrl', u + 'matomo.php']);
-            _paq.push(['setSiteId', matomoTrackingId]);
-            const d = document;
-            const g = d.createElement('script');
-            const s = d.getElementsByTagName('script')[0];
-            if (s?.parentNode != null) {
-                g.async = true;
-                g.src = u + 'matomo.js';
-                s.parentNode.insertBefore(g, s);
-            }
-            else {
-                console.warn('Script insertion failed. Parent node is null.');
-            }
-        })();
-    }
-}
-Tracking.styles = [
-    css `
-      @unocss-placeholder;
-    `,
-    // Temp styles until UnoCSS setup
-    css `
-      #tracking-header {
-        font-weight: var(--sl-font-weight-bold);
-        font-size: var(--sl-font-size-large);
-        text-align: center;
-      }
-      sl-alert::part(base) {
-        position: absolute;
-        bottom: 20px;
-        left: 50%;
-        transform: translateX(-50%);
-        z-index: 1000;
-        width: 80vw;
-        text-align: center;
-      }
-    `
-];
-__decorate([
-    property()
-], Tracking.prototype, "name", void 0);
-__decorate([
-    property({ type: String, attribute: "site-id" })
-], Tracking.prototype, "siteId", void 0);
-__decorate([
-    property({ type: String })
-], Tracking.prototype, "domain", void 0);
-__decorate([
-    property({ type: Boolean })
-], Tracking.prototype, "force", void 0);
-__decorate([
-    state()
-], Tracking.prototype, "isOpen", void 0);
-export default Tracking;
-// Define web component
-customElements.define("hot-tracking", Tracking);