snice 4.14.0 → 4.16.0

package/adapters/react/doc.d.ts

@@ -5,6 +5,7 @@ import type { SniceBaseProps } from './types';
 export interface DocProps extends SniceBaseProps {
     placeholder?: any;
     readonly?: any;
+    icons?: any;
 }
 /**
  * Doc - React adapter for snice-doc

package/adapters/react/doc.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"doc.d.ts","sourceRoot":"","sources":["doc.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;GAEG;AACH,MAAM,WAAW,QAAS,SAAQ,cAAc;IAC9C,WAAW,CAAC,EAAE,GAAG,CAAC;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC;CAEhB;AAED;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,GAAG,uGAKd,CAAC"}
+{"version":3,"file":"doc.d.ts","sourceRoot":"","sources":["doc.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;GAEG;AACH,MAAM,WAAW,QAAS,SAAQ,cAAc;IAC9C,WAAW,CAAC,EAAE,GAAG,CAAC;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,KAAK,CAAC,EAAE,GAAG,CAAC;CAEb;AAED;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,GAAG,uGAKd,CAAC"}

package/adapters/react/doc.js

@@ -17,7 +17,7 @@ import { createReactAdapter } from './wrapper';
  */
 export const Doc = createReactAdapter({
     tagName: 'snice-doc',
-    properties: ["placeholder", "readonly"],
+    properties: ["placeholder", "readonly", "icons"],
     events: {},
     formAssociated: false
 });

package/adapters/react/doc.js.map

@@ -1 +1 @@
-{"version":3,"file":"doc.js","sourceRoot":"","sources":["doc.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAY/C;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,MAAM,GAAG,GAAG,kBAAkB,CAAW;IAC9C,OAAO,EAAE,WAAW;IACpB,UAAU,EAAE,CAAC,aAAa,EAAC,UAAU,CAAC;IACtC,MAAM,EAAE,EAAE;IACV,cAAc,EAAE,KAAK;CACtB,CAAC,CAAC"}
+{"version":3,"file":"doc.js","sourceRoot":"","sources":["doc.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAa/C;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,MAAM,GAAG,GAAG,kBAAkB,CAAW;IAC9C,OAAO,EAAE,WAAW;IACpB,UAAU,EAAE,CAAC,aAAa,EAAC,UAAU,EAAC,OAAO,CAAC;IAC9C,MAAM,EAAE,EAAE;IACV,cAAc,EAAE,KAAK;CACtB,CAAC,CAAC"}

package/adapters/react/doc.tsx

@@ -7,6 +7,7 @@ import type { SniceBaseProps } from './types';
 export interface DocProps extends SniceBaseProps {
   placeholder?: any;
   readonly?: any;
+  icons?: any;
 
 }
 
@@ -28,7 +29,7 @@ export interface DocProps extends SniceBaseProps {
  */
 export const Doc = createReactAdapter<DocProps>({
   tagName: 'snice-doc',
-  properties: ["placeholder","readonly"],
+  properties: ["placeholder","readonly","icons"],
   events: {},
   formAssociated: false
 });

package/adapters/react/input.d.ts

@@ -26,6 +26,9 @@ export interface InputProps extends SniceBaseProps {
     minlength?: any;
     autocomplete?: any;
     name?: any;
+    align?: any;
+    labelAlign?: any;
+    stretch?: any;
     prefixIcon?: any;
     suffixIcon?: any;
 }

package/adapters/react/input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;GAEG;AACH,MAAM,WAAW,UAAW,SAAQ,cAAc;IAChD,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,WAAW,CAAC,EAAE,GAAG,CAAC;IAClB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,UAAU,CAAC,EAAE,GAAG,CAAC;CAElB;AAED;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,KAAK,yGAKhB,CAAC"}
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;GAEG;AACH,MAAM,WAAW,UAAW,SAAQ,cAAc;IAChD,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,WAAW,CAAC,EAAE,GAAG,CAAC;IAClB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,UAAU,CAAC,EAAE,GAAG,CAAC;CAElB;AAED;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,KAAK,yGAKhB,CAAC"}

package/adapters/react/input.js

@@ -17,7 +17,7 @@ import { createReactAdapter } from './wrapper';
  */
 export const Input = createReactAdapter({
     tagName: 'snice-input',
-    properties: ["type", "size", "variant", "value", "placeholder", "label", "helperText", "errorText", "disabled", "readonly", "loading", "required", "invalid", "clearable", "password", "min", "max", "step", "pattern", "maxlength", "minlength", "autocomplete", "name", "prefixIcon", "suffixIcon"],
+    properties: ["type", "size", "variant", "value", "placeholder", "label", "helperText", "errorText", "disabled", "readonly", "loading", "required", "invalid", "clearable", "password", "min", "max", "step", "pattern", "maxlength", "minlength", "autocomplete", "name", "align", "labelAlign", "stretch", "prefixIcon", "suffixIcon"],
     events: {},
     formAssociated: false
 });

package/adapters/react/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.js","sourceRoot":"","sources":["input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAmC/C;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,kBAAkB,CAAa;IAClD,OAAO,EAAE,aAAa;IACtB,UAAU,EAAE,CAAC,MAAM,EAAC,MAAM,EAAC,SAAS,EAAC,OAAO,EAAC,aAAa,EAAC,OAAO,EAAC,YAAY,EAAC,WAAW,EAAC,UAAU,EAAC,UAAU,EAAC,SAAS,EAAC,UAAU,EAAC,SAAS,EAAC,WAAW,EAAC,UAAU,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAC,SAAS,EAAC,WAAW,EAAC,WAAW,EAAC,cAAc,EAAC,MAAM,EAAC,YAAY,EAAC,YAAY,CAAC;IAC7Q,MAAM,EAAE,EAAE;IACV,cAAc,EAAE,KAAK;CACtB,CAAC,CAAC"}
+{"version":3,"file":"input.js","sourceRoot":"","sources":["input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAsC/C;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,kBAAkB,CAAa;IAClD,OAAO,EAAE,aAAa;IACtB,UAAU,EAAE,CAAC,MAAM,EAAC,MAAM,EAAC,SAAS,EAAC,OAAO,EAAC,aAAa,EAAC,OAAO,EAAC,YAAY,EAAC,WAAW,EAAC,UAAU,EAAC,UAAU,EAAC,SAAS,EAAC,UAAU,EAAC,SAAS,EAAC,WAAW,EAAC,UAAU,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAC,SAAS,EAAC,WAAW,EAAC,WAAW,EAAC,cAAc,EAAC,MAAM,EAAC,OAAO,EAAC,YAAY,EAAC,SAAS,EAAC,YAAY,EAAC,YAAY,CAAC;IAC5S,MAAM,EAAE,EAAE;IACV,cAAc,EAAE,KAAK;CACtB,CAAC,CAAC"}

package/adapters/react/input.tsx

@@ -28,6 +28,9 @@ export interface InputProps extends SniceBaseProps {
   minlength?: any;
   autocomplete?: any;
   name?: any;
+  align?: any;
+  labelAlign?: any;
+  stretch?: any;
   prefixIcon?: any;
   suffixIcon?: any;
 
@@ -51,7 +54,7 @@ export interface InputProps extends SniceBaseProps {
  */
 export const Input = createReactAdapter<InputProps>({
   tagName: 'snice-input',
-  properties: ["type","size","variant","value","placeholder","label","helperText","errorText","disabled","readonly","loading","required","invalid","clearable","password","min","max","step","pattern","maxlength","minlength","autocomplete","name","prefixIcon","suffixIcon"],
+  properties: ["type","size","variant","value","placeholder","label","helperText","errorText","disabled","readonly","loading","required","invalid","clearable","password","min","max","step","pattern","maxlength","minlength","autocomplete","name","align","labelAlign","stretch","prefixIcon","suffixIcon"],
   events: {},
   formAssociated: false
 });

package/adapters/react/modal.d.ts

@@ -9,6 +9,8 @@ export interface ModalProps extends SniceBaseProps {
     noEscapeDismiss?: any;
     noFocusTrap?: any;
     noCloseButton?: any;
+    noHeader?: any;
+    noFooter?: any;
     label?: any;
 }
 /**

package/adapters/react/modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["modal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;GAEG;AACH,MAAM,WAAW,UAAW,SAAQ,cAAc;IAChD,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,iBAAiB,CAAC,EAAE,GAAG,CAAC;IACxB,eAAe,CAAC,EAAE,GAAG,CAAC;IACtB,WAAW,CAAC,EAAE,GAAG,CAAC;IAClB,aAAa,CAAC,EAAE,GAAG,CAAC;IACpB,KAAK,CAAC,EAAE,GAAG,CAAC;CAEb;AAED;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,KAAK,yGAKhB,CAAC"}
+{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["modal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;GAEG;AACH,MAAM,WAAW,UAAW,SAAQ,cAAc;IAChD,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,iBAAiB,CAAC,EAAE,GAAG,CAAC;IACxB,eAAe,CAAC,EAAE,GAAG,CAAC;IACtB,WAAW,CAAC,EAAE,GAAG,CAAC;IAClB,aAAa,CAAC,EAAE,GAAG,CAAC;IACpB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,KAAK,CAAC,EAAE,GAAG,CAAC;CAEb;AAED;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,KAAK,yGAKhB,CAAC"}

package/adapters/react/modal.js

@@ -17,7 +17,7 @@ import { createReactAdapter } from './wrapper';
  */
 export const Modal = createReactAdapter({
     tagName: 'snice-modal',
-    properties: ["open", "size", "noBackdropDismiss", "noEscapeDismiss", "noFocusTrap", "noCloseButton", "label"],
+    properties: ["open", "size", "noBackdropDismiss", "noEscapeDismiss", "noFocusTrap", "noCloseButton", "noHeader", "noFooter", "label"],
     events: {},
     formAssociated: false
 });

package/adapters/react/modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal.js","sourceRoot":"","sources":["modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAiB/C;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,kBAAkB,CAAa;IAClD,OAAO,EAAE,aAAa;IACtB,UAAU,EAAE,CAAC,MAAM,EAAC,MAAM,EAAC,mBAAmB,EAAC,iBAAiB,EAAC,aAAa,EAAC,eAAe,EAAC,OAAO,CAAC;IACvG,MAAM,EAAE,EAAE;IACV,cAAc,EAAE,KAAK;CACtB,CAAC,CAAC"}
+{"version":3,"file":"modal.js","sourceRoot":"","sources":["modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAmB/C;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,kBAAkB,CAAa;IAClD,OAAO,EAAE,aAAa;IACtB,UAAU,EAAE,CAAC,MAAM,EAAC,MAAM,EAAC,mBAAmB,EAAC,iBAAiB,EAAC,aAAa,EAAC,eAAe,EAAC,UAAU,EAAC,UAAU,EAAC,OAAO,CAAC;IAC7H,MAAM,EAAE,EAAE;IACV,cAAc,EAAE,KAAK;CACtB,CAAC,CAAC"}

package/adapters/react/modal.tsx

@@ -11,6 +11,8 @@ export interface ModalProps extends SniceBaseProps {
   noEscapeDismiss?: any;
   noFocusTrap?: any;
   noCloseButton?: any;
+  noHeader?: any;
+  noFooter?: any;
   label?: any;
 
 }
@@ -33,7 +35,7 @@ export interface ModalProps extends SniceBaseProps {
  */
 export const Modal = createReactAdapter<ModalProps>({
   tagName: 'snice-modal',
-  properties: ["open","size","noBackdropDismiss","noEscapeDismiss","noFocusTrap","noCloseButton","label"],
+  properties: ["open","size","noBackdropDismiss","noEscapeDismiss","noFocusTrap","noCloseButton","noHeader","noFooter","label"],
   events: {},
   formAssociated: false
 });

package/dist/cdn/accordion/snice-accordion.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/accordion/snice-accordion.min.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/alert/snice-alert.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/alert/snice-alert.min.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/app-tiles/snice-app-tiles.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/app-tiles/snice-app-tiles.min.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/audio-recorder/snice-audio-recorder.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/audio-recorder/snice-audio-recorder.min.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/avatar/snice-avatar.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/avatar/snice-avatar.min.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/badge/snice-badge.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/badge/snice-badge.min.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/banner/snice-banner.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/banner/snice-banner.min.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.

package/dist/cdn/book/README.md

@@ -11,8 +11,8 @@ CDN build of the Snice book component. Requires the Snice runtime (`snice-runtim
 ```
 
 ## Size
-- Minified: 12.3 KB
-- Gzipped: 3.7 KB
+- Minified: 13.2 KB
+- Gzipped: 3.9 KB
 
 ## Theme
 For proper styling, link the Snice theme CSS:

package/dist/cdn/book/snice-book.js

@@ -1,5 +1,5 @@
 /*!
- * snice v4.13.0
+ * snice v4.15.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.
@@ -129,6 +129,8 @@ var SniceBook = (function (exports, snice) {
       let _onCoverChange_decorators;
       let _handleKeydown_decorators;
       let _emitPageTurn_decorators;
+      let _emitPageFlipStart_decorators;
+      let _emitPageFlipEnd_decorators;
       let _renderContent_decorators;
       let _componentStyles_decorators;
       (class extends _classSuper {
@@ -156,6 +158,8 @@ var SniceBook = (function (exports, snice) {
               _onCoverChange_decorators = [snice.watch('coverImage')];
               _handleKeydown_decorators = [snice.on('keydown')];
               _emitPageTurn_decorators = [snice.dispatch('page-turn', { bubbles: true, composed: true })];
+              _emitPageFlipStart_decorators = [snice.dispatch('page-flip-start', { bubbles: true, composed: true })];
+              _emitPageFlipEnd_decorators = [snice.dispatch('page-flip-end', { bubbles: true, composed: true })];
               _renderContent_decorators = [snice.render({ once: true })];
               _componentStyles_decorators = [snice.styles()];
               __esDecorate(this, null, _init_decorators, { kind: "method", name: "init", static: false, private: false, access: { has: obj => "init" in obj, get: obj => obj.init }, metadata: _metadata }, null, _instanceExtraInitializers);
@@ -164,6 +168,8 @@ var SniceBook = (function (exports, snice) {
               __esDecorate(this, null, _onCoverChange_decorators, { kind: "method", name: "onCoverChange", static: false, private: false, access: { has: obj => "onCoverChange" in obj, get: obj => obj.onCoverChange }, metadata: _metadata }, null, _instanceExtraInitializers);
               __esDecorate(this, null, _handleKeydown_decorators, { kind: "method", name: "handleKeydown", static: false, private: false, access: { has: obj => "handleKeydown" in obj, get: obj => obj.handleKeydown }, metadata: _metadata }, null, _instanceExtraInitializers);
               __esDecorate(this, null, _emitPageTurn_decorators, { kind: "method", name: "emitPageTurn", static: false, private: false, access: { has: obj => "emitPageTurn" in obj, get: obj => obj.emitPageTurn }, metadata: _metadata }, null, _instanceExtraInitializers);
+              __esDecorate(this, null, _emitPageFlipStart_decorators, { kind: "method", name: "emitPageFlipStart", static: false, private: false, access: { has: obj => "emitPageFlipStart" in obj, get: obj => obj.emitPageFlipStart }, metadata: _metadata }, null, _instanceExtraInitializers);
+              __esDecorate(this, null, _emitPageFlipEnd_decorators, { kind: "method", name: "emitPageFlipEnd", static: false, private: false, access: { has: obj => "emitPageFlipEnd" in obj, get: obj => obj.emitPageFlipEnd }, metadata: _metadata }, null, _instanceExtraInitializers);
               __esDecorate(this, null, _renderContent_decorators, { kind: "method", name: "renderContent", static: false, private: false, access: { has: obj => "renderContent" in obj, get: obj => obj.renderContent }, metadata: _metadata }, null, _instanceExtraInitializers);
               __esDecorate(this, null, _componentStyles_decorators, { kind: "method", name: "componentStyles", static: false, private: false, access: { has: obj => "componentStyles" in obj, get: obj => obj.componentStyles }, metadata: _metadata }, null, _instanceExtraInitializers);
               __esDecorate(null, null, _currentPage_decorators, { kind: "field", name: "currentPage", static: false, private: false, access: { has: obj => "currentPage" in obj, get: obj => obj.currentPage, set: (obj, value) => { obj.currentPage = value; } }, metadata: _metadata }, _currentPage_initializers, _currentPage_extraInitializers);
@@ -283,10 +289,14 @@ var SniceBook = (function (exports, snice) {
                   radio.addEventListener('change', () => {
                       const idx = radio.dataset.page;
                       const old = this.currentPage;
-                      this.currentPage = idx !== undefined ? Number(idx) + 1 : 0;
-                      if (old !== this.currentPage) {
-                          const direction = this.currentPage > old ? 'forward' : 'backward';
-                          this.emitPageTurn({ page: this.currentPage, direction });
+                      const newPage = idx !== undefined ? Number(idx) + 1 : 0;
+                      if (old !== newPage) {
+                          const direction = newPage > old ? 'forward' : 'backward';
+                          this.emitPageFlipStart({ fromPage: old, toPage: newPage, direction });
+                          this.currentPage = newPage;
+                          this.emitPageTurn({ page: newPage, direction });
+                          const duration = parseFloat(getComputedStyle(this).getPropertyValue('--book-flip-duration') || '0.6') * 1000;
+                          setTimeout(() => this.emitPageFlipEnd({ page: newPage, direction }), duration);
                       }
                   });
               });
@@ -304,9 +314,14 @@ var SniceBook = (function (exports, snice) {
           }
           goToPage(page) {
               const old = this.currentPage;
-              this.currentPage = Math.max(0, Math.min(page, this.totalPages));
-              if (old !== this.currentPage) {
-                  this.emitPageTurn({ page: this.currentPage, direction: this.currentPage > old ? 'forward' : 'backward' });
+              const newPage = Math.max(0, Math.min(page, this.totalPages));
+              if (old !== newPage) {
+                  const direction = newPage > old ? 'forward' : 'backward';
+                  this.emitPageFlipStart({ fromPage: old, toPage: newPage, direction });
+                  this.currentPage = newPage;
+                  this.emitPageTurn({ page: newPage, direction });
+                  const duration = parseFloat(getComputedStyle(this).getPropertyValue('--book-flip-duration') || '0.6') * 1000;
+                  setTimeout(() => this.emitPageFlipEnd({ page: newPage, direction }), duration);
               }
           }
           nextPage() {
@@ -329,6 +344,12 @@ var SniceBook = (function (exports, snice) {
           emitPageTurn(detail) {
               return detail;
           }
+          emitPageFlipStart(detail) {
+              return detail;
+          }
+          emitPageFlipEnd(detail) {
+              return detail;
+          }
           renderContent() {
               return snice.html /*html*/ `
       <div class="cover">