Commit Graph

8077 Commits

Author SHA1 Message Date
Kevin Ansfield
04fe62012d Dropped deprecated {{action}} usage in callout card and removed
no issue

- `{{action}}` is deprecated and is only available for backwards compatibility with action hashes in non-Glimmer components
- for event handlers we should be using the `{{on}}` modifier to use `addEventListener` on an element rather than directly attaching JS functions using `onclick=` attributes to avoid subtle DOM event ordering bugs
2021-11-15 17:37:29 +00:00
Thibaut Patel
be60693189 Partially revert changes from previous commit
refs 35db77e342

- This wasn't affecting HTML replacement so it had no reason to go
2021-11-15 18:31:09 +01:00
Thibaut Patel
35db77e342 Removed email-specific code from the html textarea
refs https://github.com/TryGhost/Team/issues/1206

- prevents text in curly brakets from being wrapped into a <code> tag
- updated the callout card to this generic textarea editor instead of the email-specific editor
2021-11-15 17:58:01 +01:00
Kevin Ansfield
5268ad1f77 Swapped feature card setting for isAvailable
no issue

- the number of properties that cards have in their definition was growing so it made sense to drop the single-use `feature` property in favor of the `isAvailable` property that can perform the same functionality
2021-11-15 16:43:44 +00:00
Kevin Ansfield
4ca14b8eee 🐛 Fixed Unsplash image selector being available in editor when disabled
closes https://github.com/TryGhost/Team/issues/1223

It's possible to disable the Unsplash integration from the integration settings but when disabled the image selector was still available for post feature images and as an editor embed option.

- adds `isAvailable` property to card definitions, if it's set it should be a string that matches a config/setting that determines the card's availability
  - unsplash card updated to use `'settings.unsplash'` as it's `isAvailable` property
- adds conditional to `<GhEditorFeatureImage>` so the Unsplash selector is only shown when enabled to bring it inline with the `<GhImageUploader>` component that was used previously for post feature images
2021-11-15 16:38:57 +00:00
Kevin Ansfield
7c70211afe Fixed linter error 2021-11-15 14:30:21 +00:00
Kevin Ansfield
601727e50c Removed "zoom" in gif selector in favor of instant-insert
refs https://github.com/TryGhost/Team/issues/1220

- there's no options for individual gifs like there are with Unsplash images and there's no real need to zoom for gifs that are already fairly small so the extra zoom step is unnecessary
2021-11-15 14:27:22 +00:00
Kevin Ansfield
a9ae15b1a5 Added responsive column count to gif selector
refs https://github.com/TryGhost/Team/issues/1220

- added resize observer and cut-off widths for number of columns to auto-adjust based on the size of the selector's container
- fixed error when tenor service is unavailable due to missing `retry` action
2021-11-15 14:27:22 +00:00
Fabien O'Carroll
747e6c9533 Handled missing html property for NFT Oembed response
refs https://github.com/TryGhost/Team/issues/1211

Since we have switched to rendering the NFT card outside of the OEmbed
response we no longer include a html property. This check would throw
for missing HTML so we've updated it to not include NFT cards
2021-11-15 15:49:42 +02:00
Fabien O'Carroll
b8dd7c6af2 Revert "Added support for no-iframed embeds"
This reverts commit 8e29e8de79.
2021-11-15 15:49:42 +02:00
Fabien O'Carroll
dad82ec463 Revert "Fixed embeds without iframe resizing iframe"
This reverts commit 85c8674299.
2021-11-15 15:49:42 +02:00
Daniel Lockyer
584cb7940a Merged v4.22.3 into main
v4.22.3
2021-11-15 13:44:35 +00:00
Daniel Lockyer
cd5eb77ac6 v4.22.3 2021-11-15 13:43:15 +00:00
Thibaut Patel
82ccb36338 Added an emoji picker for the callout card
refs https://github.com/TryGhost/Team/issues/1206

- Uses https://emoji-button.js.org/ for the emoji panel and search
- Displayed when the callout card emoji is clicked
2021-11-15 14:19:20 +01:00
Sanne de Vries
e2f149ca45 Updated callout icon in card menu
Refs https://github.com/TryGhost/Team/issues/1206
2021-11-15 13:47:36 +01:00
Rishabh
a5c0116e0b Updated design for toggle card in edit mode
refs https://github.com/TryGhost/Team/issues/1209
2021-11-15 16:50:53 +05:30
Sanne de Vries
c621fe0843 Updated padding for callout cards 2021-11-15 11:17:21 +01:00
Fabien O'Carroll
0f839a9d27 Added child component for NFT Embeds
refs https://github.com/TryGhost/Team/issues/1211

We've moved the rendering of HTML outside of the OEmbed endpoint - so
the Admin needs to handle constructing the HTML from the OEmbed response
metadata.
2021-11-15 11:02:27 +02:00
Fabien O'Carroll
85c8674299 Fixed embeds without iframe resizing iframe
refs https://github.com/TryGhost/Admin/commit/8e29e8de7

The listener for resize is added on the first render of the component,
so we cannot check for the existence of the iframe then.
2021-11-15 11:01:37 +02:00
Kevin Ansfield
cd6d167f77 Added repositioning of settings panel when it's size adjusts
refs https://github.com/TryGhost/Team/issues/1219

- added optional `adjustOnResize` argument to `{{movable}}` modifier
  - when the movable element's size changes (based on a `ResizeObserver` event) the passed in action is called with the element and the current x/y position
  - having this handled via the `{{movable}}` modifier is needed because that's what knows about any CSS translations that are present and allows the drag position to remain in sync with any resize-related adjustments
  - return value of the action is expected to be a new `{x, y}` tuple
- used `adjustOnResize` in the `<KoenigSettingsPanel>` component so that any time the settings panel grows and causes part of it to be off-screen we re-position so that the whole panel is kept on-screen
2021-11-12 18:45:03 +00:00
Kevin Ansfield
6853b964f8 First iteration of gifs image selector + card
refs https://github.com/TryGhost/Team/issues/1217

- adds `tenor` service that acts as a coordinator for the Tenor API similar to the `unsplash` service
- adds `<GhTenor>` component that renders an image search and select modal using the `tenor` service
- swapped the gifs card over to use the `tenor` image selector so it opens the tenor modal instead of the unsplash modal
2021-11-12 16:10:26 +00:00
Daniel Lockyer
0bc5d322d4 v4.22.2 2021-11-12 16:00:24 +00:00
Kevin Ansfield
c128998d86 Fixed dropdown elements staying open/fixed when moving settings panel
refs https://github.com/TryGhost/Team/issues/1219

- added `dropdown.closeDropdowns()` to the `{{movable}}` modifier when dragging starts
- updated ember-power-select derived inputs to close their dropdowns when the dropdown service triggers it's `'close'` event
2021-11-12 15:27:08 +00:00
Peter Zimon
f112bd06c9 NFT card style refinements 2021-11-12 15:55:35 +01:00
Peter Zimon
690d34eebb Updated NFT card styles 2021-11-12 14:02:15 +01:00
Kevin Ansfield
e289b391f1 🐛 Fixed install of free themes from the marketplace that aren't in the built-in list
no issue

When we were given a source+ref we were using that to find a theme object from the built-in list of marketplace themes and if it wasn't found redirecting to the change-theme screen. That redirect didn't need to happen because we only need the `ref` and can determine the theme name from that.

- passed `ref` through to the install modal as a data argument
- updated install modal to get theme name from passed in theme or extracted from passed in `ref` when theme is not known
- adjusted "isDefaultTheme" so it always checks against Casper rather than using the `ref: 'default'` value from the list of marketplace themes
2021-11-12 12:57:25 +00:00
Rishabh
b4415830e6 Refined design for toggle card in edit mode
refs https://github.com/TryGhost/Team/issues/1209
2021-11-12 16:31:39 +05:30
Rishabh
5e01b94bb1 Fixed default tag override not working on edits for html input component
no refs

- we added a default tag override for basic html input component, but the edit mode was still using `p` as the tag irrespective of default set, which caused switching back to p tag when editing the component
2021-11-12 16:31:39 +05:30
Rishabh
57b318de52 Added new html textarea component
refs https://github.com/TryGhost/Team/issues/1209

- adds new `KoenigHtmlTextarea` component for entering multi line html in cards
- updates accordion card to use html text area component
2021-11-12 16:31:39 +05:30
Kevin Ansfield
6190feb0b9 Added gifs card to card menu
refs https://github.com/TryGhost/Team/issues/1217

- behind the `gifsCard` feature flag
- currently maps to the unsplash image selector whilst we're building out an alternative selector
2021-11-12 10:09:36 +00:00
Naz
b42271d87c Added "urlCache" labs alpha flag
closes https://github.com/TryGhost/Toolbox/issues/126

- A flag go control the experimental URL Cache alpha feature
2021-11-12 12:29:18 +04:00
Renovate Bot
2e668d0d41 Update dependency @tryghost/timezone-data to v0.2.51 2021-11-11 16:23:57 +00:00
Renovate Bot
2eb9a08c27 Update dependency @tryghost/helpers to v1.1.53 2021-11-11 16:23:51 +00:00
Kevin Ansfield
fe07578905 Added GIFs card labs flag
refs https://github.com/TryGhost/Team/issues/1217

- labs flag for adding a gif selector in a similar fashion to our Unsplash image selector
2021-11-11 15:12:57 +00:00
Sanne de Vries
549f89084f Updated callout-card color picker
Refs https://github.com/TryGhost/Team/issues/1206

- Replaced select component for color palette picker
- Added support for brand color
2021-11-11 15:48:14 +01:00
Kevin Ansfield
69dbabb5c1 Added support for copy/pasting Wordpress and Substack buttons into editor
refs https://github.com/TryGhost/Team/issues/1214

- bumped `@tryghost/kg-plugin-parsers` to add support for Wordpress/Substack style button html in paste events

Example Wordpress html:
```html
<div class="wp-block-buttons">
    <div class="wp-block-button">
        <a href="https://example.com" class="wp-block-button__link">
            Testing  button
        </a>
    </div>
</div>
```

Example Substack html:
```html
<a class="button primary" href="https://ghost.org">
    <span>Custom Button</span>
</a>
```
2021-11-11 14:31:32 +00:00
djordje vlaisavljevic
8f73a4e39b Updated Accordion card container and styles 2021-11-11 15:18:29 +01:00
Peter Zimon
e106188d39 Updated Button card menu icon 2021-11-11 14:26:21 +01:00
Fabien O'Carroll
8e29e8de79 Added support for no-iframed embeds
refs https://github.com/TryGhost/Team/issues/1211

This is to allow us to style the NFT embed card in the Admin
2021-11-11 13:46:26 +02:00
Rishabh
d3cfa14498 Allowed custom default tag for html input component
no refs

- allows custom html tag to be passed in to basic html input component
- updates accordion heading input to use basic html input with h4 tag
2021-11-11 16:49:04 +05:30
Rishabh
697420957c Refined toggle card design in edit mode
refs https://github.com/TryGhost/Team/issues/1209
2021-11-11 16:49:04 +05:30
Peter Zimon
6a8976a683 Updated copy for Button card tooltip 2021-11-11 12:05:36 +01:00
Kevin Ansfield
49d32c4ca4 Added "incomplete" state for button card
refs https://github.com/TryGhost/Team/issues/1210

- when rendered, show button as greyed out if either text or url is missing
  - show "Add button URL" in tooltip if the url is missing
  - show "Add button text" in button if the text is missing
- adds wrapper element so the tooltip is not greyed out
2021-11-11 09:24:20 +00:00
Thibaut Patel
4647c45102 Updated the callout card parsing
refs https://github.com/TryGhost/Team/issues/1205

- support for optional emoji and background color
2021-11-10 18:32:12 +01:00
Thibaut Patel
276841a523 Added background color config for the callout card
refs https://github.com/TryGhost/Team/issues/1205

- Stored in the payload as an hexadecimal (or variable) value
- chosen with a dropdown through a pre-selected list of colors (or the publication accent color)
2021-11-10 18:31:00 +01:00
Thibaut Patel
075d529e65 Added an emoji toggle for the callout card
refs https://github.com/TryGhost/Team/issues/1205

- Uses the KoenigSettingsPanel to display a toggle
- The Emoji is set to an empty string when disabled
- And arbitrarily set to 💡 by default when toggled back on
2021-11-10 15:51:16 +01:00
Kevin Ansfield
e51bcec5f1 Fixed email-cta card not auto-deleting when button is disabled but has content
no issue

- if the `showButton` property is `false`, auto-delete the card when leaving edit mode if the card has no rich-text content
2021-11-10 14:50:02 +00:00
Kevin Ansfield
2625199fb2 Removed duplication of "delete if empty" card logic
no issue

The logic for "delete if empty" was duplicated in two places:

1. when `createComponentCard` is used to register a card, this option method was used when cleaning up a post when first rendering (cards in empty state can be saved before the editor auto-removes them but we don't want to show them again)
2. inside of card's own delete-if-empty handling on certain actions such as deselection or leaving edit mode

- added an `ifEmpty` property to each card component
  - used by the editor's first-render cleanup routing if the property is present
  - can be re-used internally for the card's own deselect/exit-edit-mode behaviour
- updated the cleanup routine in `<KoenigEditor>`
  - added a `allComponentCardsRegistered` property that will return `true` when the `.component` property is set on every card (the property is set during card component initialisation so we're at the mercy of Ember's render process so not all card components will be immediately registered)
  - swapped `_cleanup` for `_cleanupTask` that will wait for `allComponentCardsRegistered` to be `true` before performing cleanup, ensuring that we always have access to the card component's `isEmpty` property even when Ember renders cards across multiple render batches
  - checks for `isEmpty` being a boolean and will delete the card if it's value is `true`
- updated all cards that had delete-if-empty behaviour
  - added `isEmpty` properties
  - removed duplicated logic in the `createComponentCard` calls
2021-11-10 14:46:00 +00:00
Rishabh
bfec1a1787 Updated parser plugin to add toggle card
refs https://github.com/TryGhost/Team/issues/1209
2021-11-10 20:14:40 +05:30
Peter Zimon
13b9145a01 Set audience capitalized in Email CTA options 2021-11-10 15:44:21 +01:00