@revvue/embed-react 0.1.6 → 0.1.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/css/dialog.css +1 -1
  2. package/dist/css/embed.css +1 -1
  3. package/dist/css/popover.css +1 -1
  4. package/dist/package.cjs +18 -4
  5. package/dist/package.mjs +18 -4
  6. package/dist/types/src/internal/create-floating-bindings.d.ts +3 -1
  7. package/dist/types/src/internal/create-floating-bindings.d.ts.map +1 -1
  8. package/package.json +2 -2
package/dist/css/dialog.css CHANGED
@@ -1 +1 @@
1
- @layer tokens{:root{--rvv-z-index:10002;--rvv-color-background:#fff;--rvv-color-foreground:#151426;--rvv-shadow-base:0 2px 12px 0 #0000001a;--rvv-shadow-base-hover:0 2px 12px 0 #0000004d;--radius-base:10px;--rvv-button-color:var(--rvv-color-foreground);--rvv-button-text-color:#fff}}.rvv-button{all:unset;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;justify-content:center;align-items:center;gap:8px;font-family:inherit;line-height:1;display:inline-flex}.rvv-button--trigger{background-color:var(--rvv-button-color);border-radius:var(--rvv-button-border-radius,9999px);box-shadow:var(--rvv-shadow-base);color:var(--rvv-button-text-color);white-space:nowrap;padding:12px 20px;font-size:15px;font-weight:500;transition:transform .15s,box-shadow .15s}.rvv-button--trigger:hover{background-color:var(--rvv-button-color);color:var(--rvv-button-text-color);transform:scale(1.05)}.rvv-button--trigger:active,.rvv-button--trigger:hover{box-shadow:var(--rvv-shadow-base-hover)}.rvv-button--trigger:active{transform:scale(.95)}.rvv-button--trigger-fixed{z-index:calc(var(--rvv-z-index) - 1);position:fixed;bottom:24px}.rvv-button--trigger-fixed[data-position=right]{right:24px}.rvv-button--trigger-fixed[data-position=left]{left:24px}.rvv-button:has(.rvv-button-icon):not(:has(.rvv-button-label)){padding:12px}.rvv-button-icon{flex-shrink:0;justify-content:center;align-items:center;font-size:1.15em;display:inline-flex;position:relative}.rvv-button-icon svg{fill:currentColor;width:1em;height:1em}.rvv-button-icon--close,.rvv-button-icon--open{justify-content:center;align-items:center;transition:opacity .2s,transform .2s;display:inline-flex}.rvv-button-icon--close{opacity:0;position:absolute;inset:0;transform:rotate(45deg)scale(.5)}.rvv-button[data-open=true] .rvv-button-icon--open{opacity:0;transform:rotate(-45deg)scale(.5)}.rvv-button[data-open=true] .rvv-button-icon--close{opacity:1;transform:rotate(0)scale(1)}.rvv-button-label{flex:1 0 auto}@media (width<=480px){.rvv-button--trigger-fixed{bottom:16px}.rvv-button--trigger-fixed[data-position=right]{right:16px}.rvv-button--trigger-fixed[data-position=left]{left:16px}}@media (width<=460px){html.rvv-mobile-open,html.rvv-mobile-open>body{position:static!important;overflow:hidden!important;transform:none!important}}dialog.rvv-dialog{border-radius:var(--rvv-border-radius,var(--radius-base));opacity:0;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);transition:opacity .2s ease,transform .2s ease,display allow-discrete .2s,overlay allow-discrete .2s;background:0 0;border:none;margin:auto;padding:0;overflow:visible;transform:scale(.96)translateY(10px)}dialog.rvv-dialog[open]{opacity:1;transform:scale(1)translateY(0)}@starting-style{dialog.rvv-dialog[open]{opacity:0;transform:scale(.96)translateY(10px)}}dialog.rvv-dialog::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transition:opacity .2s ease,display allow-discrete .2s,overlay allow-discrete .2s;background:#00000080}dialog.rvv-dialog[open]::backdrop{opacity:1}@starting-style{dialog.rvv-dialog[open]::backdrop{opacity:0}}.rvv-dialog-wrapper{--rvv-width:440px;--rvv-height:600px;background-color:var(--rvv-color-background);border-radius:var(--rvv-border-radius,var(--radius-base));box-shadow:var(--rvv-shadow-base);height:var(--rvv-height);width:var(--rvv-width);overflow:hidden}.rvv-dialog-wrapper iframe{border:none;width:100%;height:100%;display:block}@media (width<=460px){dialog.rvv-dialog{border-radius:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;inset:0}.rvv-dialog-wrapper{border-radius:0;width:100%;height:100dvh}}
1
+ @layer tokens{:root{--rvv-z-index:10002;--rvv-color-background:#fff;--rvv-color-foreground:#151426;--rvv-shadow-base:0 2px 12px 0 #0000001a;--rvv-shadow-base-hover:0 2px 12px 0 #0000004d;--radius-base:10px;--rvv-button-color:var(--rvv-color-foreground);--rvv-button-text-color:#fff}}.rvv-button{all:unset;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;justify-content:center;align-items:center;gap:8px;font-family:inherit;line-height:1;display:inline-flex}.rvv-button--trigger{background-color:var(--rvv-button-color);border-radius:var(--rvv-button-border-radius,9999px);box-shadow:var(--rvv-shadow-base);color:var(--rvv-button-text-color);white-space:nowrap;padding:12px 20px;font-size:15px;font-weight:500;transition:transform .15s,box-shadow .15s}.rvv-button--trigger:hover{background-color:var(--rvv-button-color);color:var(--rvv-button-text-color);transform:scale(1.05)}.rvv-button--trigger:active,.rvv-button--trigger:hover{box-shadow:var(--rvv-shadow-base-hover)}.rvv-button--trigger:active{transform:scale(.95)}.rvv-button--trigger-fixed{z-index:calc(var(--rvv-z-index) - 1);position:fixed;bottom:24px}.rvv-button--trigger-fixed[data-position=right]{right:24px}.rvv-button--trigger-fixed[data-position=left]{left:24px}.rvv-button:has(.rvv-button-icon):not(:has(.rvv-button-label)){padding:12px}.rvv-button-icon{flex-shrink:0;justify-content:center;align-items:center;font-size:1.15em;display:inline-flex;position:relative}.rvv-button-icon svg{fill:currentColor;width:1em;height:1em}.rvv-button-icon--close,.rvv-button-icon--open{justify-content:center;align-items:center;transition:opacity .2s,transform .2s;display:inline-flex}.rvv-button-icon--close{opacity:0;position:absolute;inset:0;transform:rotate(45deg)scale(.5)}.rvv-button[data-open=true] .rvv-button-icon--open{opacity:0;transform:rotate(-45deg)scale(.5)}.rvv-button[data-open=true] .rvv-button-icon--close{opacity:1;transform:rotate(0)scale(1)}.rvv-button-label{flex:1 0 auto}@media (width<=480px){.rvv-button--trigger-fixed{bottom:16px}.rvv-button--trigger-fixed[data-position=right]{right:16px}.rvv-button--trigger-fixed[data-position=left]{left:16px}}@media (width<=460px){html.rvv-mobile-open,html.rvv-mobile-open>body{position:static!important;overflow:hidden!important;transform:none!important}}dialog.rvv-dialog{border-radius:var(--rvv-border-radius,var(--radius-base));opacity:0;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);transition:opacity .2s ease,transform .2s ease,display allow-discrete .2s,overlay allow-discrete .2s;background:0 0;border:none;margin:auto;padding:0;overflow:visible;transform:scale(.96)translateY(10px)}dialog.rvv-dialog[open]{opacity:1;transform:scale(1)translateY(0)}@starting-style{dialog.rvv-dialog[open]{opacity:0;transform:scale(.96)translateY(10px)}}dialog.rvv-dialog::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transition:opacity .2s ease,display allow-discrete .2s,overlay allow-discrete .2s;background:#00000080}dialog.rvv-dialog[open]::backdrop{opacity:1}@starting-style{dialog.rvv-dialog[open]::backdrop{opacity:0}}@media (width>=461px){dialog.rvv-dialog.expanded .rvv-dialog-wrapper{height:calc(100dvh - 48px);width:min(max(700px,var(--rvv-width)),calc(100vw - 48px))}}.rvv-dialog-wrapper{--rvv-width:440px;--rvv-height:600px;background-color:var(--rvv-color-background);border-radius:var(--rvv-border-radius,var(--radius-base));box-shadow:var(--rvv-shadow-base);height:var(--rvv-height);width:var(--rvv-width);transition:width .32s cubic-bezier(.4,0,.2,1),height .32s cubic-bezier(.4,0,.2,1);overflow:hidden}.rvv-dialog-wrapper iframe{border:none;width:100%;height:100%;display:block}@media (width<=460px){dialog.rvv-dialog{border-radius:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;inset:0}.rvv-dialog-wrapper{border-radius:0;width:100%;height:100dvh}}
package/dist/css/embed.css CHANGED
@@ -1 +1 @@
1
- @layer tokens{:root{--rvv-z-index:10002;--rvv-color-background:#fff;--rvv-color-foreground:#151426;--rvv-shadow-base:0 2px 12px 0 #0000001a;--rvv-shadow-base-hover:0 2px 12px 0 #0000004d;--radius-base:10px;--rvv-button-color:var(--rvv-color-foreground);--rvv-button-text-color:#fff}}.rvv-widget{--rvv-width:100%;--rvv-height:500px;background-color:var(--rvv-color-background);height:var(--rvv-height);width:var(--rvv-width);position:relative;overflow:hidden}.rvv-widget iframe{border:none;width:100%;height:100%;display:block}.rvv-widget--animate-height{transition:height .22s ease-out}@media (prefers-reduced-motion:reduce){.rvv-widget--animate-height{transition:none}}.rvv-button{all:unset;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;justify-content:center;align-items:center;gap:8px;font-family:inherit;line-height:1;display:inline-flex}.rvv-button--trigger{background-color:var(--rvv-button-color);border-radius:var(--rvv-button-border-radius,9999px);box-shadow:var(--rvv-shadow-base);color:var(--rvv-button-text-color);white-space:nowrap;padding:12px 20px;font-size:15px;font-weight:500;transition:transform .15s,box-shadow .15s}.rvv-button--trigger:hover{background-color:var(--rvv-button-color);color:var(--rvv-button-text-color);transform:scale(1.05)}.rvv-button--trigger:active,.rvv-button--trigger:hover{box-shadow:var(--rvv-shadow-base-hover)}.rvv-button--trigger:active{transform:scale(.95)}.rvv-button--trigger-fixed{z-index:calc(var(--rvv-z-index) - 1);position:fixed;bottom:24px}.rvv-button--trigger-fixed[data-position=right]{right:24px}.rvv-button--trigger-fixed[data-position=left]{left:24px}.rvv-button:has(.rvv-button-icon):not(:has(.rvv-button-label)){padding:12px}.rvv-button-icon{flex-shrink:0;justify-content:center;align-items:center;font-size:1.15em;display:inline-flex;position:relative}.rvv-button-icon svg{fill:currentColor;width:1em;height:1em}.rvv-button-icon--close,.rvv-button-icon--open{justify-content:center;align-items:center;transition:opacity .2s,transform .2s;display:inline-flex}.rvv-button-icon--close{opacity:0;position:absolute;inset:0;transform:rotate(45deg)scale(.5)}.rvv-button[data-open=true] .rvv-button-icon--open{opacity:0;transform:rotate(-45deg)scale(.5)}.rvv-button[data-open=true] .rvv-button-icon--close{opacity:1;transform:rotate(0)scale(1)}.rvv-button-label{flex:1 0 auto}@media (width<=480px){.rvv-button--trigger-fixed{bottom:16px}.rvv-button--trigger-fixed[data-position=right]{right:16px}.rvv-button--trigger-fixed[data-position=left]{left:16px}}@media (width<=460px){html.rvv-mobile-open,html.rvv-mobile-open>body{position:static!important;overflow:hidden!important;transform:none!important}}.rvv-popover{background-color:var(--rvv-color-background);border-radius:var(--rvv-border-radius,var(--radius-base));box-shadow:var(--rvv-shadow-base);opacity:0;transform-origin:100% 100%;max-width:100%;transition:opacity .15s ease,transform .15s ease,display allow-discrete .15s,overlay allow-discrete .15s;z-index:var(--rvv-z-index);display:none;position:fixed;bottom:84px;right:24px;overflow:hidden;transform:translateY(6px)scale(.99)}.rvv-popover.open{opacity:1;display:flex;transform:translateY(0)scale(1)}@starting-style{.rvv-popover.open{opacity:0;transform:translateY(6px)scale(.99)}}.rvv-popover iframe{border:none;width:100%;min-height:100%}.rvv-popover-wrapper{--rvv-width:400px;--rvv-height:600px;height:var(--rvv-height);min-width:360px;min-height:400px;width:var(--rvv-width)}@media (width<=460px){.rvv-popover{transform-origin:bottom;border-radius:0;width:100%;max-width:none;height:100%;max-height:none;inset:0}.rvv-popover-wrapper{height:100%;min-height:unset;min-width:unset;width:100%}}.rvv-drawer{pointer-events:none;z-index:var(--rvv-z-index);background-color:#0000;transition:background-color .35s;position:fixed;inset:0}.rvv-drawer.open{pointer-events:auto;background-color:#0006}.rvv-drawer.open .rvv-drawer-wrapper{transform:translate(0)}.rvv-drawer-wrapper{--rvv-width:420px;background-color:var(--rvv-color-background);width:var(--rvv-width);transition:transform .35s cubic-bezier(.4,0,.2,1);position:absolute;top:0;bottom:0;right:0;overflow:hidden;transform:translate(100%);box-shadow:-4px 0 24px #0000001f}.rvv-drawer-wrapper iframe{border:none;width:100%;height:100%;display:block}@media (width<=480px){.rvv-drawer-wrapper{width:100vw}}dialog.rvv-dialog{border-radius:var(--rvv-border-radius,var(--radius-base));opacity:0;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);transition:opacity .2s ease,transform .2s ease,display allow-discrete .2s,overlay allow-discrete .2s;background:0 0;border:none;margin:auto;padding:0;overflow:visible;transform:scale(.96)translateY(10px)}dialog.rvv-dialog[open]{opacity:1;transform:scale(1)translateY(0)}@starting-style{dialog.rvv-dialog[open]{opacity:0;transform:scale(.96)translateY(10px)}}dialog.rvv-dialog::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transition:opacity .2s ease,display allow-discrete .2s,overlay allow-discrete .2s;background:#00000080}dialog.rvv-dialog[open]::backdrop{opacity:1}@starting-style{dialog.rvv-dialog[open]::backdrop{opacity:0}}.rvv-dialog-wrapper{--rvv-width:440px;--rvv-height:600px;background-color:var(--rvv-color-background);border-radius:var(--rvv-border-radius,var(--radius-base));box-shadow:var(--rvv-shadow-base);height:var(--rvv-height);width:var(--rvv-width);overflow:hidden}.rvv-dialog-wrapper iframe{border:none;width:100%;height:100%;display:block}@media (width<=460px){dialog.rvv-dialog{border-radius:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;inset:0}.rvv-dialog-wrapper{border-radius:0;width:100%;height:100dvh}}
1
+ @layer tokens{:root{--rvv-z-index:10002;--rvv-color-background:#fff;--rvv-color-foreground:#151426;--rvv-shadow-base:0 2px 12px 0 #0000001a;--rvv-shadow-base-hover:0 2px 12px 0 #0000004d;--radius-base:10px;--rvv-button-color:var(--rvv-color-foreground);--rvv-button-text-color:#fff}}.rvv-widget{--rvv-width:100%;--rvv-height:500px;background-color:var(--rvv-color-background);height:var(--rvv-height);width:var(--rvv-width);position:relative;overflow:hidden}.rvv-widget iframe{border:none;width:100%;height:100%;display:block}.rvv-widget--animate-height{transition:height .22s ease-out}@media (prefers-reduced-motion:reduce){.rvv-widget--animate-height{transition:none}}.rvv-button{all:unset;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;justify-content:center;align-items:center;gap:8px;font-family:inherit;line-height:1;display:inline-flex}.rvv-button--trigger{background-color:var(--rvv-button-color);border-radius:var(--rvv-button-border-radius,9999px);box-shadow:var(--rvv-shadow-base);color:var(--rvv-button-text-color);white-space:nowrap;padding:12px 20px;font-size:15px;font-weight:500;transition:transform .15s,box-shadow .15s}.rvv-button--trigger:hover{background-color:var(--rvv-button-color);color:var(--rvv-button-text-color);transform:scale(1.05)}.rvv-button--trigger:active,.rvv-button--trigger:hover{box-shadow:var(--rvv-shadow-base-hover)}.rvv-button--trigger:active{transform:scale(.95)}.rvv-button--trigger-fixed{z-index:calc(var(--rvv-z-index) - 1);position:fixed;bottom:24px}.rvv-button--trigger-fixed[data-position=right]{right:24px}.rvv-button--trigger-fixed[data-position=left]{left:24px}.rvv-button:has(.rvv-button-icon):not(:has(.rvv-button-label)){padding:12px}.rvv-button-icon{flex-shrink:0;justify-content:center;align-items:center;font-size:1.15em;display:inline-flex;position:relative}.rvv-button-icon svg{fill:currentColor;width:1em;height:1em}.rvv-button-icon--close,.rvv-button-icon--open{justify-content:center;align-items:center;transition:opacity .2s,transform .2s;display:inline-flex}.rvv-button-icon--close{opacity:0;position:absolute;inset:0;transform:rotate(45deg)scale(.5)}.rvv-button[data-open=true] .rvv-button-icon--open{opacity:0;transform:rotate(-45deg)scale(.5)}.rvv-button[data-open=true] .rvv-button-icon--close{opacity:1;transform:rotate(0)scale(1)}.rvv-button-label{flex:1 0 auto}@media (width<=480px){.rvv-button--trigger-fixed{bottom:16px}.rvv-button--trigger-fixed[data-position=right]{right:16px}.rvv-button--trigger-fixed[data-position=left]{left:16px}}@media (width<=460px){html.rvv-mobile-open,html.rvv-mobile-open>body{position:static!important;overflow:hidden!important;transform:none!important}}.rvv-popover{background-color:var(--rvv-color-background);border-radius:var(--rvv-border-radius,var(--radius-base));box-shadow:var(--rvv-shadow-base);opacity:0;transform-origin:100% 100%;max-width:100%;transition:opacity .15s ease,transform .15s ease,display allow-discrete .15s,overlay allow-discrete .15s;z-index:var(--rvv-z-index);display:none;position:fixed;bottom:84px;right:24px;overflow:hidden;transform:translateY(6px)scale(.99)}.rvv-popover.open{opacity:1;display:flex;transform:translateY(0)scale(1)}@media (width>=461px){.rvv-popover.expanded .rvv-popover-wrapper{height:calc(100dvh - 108px);width:min(max(700px,var(--rvv-width)),calc(100vw - 48px))}}@starting-style{.rvv-popover.open{opacity:0;transform:translateY(6px)scale(.99)}}.rvv-popover iframe{border:none;width:100%;min-height:100%}.rvv-popover-wrapper{--rvv-width:400px;--rvv-height:600px;height:var(--rvv-height);min-width:360px;min-height:400px;width:var(--rvv-width);transition:width .32s cubic-bezier(.4,0,.2,1),height .32s cubic-bezier(.4,0,.2,1)}@media (width<=460px){.rvv-popover{transform-origin:bottom;border-radius:0;width:100%;max-width:none;height:100%;max-height:none;inset:0}.rvv-popover-wrapper{height:100%;min-height:unset;min-width:unset;width:100%}}.rvv-drawer{pointer-events:none;z-index:var(--rvv-z-index);background-color:#0000;transition:background-color .35s;position:fixed;inset:0}.rvv-drawer.open{pointer-events:auto;background-color:#0006}.rvv-drawer.open .rvv-drawer-wrapper{transform:translate(0)}.rvv-drawer-wrapper{--rvv-width:420px;background-color:var(--rvv-color-background);width:var(--rvv-width);transition:transform .35s cubic-bezier(.4,0,.2,1);position:absolute;top:0;bottom:0;right:0;overflow:hidden;transform:translate(100%);box-shadow:-4px 0 24px #0000001f}.rvv-drawer-wrapper iframe{border:none;width:100%;height:100%;display:block}@media (width<=480px){.rvv-drawer-wrapper{width:100vw}}dialog.rvv-dialog{border-radius:var(--rvv-border-radius,var(--radius-base));opacity:0;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);transition:opacity .2s ease,transform .2s ease,display allow-discrete .2s,overlay allow-discrete .2s;background:0 0;border:none;margin:auto;padding:0;overflow:visible;transform:scale(.96)translateY(10px)}dialog.rvv-dialog[open]{opacity:1;transform:scale(1)translateY(0)}@starting-style{dialog.rvv-dialog[open]{opacity:0;transform:scale(.96)translateY(10px)}}dialog.rvv-dialog::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transition:opacity .2s ease,display allow-discrete .2s,overlay allow-discrete .2s;background:#00000080}dialog.rvv-dialog[open]::backdrop{opacity:1}@starting-style{dialog.rvv-dialog[open]::backdrop{opacity:0}}@media (width>=461px){dialog.rvv-dialog.expanded .rvv-dialog-wrapper{height:calc(100dvh - 48px);width:min(max(700px,var(--rvv-width)),calc(100vw - 48px))}}.rvv-dialog-wrapper{--rvv-width:440px;--rvv-height:600px;background-color:var(--rvv-color-background);border-radius:var(--rvv-border-radius,var(--radius-base));box-shadow:var(--rvv-shadow-base);height:var(--rvv-height);width:var(--rvv-width);transition:width .32s cubic-bezier(.4,0,.2,1),height .32s cubic-bezier(.4,0,.2,1);overflow:hidden}.rvv-dialog-wrapper iframe{border:none;width:100%;height:100%;display:block}@media (width<=460px){dialog.rvv-dialog{border-radius:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;inset:0}.rvv-dialog-wrapper{border-radius:0;width:100%;height:100dvh}}
package/dist/css/popover.css CHANGED
@@ -1 +1 @@
1
- @layer tokens{:root{--rvv-z-index:10002;--rvv-color-background:#fff;--rvv-color-foreground:#151426;--rvv-shadow-base:0 2px 12px 0 #0000001a;--rvv-shadow-base-hover:0 2px 12px 0 #0000004d;--radius-base:10px;--rvv-button-color:var(--rvv-color-foreground);--rvv-button-text-color:#fff}}.rvv-button{all:unset;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;justify-content:center;align-items:center;gap:8px;font-family:inherit;line-height:1;display:inline-flex}.rvv-button--trigger{background-color:var(--rvv-button-color);border-radius:var(--rvv-button-border-radius,9999px);box-shadow:var(--rvv-shadow-base);color:var(--rvv-button-text-color);white-space:nowrap;padding:12px 20px;font-size:15px;font-weight:500;transition:transform .15s,box-shadow .15s}.rvv-button--trigger:hover{background-color:var(--rvv-button-color);color:var(--rvv-button-text-color);transform:scale(1.05)}.rvv-button--trigger:active,.rvv-button--trigger:hover{box-shadow:var(--rvv-shadow-base-hover)}.rvv-button--trigger:active{transform:scale(.95)}.rvv-button--trigger-fixed{z-index:calc(var(--rvv-z-index) - 1);position:fixed;bottom:24px}.rvv-button--trigger-fixed[data-position=right]{right:24px}.rvv-button--trigger-fixed[data-position=left]{left:24px}.rvv-button:has(.rvv-button-icon):not(:has(.rvv-button-label)){padding:12px}.rvv-button-icon{flex-shrink:0;justify-content:center;align-items:center;font-size:1.15em;display:inline-flex;position:relative}.rvv-button-icon svg{fill:currentColor;width:1em;height:1em}.rvv-button-icon--close,.rvv-button-icon--open{justify-content:center;align-items:center;transition:opacity .2s,transform .2s;display:inline-flex}.rvv-button-icon--close{opacity:0;position:absolute;inset:0;transform:rotate(45deg)scale(.5)}.rvv-button[data-open=true] .rvv-button-icon--open{opacity:0;transform:rotate(-45deg)scale(.5)}.rvv-button[data-open=true] .rvv-button-icon--close{opacity:1;transform:rotate(0)scale(1)}.rvv-button-label{flex:1 0 auto}@media (width<=480px){.rvv-button--trigger-fixed{bottom:16px}.rvv-button--trigger-fixed[data-position=right]{right:16px}.rvv-button--trigger-fixed[data-position=left]{left:16px}}@media (width<=460px){html.rvv-mobile-open,html.rvv-mobile-open>body{position:static!important;overflow:hidden!important;transform:none!important}}.rvv-popover{background-color:var(--rvv-color-background);border-radius:var(--rvv-border-radius,var(--radius-base));box-shadow:var(--rvv-shadow-base);opacity:0;transform-origin:100% 100%;max-width:100%;transition:opacity .15s ease,transform .15s ease,display allow-discrete .15s,overlay allow-discrete .15s;z-index:var(--rvv-z-index);display:none;position:fixed;bottom:84px;right:24px;overflow:hidden;transform:translateY(6px)scale(.99)}.rvv-popover.open{opacity:1;display:flex;transform:translateY(0)scale(1)}@starting-style{.rvv-popover.open{opacity:0;transform:translateY(6px)scale(.99)}}.rvv-popover iframe{border:none;width:100%;min-height:100%}.rvv-popover-wrapper{--rvv-width:400px;--rvv-height:600px;height:var(--rvv-height);min-width:360px;min-height:400px;width:var(--rvv-width)}@media (width<=460px){.rvv-popover{transform-origin:bottom;border-radius:0;width:100%;max-width:none;height:100%;max-height:none;inset:0}.rvv-popover-wrapper{height:100%;min-height:unset;min-width:unset;width:100%}}
1
+ @layer tokens{:root{--rvv-z-index:10002;--rvv-color-background:#fff;--rvv-color-foreground:#151426;--rvv-shadow-base:0 2px 12px 0 #0000001a;--rvv-shadow-base-hover:0 2px 12px 0 #0000004d;--radius-base:10px;--rvv-button-color:var(--rvv-color-foreground);--rvv-button-text-color:#fff}}.rvv-button{all:unset;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;justify-content:center;align-items:center;gap:8px;font-family:inherit;line-height:1;display:inline-flex}.rvv-button--trigger{background-color:var(--rvv-button-color);border-radius:var(--rvv-button-border-radius,9999px);box-shadow:var(--rvv-shadow-base);color:var(--rvv-button-text-color);white-space:nowrap;padding:12px 20px;font-size:15px;font-weight:500;transition:transform .15s,box-shadow .15s}.rvv-button--trigger:hover{background-color:var(--rvv-button-color);color:var(--rvv-button-text-color);transform:scale(1.05)}.rvv-button--trigger:active,.rvv-button--trigger:hover{box-shadow:var(--rvv-shadow-base-hover)}.rvv-button--trigger:active{transform:scale(.95)}.rvv-button--trigger-fixed{z-index:calc(var(--rvv-z-index) - 1);position:fixed;bottom:24px}.rvv-button--trigger-fixed[data-position=right]{right:24px}.rvv-button--trigger-fixed[data-position=left]{left:24px}.rvv-button:has(.rvv-button-icon):not(:has(.rvv-button-label)){padding:12px}.rvv-button-icon{flex-shrink:0;justify-content:center;align-items:center;font-size:1.15em;display:inline-flex;position:relative}.rvv-button-icon svg{fill:currentColor;width:1em;height:1em}.rvv-button-icon--close,.rvv-button-icon--open{justify-content:center;align-items:center;transition:opacity .2s,transform .2s;display:inline-flex}.rvv-button-icon--close{opacity:0;position:absolute;inset:0;transform:rotate(45deg)scale(.5)}.rvv-button[data-open=true] .rvv-button-icon--open{opacity:0;transform:rotate(-45deg)scale(.5)}.rvv-button[data-open=true] .rvv-button-icon--close{opacity:1;transform:rotate(0)scale(1)}.rvv-button-label{flex:1 0 auto}@media (width<=480px){.rvv-button--trigger-fixed{bottom:16px}.rvv-button--trigger-fixed[data-position=right]{right:16px}.rvv-button--trigger-fixed[data-position=left]{left:16px}}@media (width<=460px){html.rvv-mobile-open,html.rvv-mobile-open>body{position:static!important;overflow:hidden!important;transform:none!important}}.rvv-popover{background-color:var(--rvv-color-background);border-radius:var(--rvv-border-radius,var(--radius-base));box-shadow:var(--rvv-shadow-base);opacity:0;transform-origin:100% 100%;max-width:100%;transition:opacity .15s ease,transform .15s ease,display allow-discrete .15s,overlay allow-discrete .15s;z-index:var(--rvv-z-index);display:none;position:fixed;bottom:84px;right:24px;overflow:hidden;transform:translateY(6px)scale(.99)}.rvv-popover.open{opacity:1;display:flex;transform:translateY(0)scale(1)}@media (width>=461px){.rvv-popover.expanded .rvv-popover-wrapper{height:calc(100dvh - 108px);width:min(max(700px,var(--rvv-width)),calc(100vw - 48px))}}@starting-style{.rvv-popover.open{opacity:0;transform:translateY(6px)scale(.99)}}.rvv-popover iframe{border:none;width:100%;min-height:100%}.rvv-popover-wrapper{--rvv-width:400px;--rvv-height:600px;height:var(--rvv-height);min-width:360px;min-height:400px;width:var(--rvv-width);transition:width .32s cubic-bezier(.4,0,.2,1),height .32s cubic-bezier(.4,0,.2,1)}@media (width<=460px){.rvv-popover{transform-origin:bottom;border-radius:0;width:100%;max-width:none;height:100%;max-height:none;inset:0}.rvv-popover-wrapper{height:100%;min-height:unset;min-width:unset;width:100%}}
package/dist/package.cjs CHANGED
@@ -45,12 +45,15 @@ function createFloatingBindings({ factory, buildStableDeps }) {
45
45
  function useEmbed(props) {
46
46
  const instanceRef = (0, react.useRef)(null);
47
47
  const [isOpen, setIsOpen] = (0, react.useState)(false);
48
+ const [isExpanded, setIsExpanded] = (0, react.useState)(false);
48
49
  (0, react.useEffect)(() => {
49
50
  const instance = factory(props);
50
51
  instanceRef.current = instance;
51
52
  setIsOpen(instance.isOpen());
53
+ setIsExpanded(instance.isExpanded());
52
54
  const unsubscribe = instance.subscribe(() => {
53
55
  setIsOpen(instance.isOpen());
56
+ setIsExpanded(instance.isExpanded());
54
57
  });
55
58
  return () => {
56
59
  unsubscribe();
@@ -63,7 +66,10 @@ function createFloatingBindings({ factory, buildStableDeps }) {
63
66
  close: () => void instanceRef.current?.close(),
64
67
  toggle: () => void instanceRef.current?.toggle(),
65
68
  refresh: () => void instanceRef.current?.refresh(),
66
- focus: () => void instanceRef.current?.focus()
69
+ focus: () => void instanceRef.current?.focus(),
70
+ expand: () => void instanceRef.current?.expand(),
71
+ collapse: () => void instanceRef.current?.collapse(),
72
+ toggleExpand: () => void instanceRef.current?.toggleExpand()
67
73
  }), []);
68
74
  const getTriggerProps = (0, react.useCallback)(() => ({
69
75
  type: "button",
@@ -74,10 +80,12 @@ function createFloatingBindings({ factory, buildStableDeps }) {
74
80
  return (0, react.useMemo)(() => ({
75
81
  ...handlers,
76
82
  isOpen,
83
+ isExpanded,
77
84
  getTriggerProps
78
85
  }), [
79
86
  handlers,
80
87
  isOpen,
88
+ isExpanded,
81
89
  getTriggerProps
82
90
  ]);
83
91
  }
@@ -85,7 +93,7 @@ function createFloatingBindings({ factory, buildStableDeps }) {
85
93
  useEmbed,
86
94
  Embed: (0, react.memo)(function FloatingEmbed(props) {
87
95
  const { asChild, children, className, style, onClick, ref, ...embedProps } = props;
88
- const { getTriggerProps, focus, close, open, toggle, refresh } = useEmbed(embedProps);
96
+ const { getTriggerProps, focus, close, open, toggle, refresh, expand, collapse, toggleExpand } = useEmbed(embedProps);
89
97
  const trigger = getTriggerProps();
90
98
  const composedOnClick = (event) => {
91
99
  onClick?.(event);
@@ -96,13 +104,19 @@ function createFloatingBindings({ factory, buildStableDeps }) {
96
104
  focus,
97
105
  open,
98
106
  refresh,
99
- toggle
107
+ toggle,
108
+ expand,
109
+ collapse,
110
+ toggleExpand
100
111
  }), [
101
112
  focus,
102
113
  close,
103
114
  open,
104
115
  toggle,
105
- refresh
116
+ refresh,
117
+ expand,
118
+ collapse,
119
+ toggleExpand
106
120
  ]);
107
121
  if (asChild) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Slot, {
108
122
  type: trigger.type,
package/dist/package.mjs CHANGED
@@ -44,12 +44,15 @@ function createFloatingBindings({ factory, buildStableDeps }) {
44
44
  function useEmbed(props) {
45
45
  const instanceRef = useRef(null);
46
46
  const [isOpen, setIsOpen] = useState(false);
47
+ const [isExpanded, setIsExpanded] = useState(false);
47
48
  useEffect(() => {
48
49
  const instance = factory(props);
49
50
  instanceRef.current = instance;
50
51
  setIsOpen(instance.isOpen());
52
+ setIsExpanded(instance.isExpanded());
51
53
  const unsubscribe = instance.subscribe(() => {
52
54
  setIsOpen(instance.isOpen());
55
+ setIsExpanded(instance.isExpanded());
53
56
  });
54
57
  return () => {
55
58
  unsubscribe();
@@ -62,7 +65,10 @@ function createFloatingBindings({ factory, buildStableDeps }) {
62
65
  close: () => void instanceRef.current?.close(),
63
66
  toggle: () => void instanceRef.current?.toggle(),
64
67
  refresh: () => void instanceRef.current?.refresh(),
65
- focus: () => void instanceRef.current?.focus()
68
+ focus: () => void instanceRef.current?.focus(),
69
+ expand: () => void instanceRef.current?.expand(),
70
+ collapse: () => void instanceRef.current?.collapse(),
71
+ toggleExpand: () => void instanceRef.current?.toggleExpand()
66
72
  }), []);
67
73
  const getTriggerProps = useCallback(() => ({
68
74
  type: "button",
@@ -73,10 +79,12 @@ function createFloatingBindings({ factory, buildStableDeps }) {
73
79
  return useMemo(() => ({
74
80
  ...handlers,
75
81
  isOpen,
82
+ isExpanded,
76
83
  getTriggerProps
77
84
  }), [
78
85
  handlers,
79
86
  isOpen,
87
+ isExpanded,
80
88
  getTriggerProps
81
89
  ]);
82
90
  }
@@ -84,7 +92,7 @@ function createFloatingBindings({ factory, buildStableDeps }) {
84
92
  useEmbed,
85
93
  Embed: memo(function FloatingEmbed(props) {
86
94
  const { asChild, children, className, style, onClick, ref, ...embedProps } = props;
87
- const { getTriggerProps, focus, close, open, toggle, refresh } = useEmbed(embedProps);
95
+ const { getTriggerProps, focus, close, open, toggle, refresh, expand, collapse, toggleExpand } = useEmbed(embedProps);
88
96
  const trigger = getTriggerProps();
89
97
  const composedOnClick = (event) => {
90
98
  onClick?.(event);
@@ -95,13 +103,19 @@ function createFloatingBindings({ factory, buildStableDeps }) {
95
103
  focus,
96
104
  open,
97
105
  refresh,
98
- toggle
106
+ toggle,
107
+ expand,
108
+ collapse,
109
+ toggleExpand
99
110
  }), [
100
111
  focus,
101
112
  close,
102
113
  open,
103
114
  toggle,
104
- refresh
115
+ refresh,
116
+ expand,
117
+ collapse,
118
+ toggleExpand
105
119
  ]);
106
120
  if (asChild) return /* @__PURE__ */ jsx(Slot, {
107
121
  type: trigger.type,
package/dist/types/src/internal/create-floating-bindings.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { EmbedFloating } from '@revvue/embed';
2
2
  import { ComponentType, CSSProperties, MouseEvent, ReactNode, RefObject } from 'react';
3
3
  import { SlotInjectedProps } from './slot';
4
- type FloatingHandlers = Pick<EmbedFloating, "open" | "close" | "toggle" | "refresh" | "focus">;
4
+ type FloatingHandlers = Pick<EmbedFloating, "open" | "close" | "toggle" | "refresh" | "focus" | "expand" | "collapse" | "toggleExpand">;
5
5
  /**
6
6
  * Imperative API the hook returns to the consumer. `getTriggerProps()` is the
7
7
  * escape hatch for "I want to render my own trigger element" — spread it onto
@@ -10,6 +10,8 @@ type FloatingHandlers = Pick<EmbedFloating, "open" | "close" | "toggle" | "refre
10
10
  export interface UseFloatingResult extends FloatingHandlers {
11
11
  /** Mirrors the underlying instance's open state. Drives `aria-expanded`. */
12
12
  isOpen: boolean;
13
+ /** Mirrors the underlying instance's expanded state. */
14
+ isExpanded: boolean;
13
15
  /** Spread onto the trigger element to wire click + aria attrs. */
14
16
  getTriggerProps: () => SlotInjectedProps & {
15
17
  type: "button";
package/dist/types/src/internal/create-floating-bindings.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"create-floating-bindings.d.ts","sourceRoot":"","sources":["../../../../src/internal/create-floating-bindings.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EACL,KAAK,aAAa,EAClB,KAAK,aAAa,EAClB,KAAK,UAAU,EAEf,KAAK,SAAS,EACd,KAAK,SAAS,EAOf,MAAM,OAAO,CAAC;AACf,OAAO,EAAQ,KAAK,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAMtD,KAAK,gBAAgB,GAAG,IAAI,CAAC,aAAa,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC,CAAC;AAE/F;;;;GAIG;AACH,MAAM,WAAW,iBAAkB,SAAQ,gBAAgB;IACzD,4EAA4E;IAC5E,MAAM,EAAE,OAAO,CAAC;IAChB,kEAAkE;IAClE,eAAe,EAAE,MAAM,iBAAiB,GAAG;QAAE,IAAI,EAAE,QAAQ,CAAA;KAAE,CAAC;CAC/D;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,sBAAsB;IACrC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACnD,GAAG,CAAC,EAAE,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;CAC1C;AAED,MAAM,WAAW,gBAAgB,CAAC,MAAM;IACtC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,iBAAiB,CAAC;IAC/C,KAAK,EAAE,aAAa,CAAC,MAAM,GAAG,sBAAsB,CAAC,CAAC;CACvD;AAMD,MAAM,WAAW,6BAA6B,CAAC,MAAM,EAAE,SAAS,SAAS,aAAa;IACpF;;;;OAIG;IACH,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IACtC;;;;OAIG;IACH,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,EAAE,CAAC;CAC/C;AAED;;;;;GAKG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,SAAS,SAAS,aAAa,EAAE,EAC9E,OAAO,EACP,eAAe,EAChB,EAAE,6BAA6B,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,gBAAgB,CAAC,MAAM,CAAC,CAmG7E"}
1
+ {"version":3,"file":"create-floating-bindings.d.ts","sourceRoot":"","sources":["../../../../src/internal/create-floating-bindings.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EACL,KAAK,aAAa,EAClB,KAAK,aAAa,EAClB,KAAK,UAAU,EAEf,KAAK,SAAS,EACd,KAAK,SAAS,EAOf,MAAM,OAAO,CAAC;AACf,OAAO,EAAQ,KAAK,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAMtD,KAAK,gBAAgB,GAAG,IAAI,CAAC,aAAa,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,UAAU,GAAG,cAAc,CAAC,CAAC;AAExI;;;;GAIG;AACH,MAAM,WAAW,iBAAkB,SAAQ,gBAAgB;IACzD,4EAA4E;IAC5E,MAAM,EAAE,OAAO,CAAC;IAChB,wDAAwD;IACxD,UAAU,EAAE,OAAO,CAAC;IACpB,kEAAkE;IAClE,eAAe,EAAE,MAAM,iBAAiB,GAAG;QAAE,IAAI,EAAE,QAAQ,CAAA;KAAE,CAAC;CAC/D;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,sBAAsB;IACrC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACnD,GAAG,CAAC,EAAE,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;CAC1C;AAED,MAAM,WAAW,gBAAgB,CAAC,MAAM;IACtC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,iBAAiB,CAAC;IAC/C,KAAK,EAAE,aAAa,CAAC,MAAM,GAAG,sBAAsB,CAAC,CAAC;CACvD;AAMD,MAAM,WAAW,6BAA6B,CAAC,MAAM,EAAE,SAAS,SAAS,aAAa;IACpF;;;;OAIG;IACH,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IACtC;;;;OAIG;IACH,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,EAAE,CAAC;CAC/C;AAED;;;;;GAKG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,SAAS,SAAS,aAAa,EAAE,EAC9E,OAAO,EACP,eAAe,EAChB,EAAE,6BAA6B,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,gBAAgB,CAAC,MAAM,CAAC,CA4G7E"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@revvue/embed-react",
3
- "version": "0.1.6",
3
+ "version": "0.1.7",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "publishConfig": {
@@ -35,7 +35,7 @@
35
35
  }
36
36
  },
37
37
  "dependencies": {
38
- "@revvue/embed": "0.1.6"
38
+ "@revvue/embed": "0.1.7"
39
39
  },
40
40
  "devDependencies": {
41
41
  "@testing-library/jest-dom": "^6.6.3",