mithril-materialized 3.13.0 → 3.14.0

package/dist/button.d.ts

@@ -1,4 +1,5 @@
 import m, { FactoryComponent, Attributes } from 'mithril';
+import { IconName } from './material-icon';
 import { MaterialPosition, IconClass, ButtonVariant } from './types';
 /**
  * HTML attributes that can be passed to button elements
@@ -86,3 +87,11 @@ export declare const FlatButton: m.FactoryComponent<ButtonAttrs>;
 export declare const IconButton: m.FactoryComponent<ButtonAttrs>;
 export declare const RoundIconButton: m.FactoryComponent<ButtonAttrs>;
 export declare const SubmitButton: m.FactoryComponent<ButtonAttrs>;
+export interface ConfirmButtonAttrs extends ButtonAttrs {
+    confirmIconName?: IconName;
+    confirmColor?: string;
+    timeout?: number;
+    clickDelay?: number;
+    onFirstClick?: () => void;
+}
+export declare const ConfirmButton: FactoryComponent<ConfirmButtonAttrs>;

package/dist/index.esm.js

@@ -618,6 +618,85 @@ const Icon = () => ({
     },
 });
 
+const iconPaths = {
+    caret: [
+        'M7 10l5 5 5-5z', // arrow
+        'M0 0h24v24H0z', // background
+    ],
+    close: [
+        'M18.3 5.71a1 1 0 0 0-1.41 0L12 10.59 7.11 5.7A1 1 0 0 0 5.7 7.11L10.59 12l-4.89 4.89a1 1 0 1 0 1.41 1.41L12 13.41l4.89 4.89a1 1 0 0 0 1.41-1.41L13.41 12l4.89-4.89a1 1 0 0 0 0-1.4z',
+        'M0 0h24v24H0z',
+    ],
+    chevron: [
+        'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z', // chevron down
+        'M0 0h24v24H0z', // background
+    ],
+    chevron_left: [
+        'M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z', // chevron left
+        'M0 0h24v24H0z', // background
+    ],
+    chevron_right: [
+        'M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z', // chevron right
+        'M0 0h24v24H0z', // background
+    ],
+    menu: [
+        'M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z', // hamburger menu
+        'M0 0h24v24H0z', // background
+    ],
+    expand: [
+        'M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z', // plus
+        'M0 0h24v24H0z', // background
+    ],
+    collapse: [
+        'M19 13H5v-2h14v2z', // minus
+        'M0 0h24v24H0z', // background
+    ],
+    check: [
+        'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z', // checkmark
+        'M0 0h24v24H0z', // background
+    ],
+    radio_checked: [
+        'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z', // radio button checked
+        'M0 0h24v24H0z', // background
+    ],
+    radio_unchecked: [
+        'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z', // radio button unchecked
+        'M0 0h24v24H0z', // background
+    ],
+    light_mode: [
+        'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5M2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1m18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1M11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1m0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1M5.99 4.58a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41zm12.4 12.4a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0a.996.996 0 0 0 0-1.41zm1.06-11a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0zM7.05 18.4a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0z',
+        'M0 0h24v24H0z', // background
+    ],
+    dark_mode: [
+        'M12 3a9 9 0 1 0 9 9c0-.46-.04-.92-.1-1.36a5.39 5.39 0 0 1-4.4 2.26 5.4 5.4 0 0 1-3.14-9.8c-.44-.06-.9-.1-1.36-.1z',
+        'M0 0h24v24H0z', // background
+    ],
+    delete: [
+        'M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z',
+        'M0 0h24v24H0z', // background
+    ],
+};
+const MaterialIcon = () => {
+    return {
+        view: ({ attrs }) => {
+            var _a;
+            const { name, direction = 'down', style } = attrs, props = __rest(attrs, ["name", "direction", "style"]);
+            const rotationMap = {
+                down: 0,
+                up: 180,
+                left: 90,
+                right: -90,
+            };
+            const rotation = (_a = rotationMap[direction]) !== null && _a !== void 0 ? _a : 0;
+            const transform = rotation ? `rotate(${rotation}deg)` : undefined;
+            return m('svg', Object.assign(Object.assign({}, props), { style: Object.assign({ transform }, style), height: '24px', width: '24px', viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg' }), iconPaths[name].map((d) => m('path', {
+                d,
+                fill: d.includes('M0 0h24v24H0z') ? 'none' : 'currentColor',
+            })));
+        },
+    };
+};
+
 /*!
  * Waves Effect for Mithril Materialized
  * Based on Waves v0.6.4 by Alfiana E. Sibuea
@@ -723,7 +802,7 @@ WavesEffect.onTouchEnd = (e) => {
 const ButtonFactory = (element, defaultClassNames, type = '') => {
     return () => {
         return {
-            view: ({ attrs }) => {
+            view: ({ attrs, children }) => {
                 const { tooltip, tooltipPosition, tooltipPostion, // Keep for backwards compatibility
                 iconName, iconClass, label, className, variant } = attrs, params = __rest(attrs, ["tooltip", "tooltipPosition", "tooltipPostion", "iconName", "iconClass", "label", "className", "variant"]);
                 // Use variant or fallback to factory type
@@ -739,7 +818,7 @@ const ButtonFactory = (element, defaultClassNames, type = '') => {
                     ontouchstart: WavesEffect.onTouchStart,
                     ontouchend: WavesEffect.onTouchEnd
                 } : {};
-                return m(element, Object.assign(Object.assign(Object.assign({}, params), wavesHandlers), { className: cn, 'data-position': tooltip ? position : undefined, 'data-tooltip': tooltip || undefined, type: buttonType }), iconName ? m(Icon, { iconName, className: iconClass || 'left' }) : undefined, label ? label : undefined);
+                return m(element, Object.assign(Object.assign(Object.assign({}, params), wavesHandlers), { className: cn, 'data-position': tooltip ? position : undefined, 'data-tooltip': tooltip || undefined, type: buttonType }), iconName ? m(Icon, { iconName, className: iconClass || 'left' }) : undefined, label ? label : undefined, children);
             },
         };
     };
@@ -751,6 +830,54 @@ const FlatButton = ButtonFactory('a', 'waves-effect waves-teal btn-flat', 'butto
 const IconButton = ButtonFactory('button', 'btn-flat btn-icon waves-effect waves-teal', 'button');
 const RoundIconButton = ButtonFactory('button', 'btn-floating btn-large waves-effect waves-light', 'button');
 const SubmitButton = ButtonFactory('button', 'btn waves-effect waves-light', 'submit');
+const RaisedIconButton = ButtonFactory('button', 'btn waves-effect waves-light', 'button');
+const ConfirmButton = () => {
+    let isConfirming = false;
+    let isBlocked = false;
+    let timeoutId;
+    let blockTimeoutId;
+    const reset = () => {
+        isConfirming = false;
+        isBlocked = false;
+        m.redraw();
+    };
+    const unblock = () => {
+        isBlocked = false;
+    };
+    return {
+        onremove: () => {
+            window.clearTimeout(timeoutId);
+            window.clearTimeout(blockTimeoutId);
+        },
+        view: ({ attrs }) => {
+            const { iconName = 'delete', confirmIconName = 'check', confirmColor = 'red', timeout = 3000, clickDelay = 500, onFirstClick, onclick } = attrs, props = __rest(attrs, ["iconName", "confirmIconName", "confirmColor", "timeout", "clickDelay", "onFirstClick", "onclick"]);
+            const handleClick = (e) => {
+                e.preventDefault();
+                if (isBlocked)
+                    return;
+                if (isConfirming) {
+                    window.clearTimeout(timeoutId);
+                    window.clearTimeout(blockTimeoutId); // Clean up safety
+                    isConfirming = false;
+                    onclick === null || onclick === void 0 ? void 0 : onclick(e);
+                }
+                else {
+                    isConfirming = true;
+                    isBlocked = true;
+                    onFirstClick === null || onFirstClick === void 0 ? void 0 : onFirstClick();
+                    timeoutId = window.setTimeout(reset, timeout);
+                    blockTimeoutId = window.setTimeout(unblock, clickDelay);
+                }
+            };
+            const cn = isConfirming ? confirmColor : 'red-text';
+            const commonProps = Object.assign(Object.assign({}, props), { className: `${props.className || ''} ${cn}`, style: Object.assign(Object.assign(Object.assign({}, props.style), { display: 'flex', alignItems: 'center', justifyContent: 'center' }), (isConfirming ? { padding: '0 8px', width: 'auto', minWidth: 'auto' } : {})), onclick: handleClick });
+            if (isConfirming) {
+                return m(RaisedIconButton, commonProps, m(MaterialIcon, { name: confirmIconName }));
+            }
+            return m(IconButton, commonProps, m(MaterialIcon, { name: iconName }));
+        },
+    };
+};
 
 /**
  * Materialize CSS Carousel component with dynamic positioning
@@ -1142,81 +1269,6 @@ const Carousel = () => {
     };
 };
 
-const iconPaths = {
-    caret: [
-        'M7 10l5 5 5-5z', // arrow
-        'M0 0h24v24H0z', // background
-    ],
-    close: [
-        'M18.3 5.71a1 1 0 0 0-1.41 0L12 10.59 7.11 5.7A1 1 0 0 0 5.7 7.11L10.59 12l-4.89 4.89a1 1 0 1 0 1.41 1.41L12 13.41l4.89 4.89a1 1 0 0 0 1.41-1.41L13.41 12l4.89-4.89a1 1 0 0 0 0-1.4z',
-        'M0 0h24v24H0z',
-    ],
-    chevron: [
-        'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z', // chevron down
-        'M0 0h24v24H0z', // background
-    ],
-    chevron_left: [
-        'M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z', // chevron left
-        'M0 0h24v24H0z', // background
-    ],
-    chevron_right: [
-        'M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z', // chevron right
-        'M0 0h24v24H0z', // background
-    ],
-    menu: [
-        'M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z', // hamburger menu
-        'M0 0h24v24H0z', // background
-    ],
-    expand: [
-        'M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z', // plus
-        'M0 0h24v24H0z', // background
-    ],
-    collapse: [
-        'M19 13H5v-2h14v2z', // minus
-        'M0 0h24v24H0z', // background
-    ],
-    check: [
-        'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z', // checkmark
-        'M0 0h24v24H0z', // background
-    ],
-    radio_checked: [
-        'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z', // radio button checked
-        'M0 0h24v24H0z', // background
-    ],
-    radio_unchecked: [
-        'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z', // radio button unchecked
-        'M0 0h24v24H0z', // background
-    ],
-    light_mode: [
-        'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5M2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1m18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1M11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1m0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1M5.99 4.58a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41zm12.4 12.4a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0a.996.996 0 0 0 0-1.41zm1.06-11a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0zM7.05 18.4a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0z',
-        'M0 0h24v24H0z', // background
-    ],
-    dark_mode: [
-        'M12 3a9 9 0 1 0 9 9c0-.46-.04-.92-.1-1.36a5.39 5.39 0 0 1-4.4 2.26 5.4 5.4 0 0 1-3.14-9.8c-.44-.06-.9-.1-1.36-.1z',
-        'M0 0h24v24H0z', // background
-    ],
-};
-const MaterialIcon = () => {
-    return {
-        view: ({ attrs }) => {
-            var _a;
-            const { name, direction = 'down', style } = attrs, props = __rest(attrs, ["name", "direction", "style"]);
-            const rotationMap = {
-                down: 0,
-                up: 180,
-                left: 90,
-                right: -90,
-            };
-            const rotation = (_a = rotationMap[direction]) !== null && _a !== void 0 ? _a : 0;
-            const transform = rotation ? `rotate(${rotation}deg)` : undefined;
-            return m('svg', Object.assign(Object.assign({}, props), { style: Object.assign({ transform }, style), height: '24px', width: '24px', viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg' }), iconPaths[name].map((d) => m('path', {
-                d,
-                fill: d.includes('M0 0h24v24H0z') ? 'none' : 'currentColor',
-            })));
-        },
-    };
-};
-
 const Chips = () => {
     const state = {
         chipsData: [],
@@ -11434,4 +11486,4 @@ const isValidationError = (result) => !isValidationSuccess(result);
 // ============================================================================
 // All types are already exported via individual export declarations above
 
-export { AnalogClock, AnchorItem, Autocomplete, Badge, Breadcrumb, BreadcrumbManager, Button, ButtonFactory, Carousel, CharacterCounter, Chips, CircularProgress, CodeBlock, Collapsible, CollapsibleItem, Collection, CollectionMode, ColorInput, DataTable, DatePicker, DigitalClock, DoubleRangeSlider, Dropdown, EmailInput, FileInput, FileUpload, FlatButton, FloatingActionButton, HelperText, Icon, IconButton, ImageList, InputCheckbox, Label, LargeButton, LikertScale, LinearProgress, ListItem, Mandatory, Masonry, MaterialBox, MaterialIcon, ModalPanel, NumberInput, Options, OptionsList, Pagination, PaginationControls, Parallax, PasswordInput, Pushpin, PushpinComponent, RadioButton, RadioButtons, RangeInput, Rating, RoundIconButton, SearchSelect, SecondaryContent, Select, Sidenav, SidenavItem, SidenavManager, SingleRangeSlider, SmallButton, Stepper, SubmitButton, Switch, Tabs, TextArea, TextInput, ThemeManager, ThemeSwitcher, ThemeToggle, TimePicker, TimeRangePicker, Timeline, Toast, ToastComponent, ToggleGroup, Tooltip, TooltipComponent, TreeView, UrlInput, Wizard, addLeadingZero, clearPortal, createBreadcrumb, formatTime, generateHourOptions, generateMinuteOptions, getDropdownStyles, getPortalContainer, initPushpins, initTooltips, isNumeric, isTimeDisabled, isValidationError, isValidationSuccess, padLeft, parseTime, range, releasePortalContainer, renderToPortal, scrollToValue, snapToNearestItem, sortOptions, timeToMinutes, toast, uniqueId, uuid4 };
+export { AnalogClock, AnchorItem, Autocomplete, Badge, Breadcrumb, BreadcrumbManager, Button, ButtonFactory, Carousel, CharacterCounter, Chips, CircularProgress, CodeBlock, Collapsible, CollapsibleItem, Collection, CollectionMode, ColorInput, ConfirmButton, DataTable, DatePicker, DigitalClock, DoubleRangeSlider, Dropdown, EmailInput, FileInput, FileUpload, FlatButton, FloatingActionButton, HelperText, Icon, IconButton, ImageList, InputCheckbox, Label, LargeButton, LikertScale, LinearProgress, ListItem, Mandatory, Masonry, MaterialBox, MaterialIcon, ModalPanel, NumberInput, Options, OptionsList, Pagination, PaginationControls, Parallax, PasswordInput, Pushpin, PushpinComponent, RadioButton, RadioButtons, RangeInput, Rating, RoundIconButton, SearchSelect, SecondaryContent, Select, Sidenav, SidenavItem, SidenavManager, SingleRangeSlider, SmallButton, Stepper, SubmitButton, Switch, Tabs, TextArea, TextInput, ThemeManager, ThemeSwitcher, ThemeToggle, TimePicker, TimeRangePicker, Timeline, Toast, ToastComponent, ToggleGroup, Tooltip, TooltipComponent, TreeView, UrlInput, Wizard, addLeadingZero, clearPortal, createBreadcrumb, formatTime, generateHourOptions, generateMinuteOptions, getDropdownStyles, getPortalContainer, initPushpins, initTooltips, isNumeric, isTimeDisabled, isValidationError, isValidationSuccess, padLeft, parseTime, range, releasePortalContainer, renderToPortal, scrollToValue, snapToNearestItem, sortOptions, timeToMinutes, toast, uniqueId, uuid4 };

package/dist/index.js

@@ -620,6 +620,85 @@ const Icon = () => ({
     },
 });
 
+const iconPaths = {
+    caret: [
+        'M7 10l5 5 5-5z', // arrow
+        'M0 0h24v24H0z', // background
+    ],
+    close: [
+        'M18.3 5.71a1 1 0 0 0-1.41 0L12 10.59 7.11 5.7A1 1 0 0 0 5.7 7.11L10.59 12l-4.89 4.89a1 1 0 1 0 1.41 1.41L12 13.41l4.89 4.89a1 1 0 0 0 1.41-1.41L13.41 12l4.89-4.89a1 1 0 0 0 0-1.4z',
+        'M0 0h24v24H0z',
+    ],
+    chevron: [
+        'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z', // chevron down
+        'M0 0h24v24H0z', // background
+    ],
+    chevron_left: [
+        'M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z', // chevron left
+        'M0 0h24v24H0z', // background
+    ],
+    chevron_right: [
+        'M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z', // chevron right
+        'M0 0h24v24H0z', // background
+    ],
+    menu: [
+        'M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z', // hamburger menu
+        'M0 0h24v24H0z', // background
+    ],
+    expand: [
+        'M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z', // plus
+        'M0 0h24v24H0z', // background
+    ],
+    collapse: [
+        'M19 13H5v-2h14v2z', // minus
+        'M0 0h24v24H0z', // background
+    ],
+    check: [
+        'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z', // checkmark
+        'M0 0h24v24H0z', // background
+    ],
+    radio_checked: [
+        'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z', // radio button checked
+        'M0 0h24v24H0z', // background
+    ],
+    radio_unchecked: [
+        'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z', // radio button unchecked
+        'M0 0h24v24H0z', // background
+    ],
+    light_mode: [
+        'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5M2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1m18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1M11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1m0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1M5.99 4.58a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41zm12.4 12.4a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0a.996.996 0 0 0 0-1.41zm1.06-11a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0zM7.05 18.4a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0z',
+        'M0 0h24v24H0z', // background
+    ],
+    dark_mode: [
+        'M12 3a9 9 0 1 0 9 9c0-.46-.04-.92-.1-1.36a5.39 5.39 0 0 1-4.4 2.26 5.4 5.4 0 0 1-3.14-9.8c-.44-.06-.9-.1-1.36-.1z',
+        'M0 0h24v24H0z', // background
+    ],
+    delete: [
+        'M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z',
+        'M0 0h24v24H0z', // background
+    ],
+};
+const MaterialIcon = () => {
+    return {
+        view: ({ attrs }) => {
+            var _a;
+            const { name, direction = 'down', style } = attrs, props = __rest(attrs, ["name", "direction", "style"]);
+            const rotationMap = {
+                down: 0,
+                up: 180,
+                left: 90,
+                right: -90,
+            };
+            const rotation = (_a = rotationMap[direction]) !== null && _a !== void 0 ? _a : 0;
+            const transform = rotation ? `rotate(${rotation}deg)` : undefined;
+            return m('svg', Object.assign(Object.assign({}, props), { style: Object.assign({ transform }, style), height: '24px', width: '24px', viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg' }), iconPaths[name].map((d) => m('path', {
+                d,
+                fill: d.includes('M0 0h24v24H0z') ? 'none' : 'currentColor',
+            })));
+        },
+    };
+};
+
 /*!
  * Waves Effect for Mithril Materialized
  * Based on Waves v0.6.4 by Alfiana E. Sibuea
@@ -725,7 +804,7 @@ WavesEffect.onTouchEnd = (e) => {
 const ButtonFactory = (element, defaultClassNames, type = '') => {
     return () => {
         return {
-            view: ({ attrs }) => {
+            view: ({ attrs, children }) => {
                 const { tooltip, tooltipPosition, tooltipPostion, // Keep for backwards compatibility
                 iconName, iconClass, label, className, variant } = attrs, params = __rest(attrs, ["tooltip", "tooltipPosition", "tooltipPostion", "iconName", "iconClass", "label", "className", "variant"]);
                 // Use variant or fallback to factory type
@@ -741,7 +820,7 @@ const ButtonFactory = (element, defaultClassNames, type = '') => {
                     ontouchstart: WavesEffect.onTouchStart,
                     ontouchend: WavesEffect.onTouchEnd
                 } : {};
-                return m(element, Object.assign(Object.assign(Object.assign({}, params), wavesHandlers), { className: cn, 'data-position': tooltip ? position : undefined, 'data-tooltip': tooltip || undefined, type: buttonType }), iconName ? m(Icon, { iconName, className: iconClass || 'left' }) : undefined, label ? label : undefined);
+                return m(element, Object.assign(Object.assign(Object.assign({}, params), wavesHandlers), { className: cn, 'data-position': tooltip ? position : undefined, 'data-tooltip': tooltip || undefined, type: buttonType }), iconName ? m(Icon, { iconName, className: iconClass || 'left' }) : undefined, label ? label : undefined, children);
             },
         };
     };
@@ -753,6 +832,54 @@ const FlatButton = ButtonFactory('a', 'waves-effect waves-teal btn-flat', 'butto
 const IconButton = ButtonFactory('button', 'btn-flat btn-icon waves-effect waves-teal', 'button');
 const RoundIconButton = ButtonFactory('button', 'btn-floating btn-large waves-effect waves-light', 'button');
 const SubmitButton = ButtonFactory('button', 'btn waves-effect waves-light', 'submit');
+const RaisedIconButton = ButtonFactory('button', 'btn waves-effect waves-light', 'button');
+const ConfirmButton = () => {
+    let isConfirming = false;
+    let isBlocked = false;
+    let timeoutId;
+    let blockTimeoutId;
+    const reset = () => {
+        isConfirming = false;
+        isBlocked = false;
+        m.redraw();
+    };
+    const unblock = () => {
+        isBlocked = false;
+    };
+    return {
+        onremove: () => {
+            window.clearTimeout(timeoutId);
+            window.clearTimeout(blockTimeoutId);
+        },
+        view: ({ attrs }) => {
+            const { iconName = 'delete', confirmIconName = 'check', confirmColor = 'red', timeout = 3000, clickDelay = 500, onFirstClick, onclick } = attrs, props = __rest(attrs, ["iconName", "confirmIconName", "confirmColor", "timeout", "clickDelay", "onFirstClick", "onclick"]);
+            const handleClick = (e) => {
+                e.preventDefault();
+                if (isBlocked)
+                    return;
+                if (isConfirming) {
+                    window.clearTimeout(timeoutId);
+                    window.clearTimeout(blockTimeoutId); // Clean up safety
+                    isConfirming = false;
+                    onclick === null || onclick === void 0 ? void 0 : onclick(e);
+                }
+                else {
+                    isConfirming = true;
+                    isBlocked = true;
+                    onFirstClick === null || onFirstClick === void 0 ? void 0 : onFirstClick();
+                    timeoutId = window.setTimeout(reset, timeout);
+                    blockTimeoutId = window.setTimeout(unblock, clickDelay);
+                }
+            };
+            const cn = isConfirming ? confirmColor : 'red-text';
+            const commonProps = Object.assign(Object.assign({}, props), { className: `${props.className || ''} ${cn}`, style: Object.assign(Object.assign(Object.assign({}, props.style), { display: 'flex', alignItems: 'center', justifyContent: 'center' }), (isConfirming ? { padding: '0 8px', width: 'auto', minWidth: 'auto' } : {})), onclick: handleClick });
+            if (isConfirming) {
+                return m(RaisedIconButton, commonProps, m(MaterialIcon, { name: confirmIconName }));
+            }
+            return m(IconButton, commonProps, m(MaterialIcon, { name: iconName }));
+        },
+    };
+};
 
 /**
  * Materialize CSS Carousel component with dynamic positioning
@@ -1144,81 +1271,6 @@ const Carousel = () => {
     };
 };
 
-const iconPaths = {
-    caret: [
-        'M7 10l5 5 5-5z', // arrow
-        'M0 0h24v24H0z', // background
-    ],
-    close: [
-        'M18.3 5.71a1 1 0 0 0-1.41 0L12 10.59 7.11 5.7A1 1 0 0 0 5.7 7.11L10.59 12l-4.89 4.89a1 1 0 1 0 1.41 1.41L12 13.41l4.89 4.89a1 1 0 0 0 1.41-1.41L13.41 12l4.89-4.89a1 1 0 0 0 0-1.4z',
-        'M0 0h24v24H0z',
-    ],
-    chevron: [
-        'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z', // chevron down
-        'M0 0h24v24H0z', // background
-    ],
-    chevron_left: [
-        'M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z', // chevron left
-        'M0 0h24v24H0z', // background
-    ],
-    chevron_right: [
-        'M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z', // chevron right
-        'M0 0h24v24H0z', // background
-    ],
-    menu: [
-        'M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z', // hamburger menu
-        'M0 0h24v24H0z', // background
-    ],
-    expand: [
-        'M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z', // plus
-        'M0 0h24v24H0z', // background
-    ],
-    collapse: [
-        'M19 13H5v-2h14v2z', // minus
-        'M0 0h24v24H0z', // background
-    ],
-    check: [
-        'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z', // checkmark
-        'M0 0h24v24H0z', // background
-    ],
-    radio_checked: [
-        'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z', // radio button checked
-        'M0 0h24v24H0z', // background
-    ],
-    radio_unchecked: [
-        'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z', // radio button unchecked
-        'M0 0h24v24H0z', // background
-    ],
-    light_mode: [
-        'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5M2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1m18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1M11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1m0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1M5.99 4.58a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41zm12.4 12.4a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0a.996.996 0 0 0 0-1.41zm1.06-11a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0zM7.05 18.4a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0z',
-        'M0 0h24v24H0z', // background
-    ],
-    dark_mode: [
-        'M12 3a9 9 0 1 0 9 9c0-.46-.04-.92-.1-1.36a5.39 5.39 0 0 1-4.4 2.26 5.4 5.4 0 0 1-3.14-9.8c-.44-.06-.9-.1-1.36-.1z',
-        'M0 0h24v24H0z', // background
-    ],
-};
-const MaterialIcon = () => {
-    return {
-        view: ({ attrs }) => {
-            var _a;
-            const { name, direction = 'down', style } = attrs, props = __rest(attrs, ["name", "direction", "style"]);
-            const rotationMap = {
-                down: 0,
-                up: 180,
-                left: 90,
-                right: -90,
-            };
-            const rotation = (_a = rotationMap[direction]) !== null && _a !== void 0 ? _a : 0;
-            const transform = rotation ? `rotate(${rotation}deg)` : undefined;
-            return m('svg', Object.assign(Object.assign({}, props), { style: Object.assign({ transform }, style), height: '24px', width: '24px', viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg' }), iconPaths[name].map((d) => m('path', {
-                d,
-                fill: d.includes('M0 0h24v24H0z') ? 'none' : 'currentColor',
-            })));
-        },
-    };
-};
-
 const Chips = () => {
     const state = {
         chipsData: [],
@@ -11453,6 +11505,7 @@ exports.Collapsible = Collapsible;
 exports.CollapsibleItem = CollapsibleItem;
 exports.Collection = Collection;
 exports.ColorInput = ColorInput;
+exports.ConfirmButton = ConfirmButton;
 exports.DataTable = DataTable;
 exports.DatePicker = DatePicker;
 exports.DigitalClock = DigitalClock;

package/dist/index.umd.js

@@ -622,6 +622,85 @@
         },
     });
 
+    const iconPaths = {
+        caret: [
+            'M7 10l5 5 5-5z', // arrow
+            'M0 0h24v24H0z', // background
+        ],
+        close: [
+            'M18.3 5.71a1 1 0 0 0-1.41 0L12 10.59 7.11 5.7A1 1 0 0 0 5.7 7.11L10.59 12l-4.89 4.89a1 1 0 1 0 1.41 1.41L12 13.41l4.89 4.89a1 1 0 0 0 1.41-1.41L13.41 12l4.89-4.89a1 1 0 0 0 0-1.4z',
+            'M0 0h24v24H0z',
+        ],
+        chevron: [
+            'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z', // chevron down
+            'M0 0h24v24H0z', // background
+        ],
+        chevron_left: [
+            'M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z', // chevron left
+            'M0 0h24v24H0z', // background
+        ],
+        chevron_right: [
+            'M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z', // chevron right
+            'M0 0h24v24H0z', // background
+        ],
+        menu: [
+            'M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z', // hamburger menu
+            'M0 0h24v24H0z', // background
+        ],
+        expand: [
+            'M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z', // plus
+            'M0 0h24v24H0z', // background
+        ],
+        collapse: [
+            'M19 13H5v-2h14v2z', // minus
+            'M0 0h24v24H0z', // background
+        ],
+        check: [
+            'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z', // checkmark
+            'M0 0h24v24H0z', // background
+        ],
+        radio_checked: [
+            'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z', // radio button checked
+            'M0 0h24v24H0z', // background
+        ],
+        radio_unchecked: [
+            'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z', // radio button unchecked
+            'M0 0h24v24H0z', // background
+        ],
+        light_mode: [
+            'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5M2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1m18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1M11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1m0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1M5.99 4.58a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41zm12.4 12.4a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0a.996.996 0 0 0 0-1.41zm1.06-11a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0zM7.05 18.4a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0z',
+            'M0 0h24v24H0z', // background
+        ],
+        dark_mode: [
+            'M12 3a9 9 0 1 0 9 9c0-.46-.04-.92-.1-1.36a5.39 5.39 0 0 1-4.4 2.26 5.4 5.4 0 0 1-3.14-9.8c-.44-.06-.9-.1-1.36-.1z',
+            'M0 0h24v24H0z', // background
+        ],
+        delete: [
+            'M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z',
+            'M0 0h24v24H0z', // background
+        ],
+    };
+    const MaterialIcon = () => {
+        return {
+            view: ({ attrs }) => {
+                var _a;
+                const { name, direction = 'down', style } = attrs, props = __rest(attrs, ["name", "direction", "style"]);
+                const rotationMap = {
+                    down: 0,
+                    up: 180,
+                    left: 90,
+                    right: -90,
+                };
+                const rotation = (_a = rotationMap[direction]) !== null && _a !== void 0 ? _a : 0;
+                const transform = rotation ? `rotate(${rotation}deg)` : undefined;
+                return m('svg', Object.assign(Object.assign({}, props), { style: Object.assign({ transform }, style), height: '24px', width: '24px', viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg' }), iconPaths[name].map((d) => m('path', {
+                    d,
+                    fill: d.includes('M0 0h24v24H0z') ? 'none' : 'currentColor',
+                })));
+            },
+        };
+    };
+
     /*!
      * Waves Effect for Mithril Materialized
      * Based on Waves v0.6.4 by Alfiana E. Sibuea
@@ -727,7 +806,7 @@
     const ButtonFactory = (element, defaultClassNames, type = '') => {
         return () => {
             return {
-                view: ({ attrs }) => {
+                view: ({ attrs, children }) => {
                     const { tooltip, tooltipPosition, tooltipPostion, // Keep for backwards compatibility
                     iconName, iconClass, label, className, variant } = attrs, params = __rest(attrs, ["tooltip", "tooltipPosition", "tooltipPostion", "iconName", "iconClass", "label", "className", "variant"]);
                     // Use variant or fallback to factory type
@@ -743,7 +822,7 @@
                         ontouchstart: WavesEffect.onTouchStart,
                         ontouchend: WavesEffect.onTouchEnd
                     } : {};
-                    return m(element, Object.assign(Object.assign(Object.assign({}, params), wavesHandlers), { className: cn, 'data-position': tooltip ? position : undefined, 'data-tooltip': tooltip || undefined, type: buttonType }), iconName ? m(Icon, { iconName, className: iconClass || 'left' }) : undefined, label ? label : undefined);
+                    return m(element, Object.assign(Object.assign(Object.assign({}, params), wavesHandlers), { className: cn, 'data-position': tooltip ? position : undefined, 'data-tooltip': tooltip || undefined, type: buttonType }), iconName ? m(Icon, { iconName, className: iconClass || 'left' }) : undefined, label ? label : undefined, children);
                 },
             };
         };
@@ -755,6 +834,54 @@
     const IconButton = ButtonFactory('button', 'btn-flat btn-icon waves-effect waves-teal', 'button');
     const RoundIconButton = ButtonFactory('button', 'btn-floating btn-large waves-effect waves-light', 'button');
     const SubmitButton = ButtonFactory('button', 'btn waves-effect waves-light', 'submit');
+    const RaisedIconButton = ButtonFactory('button', 'btn waves-effect waves-light', 'button');
+    const ConfirmButton = () => {
+        let isConfirming = false;
+        let isBlocked = false;
+        let timeoutId;
+        let blockTimeoutId;
+        const reset = () => {
+            isConfirming = false;
+            isBlocked = false;
+            m.redraw();
+        };
+        const unblock = () => {
+            isBlocked = false;
+        };
+        return {
+            onremove: () => {
+                window.clearTimeout(timeoutId);
+                window.clearTimeout(blockTimeoutId);
+            },
+            view: ({ attrs }) => {
+                const { iconName = 'delete', confirmIconName = 'check', confirmColor = 'red', timeout = 3000, clickDelay = 500, onFirstClick, onclick } = attrs, props = __rest(attrs, ["iconName", "confirmIconName", "confirmColor", "timeout", "clickDelay", "onFirstClick", "onclick"]);
+                const handleClick = (e) => {
+                    e.preventDefault();
+                    if (isBlocked)
+                        return;
+                    if (isConfirming) {
+                        window.clearTimeout(timeoutId);
+                        window.clearTimeout(blockTimeoutId); // Clean up safety
+                        isConfirming = false;
+                        onclick === null || onclick === void 0 ? void 0 : onclick(e);
+                    }
+                    else {
+                        isConfirming = true;
+                        isBlocked = true;
+                        onFirstClick === null || onFirstClick === void 0 ? void 0 : onFirstClick();
+                        timeoutId = window.setTimeout(reset, timeout);
+                        blockTimeoutId = window.setTimeout(unblock, clickDelay);
+                    }
+                };
+                const cn = isConfirming ? confirmColor : 'red-text';
+                const commonProps = Object.assign(Object.assign({}, props), { className: `${props.className || ''} ${cn}`, style: Object.assign(Object.assign(Object.assign({}, props.style), { display: 'flex', alignItems: 'center', justifyContent: 'center' }), (isConfirming ? { padding: '0 8px', width: 'auto', minWidth: 'auto' } : {})), onclick: handleClick });
+                if (isConfirming) {
+                    return m(RaisedIconButton, commonProps, m(MaterialIcon, { name: confirmIconName }));
+                }
+                return m(IconButton, commonProps, m(MaterialIcon, { name: iconName }));
+            },
+        };
+    };
 
     /**
      * Materialize CSS Carousel component with dynamic positioning
@@ -1146,81 +1273,6 @@
         };
     };
 
-    const iconPaths = {
-        caret: [
-            'M7 10l5 5 5-5z', // arrow
-            'M0 0h24v24H0z', // background
-        ],
-        close: [
-            'M18.3 5.71a1 1 0 0 0-1.41 0L12 10.59 7.11 5.7A1 1 0 0 0 5.7 7.11L10.59 12l-4.89 4.89a1 1 0 1 0 1.41 1.41L12 13.41l4.89 4.89a1 1 0 0 0 1.41-1.41L13.41 12l4.89-4.89a1 1 0 0 0 0-1.4z',
-            'M0 0h24v24H0z',
-        ],
-        chevron: [
-            'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z', // chevron down
-            'M0 0h24v24H0z', // background
-        ],
-        chevron_left: [
-            'M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z', // chevron left
-            'M0 0h24v24H0z', // background
-        ],
-        chevron_right: [
-            'M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z', // chevron right
-            'M0 0h24v24H0z', // background
-        ],
-        menu: [
-            'M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z', // hamburger menu
-            'M0 0h24v24H0z', // background
-        ],
-        expand: [
-            'M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z', // plus
-            'M0 0h24v24H0z', // background
-        ],
-        collapse: [
-            'M19 13H5v-2h14v2z', // minus
-            'M0 0h24v24H0z', // background
-        ],
-        check: [
-            'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z', // checkmark
-            'M0 0h24v24H0z', // background
-        ],
-        radio_checked: [
-            'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z', // radio button checked
-            'M0 0h24v24H0z', // background
-        ],
-        radio_unchecked: [
-            'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z', // radio button unchecked
-            'M0 0h24v24H0z', // background
-        ],
-        light_mode: [
-            'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5M2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1m18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1M11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1m0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1M5.99 4.58a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41zm12.4 12.4a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0a.996.996 0 0 0 0-1.41zm1.06-11a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0zM7.05 18.4a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0z',
-            'M0 0h24v24H0z', // background
-        ],
-        dark_mode: [
-            'M12 3a9 9 0 1 0 9 9c0-.46-.04-.92-.1-1.36a5.39 5.39 0 0 1-4.4 2.26 5.4 5.4 0 0 1-3.14-9.8c-.44-.06-.9-.1-1.36-.1z',
-            'M0 0h24v24H0z', // background
-        ],
-    };
-    const MaterialIcon = () => {
-        return {
-            view: ({ attrs }) => {
-                var _a;
-                const { name, direction = 'down', style } = attrs, props = __rest(attrs, ["name", "direction", "style"]);
-                const rotationMap = {
-                    down: 0,
-                    up: 180,
-                    left: 90,
-                    right: -90,
-                };
-                const rotation = (_a = rotationMap[direction]) !== null && _a !== void 0 ? _a : 0;
-                const transform = rotation ? `rotate(${rotation}deg)` : undefined;
-                return m('svg', Object.assign(Object.assign({}, props), { style: Object.assign({ transform }, style), height: '24px', width: '24px', viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg' }), iconPaths[name].map((d) => m('path', {
-                    d,
-                    fill: d.includes('M0 0h24v24H0z') ? 'none' : 'currentColor',
-                })));
-            },
-        };
-    };
-
     const Chips = () => {
         const state = {
             chipsData: [],
@@ -11455,6 +11507,7 @@
     exports.CollapsibleItem = CollapsibleItem;
     exports.Collection = Collection;
     exports.ColorInput = ColorInput;
+    exports.ConfirmButton = ConfirmButton;
     exports.DataTable = DataTable;
     exports.DatePicker = DatePicker;
     exports.DigitalClock = DigitalClock;

package/dist/material-icon.d.ts

@@ -13,8 +13,9 @@ declare const iconPaths: {
     readonly radio_unchecked: readonly ["M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z", "M0 0h24v24H0z"];
     readonly light_mode: readonly ["M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5M2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1m18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1M11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1m0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1M5.99 4.58a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41zm12.4 12.4a.996.996 0 0 0-1.41 0 .996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0a.996.996 0 0 0 0-1.41zm1.06-11a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0zM7.05 18.4a.996.996 0 0 0 0-1.41.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0z", "M0 0h24v24H0z"];
     readonly dark_mode: readonly ["M12 3a9 9 0 1 0 9 9c0-.46-.04-.92-.1-1.36a5.39 5.39 0 0 1-4.4 2.26 5.4 5.4 0 0 1-3.14-9.8c-.44-.06-.9-.1-1.36-.1z", "M0 0h24v24H0z"];
+    readonly delete: readonly ["M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z", "M0 0h24v24H0z"];
 };
-type IconName = keyof typeof iconPaths;
+export type IconName = keyof typeof iconPaths;
 export interface MaterialIconAttrs extends Attributes {
     name: IconName;
     direction?: 'up' | 'down' | 'left' | 'right';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mithril-materialized",
-  "version": "3.13.0",
+  "version": "3.14.0",
   "description": "A materialize library for mithril.",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",