* chore: add new view for two step slot selection for embed
* fix: make sure two step slot selection is false by default
* chore: update embed playground to showcase two step slot selection
* chore: add tests
* chore: update embed snippet generator code to include two step slot selection
* chore: update docs
* fix: back button styling
* chore: implement feedback from cubic
* fix: add missing isEnableTwoStepSlotSelectionVisible properties to test mock store
Co-Authored-By: unknown <>
* chore: implement PR feedback
* chore: update slot selection modal
* chore: add prop to hide available times header
* fix: scope two-step slot selection visibility to mobile only
Restores the isMobile check in the timeslot visibility guard to ensure
desktop embeds continue to show the booking UI when two-step slot
selection is enabled. The feature should only hide the timeslot list
on mobile devices.
Addresses Cubic AI review feedback (confidence 9/10).
Co-Authored-By: unknown <>
* fixup: use translations for loading instead of actual word
* fix: type check
* fix: add window.matchMedia mock for jsdom test environment
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: add window.matchMedia mock to packages/testing/src/setupVitest.ts
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: unit tests failing
* add a width style to the two-step slot selection embed container.
* refactor: rename enableTwoStepSlotSelection to useSlotsViewOnSmallScreen
- Rename external-facing embed config option from enableTwoStepSlotSelection to useSlotsViewOnSmallScreen
- Update URL parameter parsing in embed-iframe.ts
- Update type definitions in types.ts and index.d.ts
- Update internal variable names to slotsViewOnSmallScreen for consistency
- Update documentation, playground examples, and tests
Co-Authored-By: hariom@cal.com <hariombalhara@gmail.com>
* Add config to prefill all booking fields so that slot has confirm button along with it
* chore: implement PR feedback
* fix: move twoStepSlotSelection embed outside misc-embeds div to fix e2e test
The e2e test was failing because the misc-embeds div content was
intercepting pointer events on mobile viewport. This follows the same
pattern used for skeletonDemo - the embed is now outside misc-embeds
and the div is hidden when testing this namespace.
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: prevent pointer event interception in twoStepSlotSelection embed
Hide heading and note elements and set pointer-events: none on container
elements while keeping pointer-events: auto on the iframe container.
This prevents the container from intercepting clicks on the iframe
during mobile viewport e2e tests.
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: hide all non-essential content for twoStepSlotSelection e2e test
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: disable pointer-events on body for twoStepSlotSelection e2e test
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: remove pointer-events: auto on container to let clicks pass through to iframe
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: explicitly set pointer-events: none on container and inline-embed-container
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: also set pointer-events: none on html element to prevent interception
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: make .place div fill viewport for twoStepSlotSelection e2e test
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: failing embed tests
* fixup
* fixup fixup
* fix: failing tests
* fix: update checks for verifying prefilled date
---------
Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Co-authored-by: Peer Richelsen <peeroke@gmail.com>
Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>
* chore: refactor config files to prevent migration tool errors
* refactor: upgrade with the tailwind migration tool
* chore: restore pre-commit command + mc
* refactor(wip): update dependencies and migrate to Tailwind CSS v4 (mainly web)
* chore: resolve Tailwind v4 migration conflicts from merging main
* chore: remove unused Tailwind packages from config and update dependencies for v4 migration
* chore: uncomment Tailwind CSS utility classes in globals.css
* fix: resolve token conflicts between calcom and coss ui
* fix: textarea scrollbar
* Fix CUI-16
* fix: added @tailwindcss/forms plugin and cleaned up CSS classes in various components to remove unnecessary dark mode styles
* fix: selects and inputs of different sizes
* fix: remove unnecessary leading-20 class from modal titles in various components
* fix: update Checkbox component styles to remove unnecessary border on checked state
* fix: clean up styles in RequiresConfirmationController, Checkbox, and Radio components to enhance consistency
* fix: update button and filter component styles to remove unnecessary rounded classes for consistency
* fix: calendar
* fix: update KBarSearch
* fix: refine styles in Empty and Checkbox components for improved consistency
* Fix focus state email input
* fix: update button hover and active states to use 'not-disabled' instead of 'enabled'
* fix: line-height issues
* fix: update class name for muted background in BookingListItem component
* fix: sidebar spacing
* chore: update class names to use new Tailwind CSS color utilities
* fix embed
* chore: upgrade Tailwind CSS to version 4.1.16 and update related dependencies
* Map css variables and add a playground test for heavy css customization
* suggestion for coss-ui
* refactor: update CSS variable usage and clean up styles
- Replace instances of `--cal-brand-color` with `--cal-brand` in embed-related HTML files.
- Remove the now-unnecessary `addAppCssVars` function from the embed core.
- Import theme tokens in the embed core styles for better consistency.
- Clean up whitespace and formatting in CSS files for improved readability.
- Add a comment in `tokens.css` regarding its usage in both embed and webapp contexts.
* Handle within tokens.css instead of fixing coss-ui
* Remove initial, not needed. Also, remove tailwind.config.js as tailwidn scans the html automaically
* fix: examples app breaking
* fix: modal not resizing correctly
* feat: upgrade atoms to tailwind v4
* fix: atoms build breaking
* fix: atoms build breaking
* chore: upgrate examples/base to tailwind 4
* chore: update globals.css
* fix: add missing scheduler css variables
* fix: PlatformAdditionalCalendarSelector
* chore: update global styles
* chore: update tailwindcss and postcss dependencies to stable versions
* chore: remove unneeded class
* fix: dialog and toast animation
* fix: replace flex-shrink-0 with shrink-0 for consistent styling in various components
* fix: dialog modal for Apple connect
* add margin in SaveFilterSegmentButton
* Fix radix button nested states
* add cursor pointer to buttons but keep dsabled state
* Fix commandK selectors and adds cursor pointer
* Fix teams filter
* fix - round checkboxes
* fix filter checkbox
* fix select indicator's margin
* command group font size
* style: fix badge and tooltip radius
* chore: remove unneeded files
* Delete PR_REVIEW_MANAGED_EVENT_REASSIGNMENT.md
* remove ui-playground leftover
* fix: add missing react phone input styles in atoms
* Delete managed-event-reassignment-flow-and-architecture.mermaid
* fix: inter font not loading
* Add theme to skeleton container so that it can support dark mode
* fix: create custom stack-y-* utilities post tw4 upgrade
* fix: typo
* fix: atoms stack class + remove unused css file
* fix default radius valiue
* fix space-y in embed
* fix skeleton background
* Hardcode radius values to match production
* fix border in embed
* add missing externalThemeClass
* feat: create a custom stack-y-* utility
* fix: add stack utility to atom global css
* fix: Skeleton loader class modalbox
* Add stack-y utility in embed
* fix: add missing stack utilities in atoms globals.css
* update yarn.lock
* add popover portla
* update
---------
Co-authored-by: Sean Brydon <sean@cal.com>
Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>
Co-authored-by: Ryukemeister <sahalrajiv6900@gmail.com>
Co-authored-by: cal.com <morgan@cal.com>
Co-authored-by: Eunjae Lee <hey@eunjae.dev>
Co-authored-by: Anik Dhabal Babu <adhabal2002@gmail.com>
2025-11-25 17:32:28 -03:00
Anik Dhabal BabuGitHubDevin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
* fix: add tests for embed
* update
* fix test
* fix: use immediate interpolation for cancel button link
- Change from delayed evaluation (${...}) to immediate interpolation (${...})
- Remove unnecessary fallback value and complex expression
- Remove frame.goto() from cancelBookingThroughEmbed as iframe already at cancel page
- Remove unused page parameter from selectFirstAvailableTimeSlotNextMonth
- This aligns with working pattern from line 294 and avoids parser issues with complex expressions + query params
Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
* chore: fix formatting in testUtils
Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
* fix: read popupCancelUid from URL parameter instead of copying rescheduleUid
The cancel button was using the wrong booking UID because it was copying from
popupRescheduleUid instead of reading from the URL parameter. This caused the
embed iframe to never appear when clicking the cancel button, resulting in test
timeouts.
The test navigates to /?popupCancelUid=<booking_uid> which should be read by
the JavaScript, just like popupRescheduleUid is read from its URL parameter.
Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
* fix
---------
Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
* fix: prevent footer doubling with CSS position absolute for grid layouts
* fix: use :host selector for Shadow DOM compatibility in footer doubling fix
* Add better comments and updae playground to be ab le to test it
---------
Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>
* Add queued booking response table
* Create `RoutingFormResponseRepository`
* Pass `queueFormResponse` param
* Queue up form response if param is passed
* Forward queued form response parma to booker
* Pass `queuedFormResponse` from booker to `handleNewBooking`
* Write queued routing form response
* Type fixes
* Clean up
* Allow dry run to work which wont have any QueuedFormResponse or FormResponse
* Support passing the time when the modal was actually shown to the user and consider that time as the time of form submission
* fix ts error
* Queue -> Response through separate endpoint that would be triggered by
embed
* Make queueResponseId a non-guessable uid
* Change queueFormResponse query param
* fix ts error
* Support useQueuedResponse to record new response data
* revert handleNewBooking
* Remove dead code formResponse
* Refactor use repository
* Unify migration files
* refactor: moved api endpoint to app dir
Signed-off-by: Omar López <zomars@me.com>
* Update formResponse.ts
* Refactor use-queued-response for test
* Add tests
* Fix ts error and unit test. recordFormResponse cant return nullish response
* fix schema
* feat: Support full reuse of preloaded iframe (#21803)
* feat: support updating cal video settings in API v2 (#21784)
* feat: support updating cal video settings in API v2
* chore: update descriptio
* feat: support create event type
* test: add test for updating event type
* test: add test for create event type
* chore: undo openapi
* chore: bump libraries
* Revert "chore: bump libraries"
This reverts commit bdf36d09b021fc531497a7b7ea66ab9c52b7d136.
* chore: bump libraries
---------
Co-authored-by: Lauris Skraucis <lauris.skraucis@gmail.com>
Co-authored-by: supalarry <laurisskraucis@gmail.com>
* fix tests and ts
* Fix tests
* wip-useQueuedResponseEndpoint
* Add one more test
* Change queueFormResponse query param
* wip
* Support useQueuedResponse to record new response data
* Use the update useQueuedResponse endpoint
* self-review addressed
* Use queuedResponse if available in slots/utils
* Add documentation
* Remove use-queued-response from critical-path
---------
Co-authored-by: Udit Takkar <53316345+Udit-takkar@users.noreply.github.com>
Co-authored-by: Lauris Skraucis <lauris.skraucis@gmail.com>
Co-authored-by: supalarry <laurisskraucis@gmail.com>
* Update schema.prisma
* refactor: renamed to avoid react hooks confusion
Signed-off-by: Omar López <zomars@me.com>
---------
Signed-off-by: Omar López <zomars@me.com>
Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>
Co-authored-by: Omar López <zomars@me.com>
Co-authored-by: Udit Takkar <53316345+Udit-takkar@users.noreply.github.com>
Co-authored-by: Lauris Skraucis <lauris.skraucis@gmail.com>
Co-authored-by: supalarry <laurisskraucis@gmail.com>
Co-authored-by: Peer Richelsen <peeroke@gmail.com>
* Revert "fix: DatePicker not showing up in mobile mode when hideEventTypeDetails is true (#17037)"
This reverts commit 1f08bc5a4f.
* Revert "feat: Booker atom enable hiding event details (#16906)"
This reverts commit ba5b9e951a.
* Keep the playground test scenarios
* feat: Support running webapp and embed-core playground on HTTPS. It allows to test SameSite attribute easily in embed
* Update yarn.lock
* feat: Support running webapp and embed-core playground on HTTPS. It allows to test SameSite attribute easily in embed
* Update yarn.lock
* Fix git-setup.sh
* Fix yarn.lock
## What does this PR do?
Fixes#10032
Before:
https://www.loom.com/share/1890e4eebf41426aaf66d8b4909d0765
After:
https://www.loom.com/share/8b00c41587f2467ab05ef48e4ed523ef
## Type of change
<!-- Please delete bullets that are not relevant. -->
- Bug fix (non-breaking change which fixes an issue)
## How should this be tested?
- See loom
## Mandatory Tasks
- [x] Make sure you have self-reviewed the code. A decent size PR without self-review might be rejected.
## Checklist
- I haven't added tests that prove my fix is effective or that my feature works
* Fixes scroll and logo text color
* Add a month_view scenario
* Fix false alarm in logs when namespace is empty string
* In mobile view, we only support mobile layout
* Check for embed mode
* Added embed files for new booker routes.
* Updated nextjs config to redirect to correct embed url.
* Notify embed of booker size after animation completes.
* Don't use animations and 100vh in embed.
* Added booker layout toggles to embed settings (wip)
* Booker header positioning tweaks
* Show correct layout in embed
* Don't show pricing event meta if stripe app is not installed
* Support custom border booker for embed
* wip on passing layout prop to iframe for previews
* Only show booker layout settings in embed-create-popup if booker layout feature is enabled.
* Made layout prop in preview state for embed optional
* Made layout prop in preview state for embed optional
* Get layout toggle working
* Fixed types
* Added themebasis prop
* Fix potential circular import that should then fix type errors
* Fixed type error by fixing casing.
* Type fixes
* Added translations
* More translations
* Remove comment
* Removed uneccessary addition to package.json
* Removed todo since it's solved in another way
---------
Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>
* Fix colorscheme dark on success page due to embed not detected properly there
* Use calNamespace in getEmbediframe
* Fix missing variable
* Update basic.e2e.ts
---------
Co-authored-by: Omar López <zomars@me.com>
* Add strict types
* Make it array
* Make api consistent and support calOrigin in floatingPopup and modal
* Support calOrigin everywhere and fix branding config issue
* Fix styles not being uniformly applied across components
* Fix unused code
* Embed SSG and consistently pass embedType query param across pages
* Embed fixes
* Code cleanup
* Add main class which tells embed which helps in identifying which area is outside the main content
* remove any special optimization handling for routing forms
* Add comments
* Small fixes
* Fix broken team booking page in embed
* Fix Fallback message dark theme
* TS Fixes
* Fixes
* Fix tests
* Remove not required code
Co-authored-by: Peer Richelsen <peeroke@gmail.com>
* Support dark theme in routing form
* Fix Embed detection
* Add routing form embed example
* Better rendering support in dark mode for react-select
* Fix more theme issues
* Added test for Routing Form Embed
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
* Add support to dynamically change the theme
* Add Embed UI in app
* Update UI as per Figma
* Dynamicaly update Embed Code
* Get differnet modes working in preview
* Support Embed on EventType Edit, Team Link Fix and Mobile unsupported
* Fix auto theme switch in Embed Snippet generator
* Fix types
* Self Review fixes
* Remove Embed from App section
* Move get query after the middleware to let middleware work on it
* Add sandboxes in the document
* Add error handling for embed loading
* Fix types
* Update snapshots and fix bug identified by tests
* UI Fixes
* Add Embed Tests
* Respond in preview to width and height
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>