@limetech/lime-elements 37.75.1 → 37.75.3

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.
@@ -101,6 +101,7 @@ section:hover {
101
101
  }
102
102
 
103
103
  img {
104
+ flex-shrink: 0;
104
105
  transition: filter 0.6s ease;
105
106
  object-fit: cover;
106
107
  border-radius: calc(var(--card-border-radius, 0.95rem) / 1.4);
@@ -113,6 +113,7 @@ export const createTriggerPlugin = (triggerCharacters, contentConverter) => {
113
113
  return;
114
114
  }
115
115
  if (!stillHasTrigger(newState, activeTrigger, triggerPosition, triggerText.length)) {
116
+ stopTrigger();
116
117
  return;
117
118
  }
118
119
  const updatedText = processTransactions(triggerText, transactions, oldState);
@@ -1 +1 @@
1
- {"version":3,"file":"factory.js","sourceRoot":"","sources":["../../../../../../src/components/text-editor/prosemirror-adapter/plugins/trigger/factory.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,SAAS,EAA4B,MAAM,mBAAmB,CAAC;AAChF,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAEvE,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAO7C,MAAM,SAAS,GAAG,CACd,GAAW,EACX,aAAiC,EACV,EAAE;EACzB,OAAO,GAAG,CAAC,MAAM,KAAK,CAAC,IAAI,aAAa,CAAC,QAAQ,CAAC,GAAuB,CAAC,CAAC;AAC/E,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,CAAC,KAAkB,EAAW,EAAE;EAClD,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC,SAAS,CAAC;EAElC,IAAI,KAAK,CAAC,GAAG,KAAK,CAAC,EAAE;IACjB,OAAO,IAAI,CAAC;GACf;EAED,gEAAgE;EAChE,MAAM,OAAO,GAAG,KAAK,CAAC,GAAG,GAAG,CAAC,CAAC;EAE9B,IAAI,OAAO,GAAG,CAAC,EAAE;IACb,iEAAiE;IACjE,IAAI,KAAK,CAAC,YAAY,KAAK,CAAC,EAAE;MAC1B,OAAO,IAAI,CAAC;KACf;IAED,MAAM,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IAE3D,OAAO,QAAQ,KAAK,GAAG,IAAI,QAAQ,KAAK,IAAI,CAAC;GAChD;EAED,OAAO,KAAK,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,eAAe,GAAG,CACpB,KAAkB,EAClB,aAAqB,EACrB,eAAuB,EACvB,aAAqB,EACd,EAAE;EACT,MAAM,cAAc,GAAG,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC;EAEjD,IACI,cAAc,GAAG,eAAe;IAChC,cAAc,GAAG,eAAe,GAAG,aAAa,GAAG,CAAC,EACtD;IACE,OAAO,KAAK,CAAC;GAChB;EAED,OAAO,CACH,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,eAAe,EAAE,eAAe,GAAG,CAAC,CAAC;IAC3D,aAAa,CAChB,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,qBAAqB,GAAG,CAC1B,IAAgB,EAChB,gBAAsC,EACtC,OAAyB,EACzB,KAAa,EACK,EAAE;EACpB,OAAO;IACH,OAAO,EAAE,OAAO;IAChB,UAAU,EAAE,eAAe,CAAC,IAAI,EAAE,gBAAgB,CAAC;IACnD,KAAK,EAAE,KAAK;GACf,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,gBAAgB,GAAG,CACrB,IAAsD,EACtD,IAAgB,EAChB,gBAAsC,EACtC,OAAyB,EACzB,KAAa,EACf,EAAE;EACA,MAAM,KAAK,GAAG,IAAI,WAAW,CAAqB,IAAI,EAAE;IACpD,MAAM,EAAE,qBAAqB,CAAC,IAAI,EAAE,gBAAgB,EAAE,OAAO,EAAE,KAAK,CAAC;IACrE,OAAO,EAAE,IAAI;IACb,QAAQ,EAAE,IAAI;GACjB,CAAC,CAAC;EACH,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;AAClC,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,CACxB,IAAY,EACZ,YAA2B,EAC3B,QAAqB,EACf,EAAE;EACR,IAAI,SAAS,GAAG,EAAE,CAAC;EACnB,IAAI,WAAW,GAAG,EAAE,CAAC;EAErB,YAAY,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE,EAAE;IACjC,IAAI,WAAW,CAAC,UAAU,EAAE;MACxB,WAAW,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;QAC/B,IACI,IAAI,YAAY,WAAW;UAC3B,IAAI,YAAY,iBAAiB,EACnC;UACE,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;UACzB,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC;UAC1B,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC;UAEtB,IAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,EAAE;YACb,aAAa;YACb,SAAS,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;WACzD;eAAM,IAAI,OAAO,KAAK,KAAK,EAAE;YAC1B,eAAe;YACf,MAAM,WAAW,GAAG,QAAQ,CAAC,GAAG,CAAC,WAAW,CACxC,OAAO,EACP,KAAK,CACR,CAAC;YACF,WAAW,IAAI,WAAW,CAAC;WAC9B;SACJ;MACL,CAAC,CAAC,CAAC;KACN;EACL,CAAC,CAAC,CAAC;EAEH,IAAI,SAAS,EAAE;IACX,IAAI,IAAI,SAAS,CAAC;GACrB;OAAM,IAAI,WAAW,EAAE;IACpB,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;GAC7C;EAED,OAAO,IAAI,CAAC;AAChB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAC/B,iBAAqC,EACrC,gBAAsC,EACxC,EAAE;EACA,IAAI,aAAa,GAA4B,IAAI,CAAC;EAClD,IAAI,WAAW,GAAG,EAAE,CAAC;EACrB,IAAI,UAAU,GAAsB,IAAI,CAAC;EACzC,IAAI,eAAe,GAAkB,IAAI,CAAC;EAE1C,MAAM,WAAW,GAAG,GAAG,EAAE;IACrB,WAAW,GAAG,EAAE,CAAC;IACjB,gBAAgB,CACZ,aAAa,EACb,UAAU,EACV,gBAAgB,EAChB,aAAa,EACb,WAAW,CACd,CAAC;IACF,eAAe,GAAG,IAAI,CAAC;IACvB,aAAa,GAAG,IAAI,CAAC;EACzB,CAAC,CAAC;EAEF,MAAM,aAAa,GAAG,CAAC,CAAa,EAAE,KAAU,EAAE,EAAE;IAChD,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;MACxB,WAAW,EAAE,CAAC;MAEd,OAAO,IAAI,CAAC;KACf;IAED,OAAO,KAAK,CAAC;EACjB,CAAC,CAAC;EAEF,MAAM,WAAW,GAAG,CAAC,IAAgB,EAAE,KAAU,EAAE,EAAE;IACjD,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;IAEvB,IACI,KAAK,CAAC,SAAS,KAAK,YAAY;MAChC,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,iBAAiB,CAAC;MACxC,aAAa,CAAC,KAAK,CAAC,EACtB;MACE,aAAa,GAAG,KAAK,CAAC,IAAI,CAAC;MAC3B,WAAW,GAAG,EAAE,CAAC;MACjB,eAAe,GAAG,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,GAAG,WAAW,CAAC,MAAM,CAAC;MACjE,gBAAgB,CACZ,cAAc,EACd,IAAI,EACJ,gBAAgB,EAChB,aAAa,EACb,WAAW,CACd,CAAC;MAEF,OAAO,KAAK,CAAC;KAChB;IAED,OAAO,KAAK,CAAC;EACjB,CAAC,CAAC;EAEF,MAAM,kBAAkB,GAAG,CACvB,YAA2B,EAC3B,QAAqB,EACrB,QAAqB,EACV,EAAE;IACb,IAAI,CAAC,aAAa,IAAI,CAAC,eAAe,IAAI,CAAC,UAAU,EAAE;MACnD,OAAO;KACV;IAED,IACI,CAAC,eAAe,CACZ,QAAQ,EACR,aAAa,EACb,eAAe,EACf,WAAW,CAAC,MAAM,CACrB,EACH;MACE,OAAO;KACV;IAED,MAAM,WAAW,GAAG,mBAAmB,CACnC,WAAW,EACX,YAAY,EACZ,QAAQ,CACX,CAAC;IAEF,IAAI,WAAW,KAAK,WAAW,EAAE;MAC7B,WAAW,GAAG,WAAW,CAAC;MAC1B,gBAAgB,CACZ,eAAe,EACf,UAAU,EACV,gBAAgB,EAChB,aAAa,EACb,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CACvB,CAAC;KACL;EACL,CAAC,CAAC;EAEF,OAAO,IAAI,MAAM,CAAC;IACd,GAAG,EAAE,IAAI,SAAS,CAAC,eAAe,CAAC;IACnC,IAAI,EAAE,CAAC,IAAgB,EAAE,EAAE;MACvB,UAAU,GAAG,IAAI,CAAC;MAElB,OAAO,EAAE,CAAC;IACd,CAAC;IACD,KAAK,EAAE;MACH,IAAI,EAAE,GAAG,EAAE;QACP,OAAO,EAAE,CAAC;MACd,CAAC;MACD,KAAK,EAAE,CAAC,WAAwB,EAAE,EAAE;QAChC,IAAI,WAAW,CAAC,OAAO,CAAC,aAAa,CAAC,EAAE;UACpC,WAAW,EAAE,CAAC;SACjB;QAED,OAAO,EAAE,CAAC;MACd,CAAC;KACJ;IACD,KAAK,EAAE;MACH,aAAa,EAAE,aAAa;MAC5B,eAAe,EAAE;QACb,KAAK,EAAE,WAAW;OACrB;KACJ;IACD,iBAAiB,EAAE,kBAAkB;GACxC,CAAC,CAAC;AACP,CAAC,CAAC","sourcesContent":["import { Plugin, PluginKey, EditorState, Transaction } from 'prosemirror-state';\nimport { ReplaceStep, ReplaceAroundStep } from 'prosemirror-transform';\nimport { EditorView } from 'prosemirror-view';\nimport { inserterFactory } from './inserter';\nimport {\n TriggerCharacter,\n TriggerEventDetail,\n} from 'src/components/text-editor/text-editor.types';\nimport { ContentTypeConverter } from '../../../utils/content-type-converter';\n\nconst isTrigger = (\n key: string,\n validTriggers: TriggerCharacter[],\n): key is TriggerCharacter => {\n return key.length === 1 && validTriggers.includes(key as TriggerCharacter);\n};\n\nconst shouldTrigger = (state: EditorState): boolean => {\n const { $from } = state.selection;\n\n if ($from.pos === 1) {\n return true;\n }\n\n // Getting the position immediately before the current selection\n const prevPos = $from.pos - 1;\n\n if (prevPos > 0) {\n // allow trigger if the cursor is at the start of a new paragraph\n if ($from.parentOffset === 0) {\n return true;\n }\n\n const prevChar = state.doc.textBetween(prevPos, $from.pos);\n\n return prevChar === ' ' || prevChar === '\\n';\n }\n\n return false;\n};\n\nconst stillHasTrigger = (\n state: EditorState,\n activeTrigger: string,\n triggerPosition: number,\n triggerLength: number,\n): boolean => {\n const cursorPosition = state.selection.$from.pos;\n\n if (\n cursorPosition < triggerPosition ||\n cursorPosition > triggerPosition + triggerLength + 1\n ) {\n return false;\n }\n\n return (\n state.doc.textBetween(triggerPosition, triggerPosition + 1) ===\n activeTrigger\n );\n};\n\nconst getTriggerEventDetail = (\n view: EditorView,\n contentConverter: ContentTypeConverter,\n trigger: TriggerCharacter,\n value: string,\n): TriggerEventDetail => {\n return {\n trigger: trigger,\n textEditor: inserterFactory(view, contentConverter),\n value: value,\n };\n};\n\nconst sendTriggerEvent = (\n type: 'triggerStart' | 'triggerStop' | 'triggerChange',\n view: EditorView,\n contentConverter: ContentTypeConverter,\n trigger: TriggerCharacter,\n value: string,\n) => {\n const event = new CustomEvent<TriggerEventDetail>(type, {\n detail: getTriggerEventDetail(view, contentConverter, trigger, value),\n bubbles: true,\n composed: true,\n });\n view.dom.dispatchEvent(event);\n};\n\nconst processTransactions = (\n text: string,\n transactions: Transaction[],\n oldState: EditorState,\n): string => {\n let textAdded = '';\n let textRemoved = '';\n\n transactions.forEach((transaction) => {\n if (transaction.docChanged) {\n transaction.steps.forEach((step) => {\n if (\n step instanceof ReplaceStep ||\n step instanceof ReplaceAroundStep\n ) {\n const slice = step.slice;\n const fromPos = step.from;\n const toPos = step.to;\n\n if (slice?.size) {\n // Text added\n textAdded += slice.content.textBetween(0, slice.size);\n } else if (fromPos !== toPos) {\n // Text removed\n const removedText = oldState.doc.textBetween(\n fromPos,\n toPos,\n );\n textRemoved += removedText;\n }\n }\n });\n }\n });\n\n if (textAdded) {\n text += textAdded;\n } else if (textRemoved) {\n text = text.slice(0, -textRemoved.length);\n }\n\n return text;\n};\n\nexport const createTriggerPlugin = (\n triggerCharacters: TriggerCharacter[],\n contentConverter: ContentTypeConverter,\n) => {\n let activeTrigger: TriggerCharacter | null = null;\n let triggerText = '';\n let pluginView: EditorView | null = null;\n let triggerPosition: number | null = null;\n\n const stopTrigger = () => {\n triggerText = '';\n sendTriggerEvent(\n 'triggerStop',\n pluginView,\n contentConverter,\n activeTrigger,\n triggerText,\n );\n triggerPosition = null;\n activeTrigger = null;\n };\n\n const handleKeyDown = (_: EditorView, event: any) => {\n if (event.key === 'Escape') {\n stopTrigger();\n\n return true;\n }\n\n return false;\n };\n\n const handleInput = (view: EditorView, event: any) => {\n const { state } = view;\n\n if (\n event.inputType === 'insertText' &&\n isTrigger(event.data, triggerCharacters) &&\n shouldTrigger(state)\n ) {\n activeTrigger = event.data;\n triggerText = '';\n triggerPosition = state.selection.$from.pos - triggerText.length;\n sendTriggerEvent(\n 'triggerStart',\n view,\n contentConverter,\n activeTrigger,\n triggerText,\n );\n\n return false;\n }\n\n return false;\n };\n\n const appendTransactions = (\n transactions: Transaction[],\n oldState: EditorState,\n newState: EditorState,\n ): Transaction => {\n if (!activeTrigger || !triggerPosition || !pluginView) {\n return;\n }\n\n if (\n !stillHasTrigger(\n newState,\n activeTrigger,\n triggerPosition,\n triggerText.length,\n )\n ) {\n return;\n }\n\n const updatedText = processTransactions(\n triggerText,\n transactions,\n oldState,\n );\n\n if (updatedText !== triggerText) {\n triggerText = updatedText;\n sendTriggerEvent(\n 'triggerChange',\n pluginView,\n contentConverter,\n activeTrigger,\n triggerText.slice(1),\n );\n }\n };\n\n return new Plugin({\n key: new PluginKey('triggerPlugin'),\n view: (view: EditorView) => {\n pluginView = view;\n\n return {};\n },\n state: {\n init: () => {\n return {};\n },\n apply: (transaction: Transaction) => {\n if (transaction.getMeta('stopTrigger')) {\n stopTrigger();\n }\n\n return {};\n },\n },\n props: {\n handleKeyDown: handleKeyDown,\n handleDOMEvents: {\n input: handleInput,\n },\n },\n appendTransaction: appendTransactions,\n });\n};\n"]}
1
+ {"version":3,"file":"factory.js","sourceRoot":"","sources":["../../../../../../src/components/text-editor/prosemirror-adapter/plugins/trigger/factory.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,SAAS,EAA4B,MAAM,mBAAmB,CAAC;AAChF,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAEvE,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAO7C,MAAM,SAAS,GAAG,CACd,GAAW,EACX,aAAiC,EACV,EAAE;EACzB,OAAO,GAAG,CAAC,MAAM,KAAK,CAAC,IAAI,aAAa,CAAC,QAAQ,CAAC,GAAuB,CAAC,CAAC;AAC/E,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,CAAC,KAAkB,EAAW,EAAE;EAClD,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC,SAAS,CAAC;EAElC,IAAI,KAAK,CAAC,GAAG,KAAK,CAAC,EAAE;IACjB,OAAO,IAAI,CAAC;GACf;EAED,gEAAgE;EAChE,MAAM,OAAO,GAAG,KAAK,CAAC,GAAG,GAAG,CAAC,CAAC;EAE9B,IAAI,OAAO,GAAG,CAAC,EAAE;IACb,iEAAiE;IACjE,IAAI,KAAK,CAAC,YAAY,KAAK,CAAC,EAAE;MAC1B,OAAO,IAAI,CAAC;KACf;IAED,MAAM,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IAE3D,OAAO,QAAQ,KAAK,GAAG,IAAI,QAAQ,KAAK,IAAI,CAAC;GAChD;EAED,OAAO,KAAK,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,eAAe,GAAG,CACpB,KAAkB,EAClB,aAAqB,EACrB,eAAuB,EACvB,aAAqB,EACd,EAAE;EACT,MAAM,cAAc,GAAG,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC;EAEjD,IACI,cAAc,GAAG,eAAe;IAChC,cAAc,GAAG,eAAe,GAAG,aAAa,GAAG,CAAC,EACtD;IACE,OAAO,KAAK,CAAC;GAChB;EAED,OAAO,CACH,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,eAAe,EAAE,eAAe,GAAG,CAAC,CAAC;IAC3D,aAAa,CAChB,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,qBAAqB,GAAG,CAC1B,IAAgB,EAChB,gBAAsC,EACtC,OAAyB,EACzB,KAAa,EACK,EAAE;EACpB,OAAO;IACH,OAAO,EAAE,OAAO;IAChB,UAAU,EAAE,eAAe,CAAC,IAAI,EAAE,gBAAgB,CAAC;IACnD,KAAK,EAAE,KAAK;GACf,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,gBAAgB,GAAG,CACrB,IAAsD,EACtD,IAAgB,EAChB,gBAAsC,EACtC,OAAyB,EACzB,KAAa,EACf,EAAE;EACA,MAAM,KAAK,GAAG,IAAI,WAAW,CAAqB,IAAI,EAAE;IACpD,MAAM,EAAE,qBAAqB,CAAC,IAAI,EAAE,gBAAgB,EAAE,OAAO,EAAE,KAAK,CAAC;IACrE,OAAO,EAAE,IAAI;IACb,QAAQ,EAAE,IAAI;GACjB,CAAC,CAAC;EACH,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;AAClC,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,CACxB,IAAY,EACZ,YAA2B,EAC3B,QAAqB,EACf,EAAE;EACR,IAAI,SAAS,GAAG,EAAE,CAAC;EACnB,IAAI,WAAW,GAAG,EAAE,CAAC;EAErB,YAAY,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE,EAAE;IACjC,IAAI,WAAW,CAAC,UAAU,EAAE;MACxB,WAAW,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;QAC/B,IACI,IAAI,YAAY,WAAW;UAC3B,IAAI,YAAY,iBAAiB,EACnC;UACE,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;UACzB,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC;UAC1B,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC;UAEtB,IAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,EAAE;YACb,aAAa;YACb,SAAS,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;WACzD;eAAM,IAAI,OAAO,KAAK,KAAK,EAAE;YAC1B,eAAe;YACf,MAAM,WAAW,GAAG,QAAQ,CAAC,GAAG,CAAC,WAAW,CACxC,OAAO,EACP,KAAK,CACR,CAAC;YACF,WAAW,IAAI,WAAW,CAAC;WAC9B;SACJ;MACL,CAAC,CAAC,CAAC;KACN;EACL,CAAC,CAAC,CAAC;EAEH,IAAI,SAAS,EAAE;IACX,IAAI,IAAI,SAAS,CAAC;GACrB;OAAM,IAAI,WAAW,EAAE;IACpB,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;GAC7C;EAED,OAAO,IAAI,CAAC;AAChB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAC/B,iBAAqC,EACrC,gBAAsC,EACxC,EAAE;EACA,IAAI,aAAa,GAA4B,IAAI,CAAC;EAClD,IAAI,WAAW,GAAG,EAAE,CAAC;EACrB,IAAI,UAAU,GAAsB,IAAI,CAAC;EACzC,IAAI,eAAe,GAAkB,IAAI,CAAC;EAE1C,MAAM,WAAW,GAAG,GAAG,EAAE;IACrB,WAAW,GAAG,EAAE,CAAC;IACjB,gBAAgB,CACZ,aAAa,EACb,UAAU,EACV,gBAAgB,EAChB,aAAa,EACb,WAAW,CACd,CAAC;IACF,eAAe,GAAG,IAAI,CAAC;IACvB,aAAa,GAAG,IAAI,CAAC;EACzB,CAAC,CAAC;EAEF,MAAM,aAAa,GAAG,CAAC,CAAa,EAAE,KAAU,EAAE,EAAE;IAChD,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;MACxB,WAAW,EAAE,CAAC;MAEd,OAAO,IAAI,CAAC;KACf;IAED,OAAO,KAAK,CAAC;EACjB,CAAC,CAAC;EAEF,MAAM,WAAW,GAAG,CAAC,IAAgB,EAAE,KAAU,EAAE,EAAE;IACjD,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;IAEvB,IACI,KAAK,CAAC,SAAS,KAAK,YAAY;MAChC,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,iBAAiB,CAAC;MACxC,aAAa,CAAC,KAAK,CAAC,EACtB;MACE,aAAa,GAAG,KAAK,CAAC,IAAI,CAAC;MAC3B,WAAW,GAAG,EAAE,CAAC;MACjB,eAAe,GAAG,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,GAAG,WAAW,CAAC,MAAM,CAAC;MACjE,gBAAgB,CACZ,cAAc,EACd,IAAI,EACJ,gBAAgB,EAChB,aAAa,EACb,WAAW,CACd,CAAC;MAEF,OAAO,KAAK,CAAC;KAChB;IAED,OAAO,KAAK,CAAC;EACjB,CAAC,CAAC;EAEF,MAAM,kBAAkB,GAAG,CACvB,YAA2B,EAC3B,QAAqB,EACrB,QAAqB,EACV,EAAE;IACb,IAAI,CAAC,aAAa,IAAI,CAAC,eAAe,IAAI,CAAC,UAAU,EAAE;MACnD,OAAO;KACV;IAED,IACI,CAAC,eAAe,CACZ,QAAQ,EACR,aAAa,EACb,eAAe,EACf,WAAW,CAAC,MAAM,CACrB,EACH;MACE,WAAW,EAAE,CAAC;MAEd,OAAO;KACV;IAED,MAAM,WAAW,GAAG,mBAAmB,CACnC,WAAW,EACX,YAAY,EACZ,QAAQ,CACX,CAAC;IAEF,IAAI,WAAW,KAAK,WAAW,EAAE;MAC7B,WAAW,GAAG,WAAW,CAAC;MAC1B,gBAAgB,CACZ,eAAe,EACf,UAAU,EACV,gBAAgB,EAChB,aAAa,EACb,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CACvB,CAAC;KACL;EACL,CAAC,CAAC;EAEF,OAAO,IAAI,MAAM,CAAC;IACd,GAAG,EAAE,IAAI,SAAS,CAAC,eAAe,CAAC;IACnC,IAAI,EAAE,CAAC,IAAgB,EAAE,EAAE;MACvB,UAAU,GAAG,IAAI,CAAC;MAElB,OAAO,EAAE,CAAC;IACd,CAAC;IACD,KAAK,EAAE;MACH,IAAI,EAAE,GAAG,EAAE;QACP,OAAO,EAAE,CAAC;MACd,CAAC;MACD,KAAK,EAAE,CAAC,WAAwB,EAAE,EAAE;QAChC,IAAI,WAAW,CAAC,OAAO,CAAC,aAAa,CAAC,EAAE;UACpC,WAAW,EAAE,CAAC;SACjB;QAED,OAAO,EAAE,CAAC;MACd,CAAC;KACJ;IACD,KAAK,EAAE;MACH,aAAa,EAAE,aAAa;MAC5B,eAAe,EAAE;QACb,KAAK,EAAE,WAAW;OACrB;KACJ;IACD,iBAAiB,EAAE,kBAAkB;GACxC,CAAC,CAAC;AACP,CAAC,CAAC","sourcesContent":["import { Plugin, PluginKey, EditorState, Transaction } from 'prosemirror-state';\nimport { ReplaceStep, ReplaceAroundStep } from 'prosemirror-transform';\nimport { EditorView } from 'prosemirror-view';\nimport { inserterFactory } from './inserter';\nimport {\n TriggerCharacter,\n TriggerEventDetail,\n} from 'src/components/text-editor/text-editor.types';\nimport { ContentTypeConverter } from '../../../utils/content-type-converter';\n\nconst isTrigger = (\n key: string,\n validTriggers: TriggerCharacter[],\n): key is TriggerCharacter => {\n return key.length === 1 && validTriggers.includes(key as TriggerCharacter);\n};\n\nconst shouldTrigger = (state: EditorState): boolean => {\n const { $from } = state.selection;\n\n if ($from.pos === 1) {\n return true;\n }\n\n // Getting the position immediately before the current selection\n const prevPos = $from.pos - 1;\n\n if (prevPos > 0) {\n // allow trigger if the cursor is at the start of a new paragraph\n if ($from.parentOffset === 0) {\n return true;\n }\n\n const prevChar = state.doc.textBetween(prevPos, $from.pos);\n\n return prevChar === ' ' || prevChar === '\\n';\n }\n\n return false;\n};\n\nconst stillHasTrigger = (\n state: EditorState,\n activeTrigger: string,\n triggerPosition: number,\n triggerLength: number,\n): boolean => {\n const cursorPosition = state.selection.$from.pos;\n\n if (\n cursorPosition < triggerPosition ||\n cursorPosition > triggerPosition + triggerLength + 1\n ) {\n return false;\n }\n\n return (\n state.doc.textBetween(triggerPosition, triggerPosition + 1) ===\n activeTrigger\n );\n};\n\nconst getTriggerEventDetail = (\n view: EditorView,\n contentConverter: ContentTypeConverter,\n trigger: TriggerCharacter,\n value: string,\n): TriggerEventDetail => {\n return {\n trigger: trigger,\n textEditor: inserterFactory(view, contentConverter),\n value: value,\n };\n};\n\nconst sendTriggerEvent = (\n type: 'triggerStart' | 'triggerStop' | 'triggerChange',\n view: EditorView,\n contentConverter: ContentTypeConverter,\n trigger: TriggerCharacter,\n value: string,\n) => {\n const event = new CustomEvent<TriggerEventDetail>(type, {\n detail: getTriggerEventDetail(view, contentConverter, trigger, value),\n bubbles: true,\n composed: true,\n });\n view.dom.dispatchEvent(event);\n};\n\nconst processTransactions = (\n text: string,\n transactions: Transaction[],\n oldState: EditorState,\n): string => {\n let textAdded = '';\n let textRemoved = '';\n\n transactions.forEach((transaction) => {\n if (transaction.docChanged) {\n transaction.steps.forEach((step) => {\n if (\n step instanceof ReplaceStep ||\n step instanceof ReplaceAroundStep\n ) {\n const slice = step.slice;\n const fromPos = step.from;\n const toPos = step.to;\n\n if (slice?.size) {\n // Text added\n textAdded += slice.content.textBetween(0, slice.size);\n } else if (fromPos !== toPos) {\n // Text removed\n const removedText = oldState.doc.textBetween(\n fromPos,\n toPos,\n );\n textRemoved += removedText;\n }\n }\n });\n }\n });\n\n if (textAdded) {\n text += textAdded;\n } else if (textRemoved) {\n text = text.slice(0, -textRemoved.length);\n }\n\n return text;\n};\n\nexport const createTriggerPlugin = (\n triggerCharacters: TriggerCharacter[],\n contentConverter: ContentTypeConverter,\n) => {\n let activeTrigger: TriggerCharacter | null = null;\n let triggerText = '';\n let pluginView: EditorView | null = null;\n let triggerPosition: number | null = null;\n\n const stopTrigger = () => {\n triggerText = '';\n sendTriggerEvent(\n 'triggerStop',\n pluginView,\n contentConverter,\n activeTrigger,\n triggerText,\n );\n triggerPosition = null;\n activeTrigger = null;\n };\n\n const handleKeyDown = (_: EditorView, event: any) => {\n if (event.key === 'Escape') {\n stopTrigger();\n\n return true;\n }\n\n return false;\n };\n\n const handleInput = (view: EditorView, event: any) => {\n const { state } = view;\n\n if (\n event.inputType === 'insertText' &&\n isTrigger(event.data, triggerCharacters) &&\n shouldTrigger(state)\n ) {\n activeTrigger = event.data;\n triggerText = '';\n triggerPosition = state.selection.$from.pos - triggerText.length;\n sendTriggerEvent(\n 'triggerStart',\n view,\n contentConverter,\n activeTrigger,\n triggerText,\n );\n\n return false;\n }\n\n return false;\n };\n\n const appendTransactions = (\n transactions: Transaction[],\n oldState: EditorState,\n newState: EditorState,\n ): Transaction => {\n if (!activeTrigger || !triggerPosition || !pluginView) {\n return;\n }\n\n if (\n !stillHasTrigger(\n newState,\n activeTrigger,\n triggerPosition,\n triggerText.length,\n )\n ) {\n stopTrigger();\n\n return;\n }\n\n const updatedText = processTransactions(\n triggerText,\n transactions,\n oldState,\n );\n\n if (updatedText !== triggerText) {\n triggerText = updatedText;\n sendTriggerEvent(\n 'triggerChange',\n pluginView,\n contentConverter,\n activeTrigger,\n triggerText.slice(1),\n );\n }\n };\n\n return new Plugin({\n key: new PluginKey('triggerPlugin'),\n view: (view: EditorView) => {\n pluginView = view;\n\n return {};\n },\n state: {\n init: () => {\n return {};\n },\n apply: (transaction: Transaction) => {\n if (transaction.getMeta('stopTrigger')) {\n stopTrigger();\n }\n\n return {};\n },\n },\n props: {\n handleKeyDown: handleKeyDown,\n handleDOMEvents: {\n input: handleInput,\n },\n },\n appendTransaction: appendTransactions,\n });\n};\n"]}
@@ -3,7 +3,7 @@ import { i as isItem } from './isItem-b0459122.js';
3
3
  import { g as getIconName } from './get-icon-props-0b65f85e.js';
4
4
  import { g as getMouseEventHandlers } from './3d-tilt-hover-effect-a76fcd43.js';
5
5
 
6
- const cardCss = "@charset \"UTF-8\";*{box-sizing:border-box;min-width:0;min-height:0}:host(limel-card){display:flex;border-radius:var(--card-border-radius, 0.95rem)}section{box-sizing:border-box;display:flex;gap:0.5rem;flex-direction:column;border-radius:var(--card-border-radius, 0.95rem);border:1px solid rgb(var(--contrast-500));padding:0.25rem;background-color:var(--card-background-color, rgb(var(--contrast-300)))}:host(limel-card[orientation=landscape]) section{flex-direction:row}section:hover{border-color:transparent;background-color:var(--card-background-color--hovered, var(--card-background-color, rgb(var(--contrast-200))))}.body{flex-grow:1;display:flex;flex-direction:column;gap:0.5rem}img{transition:filter 0.6s ease;object-fit:cover;border-radius:calc(var(--card-border-radius, 0.95rem) / 1.4)}:host(limel-card[orientation=portrait]) img{width:100%}:host(limel-card[orientation=landscape]) img{max-width:40%;height:100%}section:hover img,section:focus-visible img{transition-duration:0.2s;filter:saturate(1.3)}limel-markdown{padding:0.5rem 0.75rem}header{display:flex;justify-content:center;gap:0.5rem;padding:0.25rem 0.75rem}:host(limel-card[orientation=landscape]) header{padding-top:0.5rem}header:has(limel-icon){padding-left:0.25rem}header .headings{flex-grow:1;display:flex;flex-direction:column;gap:0.125rem}header limel-icon{flex-shrink:0;width:2rem}header h1{font-size:1.125rem;font-weight:500;color:var(--card-heading-color, rgb(var(--contrast-1100)));letter-spacing:-0.03125rem}header h2{font-size:0.875rem;font-weight:400;color:var(--card-subheading-color, rgb(var(--contrast-1000)))}header h1,header h2{word-break:break-word;hyphens:auto;-webkit-hyphens:auto;margin:0}limel-action-bar{--action-bar-background-color:transparent;padding:0.5rem;margin-left:auto}.limel-3d-hover-effect-glow{transition:background 0.4s ease, opacity 0.4s ease;pointer-events:none;position:absolute;inset:0;border-radius:var(--card-border-radius, 0.95rem);opacity:0.1;background-image:radial-gradient(circle at var(--limel-3d-hover-effect-glow-position, 50% -20%), rgb(var(--color-white), 0.3), rgb(var(--color-white), 0));mix-blend-mode:plus-lighter}section:hover .limel-3d-hover-effect-glow{opacity:0.5}@media (prefers-reduced-motion){section:hover .limel-3d-hover-effect-glow{opacity:0.2}}:host(limel-card){isolation:isolate;transform-style:preserve-3d;perspective:1000px}@media (prefers-reduced-motion){:host(limel-card){perspective:2000px}}section{position:relative;transition-duration:0.8s;transition-property:transform, box-shadow, background-color;transition-timing-function:ease-out;transform:scale3d(1, 1, 1) rotate3d(0, 0, 0, 0deg)}section:focus{outline:none}section:hover,section:focus,section:focus-visible,section:focus-within{will-change:background-color, box-shadow, transform}section:hover,section:focus,section:focus-visible,section:active{transition-duration:0.2s}section:hover,section:focus-visible{box-shadow:var(--button-shadow-hovered), var(--shadow-depth-16)}section:hover{transform:scale3d(1.01, 1.01, 1.01) rotate3d(var(--limel-3d-hover-effect-rotate3d))}section:focus-visible{outline:none;transform:scale3d(1.01, 1.01, 1.01)}:host(limel-card[clickable]) section{cursor:pointer;box-shadow:var(--button-shadow-normal)}:host(limel-card[clickable]) section:hover,:host(limel-card[clickable]) section:focus-visible{box-shadow:var(--button-shadow-hovered), var(--shadow-depth-16)}:host(limel-card[clickable]) section:active{transform:scale3d(1, 1, 1) rotate3d(0, 0, 0, 0deg);box-shadow:var(--button-shadow-pressed)}:host(limel-card[clickable]) section:focus-visible{box-shadow:var(--shadow-depth-8-focused), var(--button-shadow-hovered)}:host(limel-card[clickable]) section:focus-visible:active{box-shadow:var(--shadow-depth-8-focused), var(--button-shadow-pressed)}";
6
+ const cardCss = "@charset \"UTF-8\";*{box-sizing:border-box;min-width:0;min-height:0}:host(limel-card){display:flex;border-radius:var(--card-border-radius, 0.95rem)}section{box-sizing:border-box;display:flex;gap:0.5rem;flex-direction:column;border-radius:var(--card-border-radius, 0.95rem);border:1px solid rgb(var(--contrast-500));padding:0.25rem;background-color:var(--card-background-color, rgb(var(--contrast-300)))}:host(limel-card[orientation=landscape]) section{flex-direction:row}section:hover{border-color:transparent;background-color:var(--card-background-color--hovered, var(--card-background-color, rgb(var(--contrast-200))))}.body{flex-grow:1;display:flex;flex-direction:column;gap:0.5rem}img{flex-shrink:0;transition:filter 0.6s ease;object-fit:cover;border-radius:calc(var(--card-border-radius, 0.95rem) / 1.4)}:host(limel-card[orientation=portrait]) img{width:100%}:host(limel-card[orientation=landscape]) img{max-width:40%;height:100%}section:hover img,section:focus-visible img{transition-duration:0.2s;filter:saturate(1.3)}limel-markdown{padding:0.5rem 0.75rem}header{display:flex;justify-content:center;gap:0.5rem;padding:0.25rem 0.75rem}:host(limel-card[orientation=landscape]) header{padding-top:0.5rem}header:has(limel-icon){padding-left:0.25rem}header .headings{flex-grow:1;display:flex;flex-direction:column;gap:0.125rem}header limel-icon{flex-shrink:0;width:2rem}header h1{font-size:1.125rem;font-weight:500;color:var(--card-heading-color, rgb(var(--contrast-1100)));letter-spacing:-0.03125rem}header h2{font-size:0.875rem;font-weight:400;color:var(--card-subheading-color, rgb(var(--contrast-1000)))}header h1,header h2{word-break:break-word;hyphens:auto;-webkit-hyphens:auto;margin:0}limel-action-bar{--action-bar-background-color:transparent;padding:0.5rem;margin-left:auto}.limel-3d-hover-effect-glow{transition:background 0.4s ease, opacity 0.4s ease;pointer-events:none;position:absolute;inset:0;border-radius:var(--card-border-radius, 0.95rem);opacity:0.1;background-image:radial-gradient(circle at var(--limel-3d-hover-effect-glow-position, 50% -20%), rgb(var(--color-white), 0.3), rgb(var(--color-white), 0));mix-blend-mode:plus-lighter}section:hover .limel-3d-hover-effect-glow{opacity:0.5}@media (prefers-reduced-motion){section:hover .limel-3d-hover-effect-glow{opacity:0.2}}:host(limel-card){isolation:isolate;transform-style:preserve-3d;perspective:1000px}@media (prefers-reduced-motion){:host(limel-card){perspective:2000px}}section{position:relative;transition-duration:0.8s;transition-property:transform, box-shadow, background-color;transition-timing-function:ease-out;transform:scale3d(1, 1, 1) rotate3d(0, 0, 0, 0deg)}section:focus{outline:none}section:hover,section:focus,section:focus-visible,section:focus-within{will-change:background-color, box-shadow, transform}section:hover,section:focus,section:focus-visible,section:active{transition-duration:0.2s}section:hover,section:focus-visible{box-shadow:var(--button-shadow-hovered), var(--shadow-depth-16)}section:hover{transform:scale3d(1.01, 1.01, 1.01) rotate3d(var(--limel-3d-hover-effect-rotate3d))}section:focus-visible{outline:none;transform:scale3d(1.01, 1.01, 1.01)}:host(limel-card[clickable]) section{cursor:pointer;box-shadow:var(--button-shadow-normal)}:host(limel-card[clickable]) section:hover,:host(limel-card[clickable]) section:focus-visible{box-shadow:var(--button-shadow-hovered), var(--shadow-depth-16)}:host(limel-card[clickable]) section:active{transform:scale3d(1, 1, 1) rotate3d(0, 0, 0, 0deg);box-shadow:var(--button-shadow-pressed)}:host(limel-card[clickable]) section:focus-visible{box-shadow:var(--shadow-depth-8-focused), var(--button-shadow-hovered)}:host(limel-card[clickable]) section:focus-visible:active{box-shadow:var(--shadow-depth-8-focused), var(--button-shadow-pressed)}";
7
7
 
8
8
  const Card = class {
9
9
  constructor(hostRef) {
@@ -1 +1 @@
1
- {"file":"limel-card.entry.js","mappings":"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","names":[],"sources":["./src/components/card/card.scss?tag=limel-card&encapsulation=shadow","./src/components/card/card.tsx"],"sourcesContent":["/**\n* @prop --card-heading-color: color of the heading. Defaults to `--contrast-1100`;\n* @prop --card-subheading-color: color of the sub heading. Defaults to `--contrast-1000`;\n* @prop --card-border-radius: border radius of the card. Defaults to `0.95rem`;\n* @prop --card-background-color: background color of the card.\n* @prop --card-background-color--hovered: background color of the card, when hovered.\n*/\n\n@use '../../style/mixins';\n\n$default-border-radius: 0.95rem;\n\n* {\n box-sizing: border-box;\n min-width: 0;\n min-height: 0;\n}\n\n:host(limel-card) {\n display: flex;\n border-radius: var(--card-border-radius, $default-border-radius);\n}\n\nsection {\n box-sizing: border-box;\n\n display: flex;\n gap: 0.5rem;\n\n flex-direction: column;\n :host(limel-card[orientation='landscape']) & {\n flex-direction: row;\n }\n\n border-radius: var(--card-border-radius, $default-border-radius);\n border: 1px solid rgb(var(--contrast-500));\n\n padding: 0.25rem;\n background-color: var(--card-background-color, rgb(var(--contrast-300)));\n\n &:hover {\n border-color: transparent;\n background-color: var(\n --card-background-color--hovered,\n var(--card-background-color, rgb(var(--contrast-200)))\n );\n }\n}\n\n.body {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\nimg {\n transition: filter 0.6s ease;\n object-fit: cover;\n border-radius: calc(\n var(--card-border-radius, $default-border-radius) / 1.4\n );\n :host(limel-card[orientation='portrait']) & {\n width: 100%;\n }\n\n :host(limel-card[orientation='landscape']) & {\n max-width: 40%;\n height: 100%;\n }\n\n section:hover &,\n section:focus-visible & {\n transition-duration: 0.2s;\n filter: saturate(1.3);\n }\n}\n\nlimel-markdown {\n padding: 0.5rem 0.75rem;\n}\n\nheader {\n display: flex;\n justify-content: center;\n\n gap: 0.5rem;\n\n padding: 0.25rem 0.75rem;\n :host(limel-card[orientation='landscape']) & {\n padding-top: 0.5rem;\n }\n\n &:has(limel-icon) {\n padding-left: 0.25rem;\n }\n\n .headings {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n gap: 0.125rem;\n }\n\n limel-icon {\n flex-shrink: 0;\n width: 2rem;\n }\n\n h1 {\n font-size: 1.125rem;\n font-weight: 500;\n color: var(--card-heading-color, rgb(var(--contrast-1100)));\n letter-spacing: -0.03125rem; // 0.5px\n }\n\n h2 {\n font-size: 0.875rem;\n font-weight: 400;\n color: var(--card-subheading-color, rgb(var(--contrast-1000)));\n }\n\n h1,\n h2 {\n word-break: break-word;\n hyphens: auto;\n -webkit-hyphens: auto;\n margin: 0;\n }\n}\n\nlimel-action-bar {\n --action-bar-background-color: transparent;\n padding: 0.5rem;\n margin-left: auto;\n}\n\n// The 3D effect\n@include mixins.limel-3d-hover-effect-glow(\n section,\n var(--card-border-radius, $default-border-radius)\n);\n\n:host(limel-card) {\n @include mixins.parent-of-the-3d-element;\n}\n\nsection {\n @include mixins.the-3d-element;\n\n :host(limel-card[clickable]) & {\n @include mixins.the-3d-element--clickable;\n }\n}\n","import {\n Component,\n h,\n Prop,\n Event,\n EventEmitter,\n Element,\n Host,\n} from '@stencil/core';\nimport { Image } from '../../global/shared-types/image.types';\nimport { Icon } from '../../global/shared-types/icon.types';\nimport { isItem } from '../action-bar/isItem';\nimport { getIconName } from '../icon/get-icon-props';\nimport { ListSeparator } from '../../global/shared-types/separator.types';\nimport { ActionBarItem } from '../action-bar/action-bar.types';\nimport { getMouseEventHandlers } from '../../util/3d-tilt-hover-effect';\n\n/**\n * Card is a component that displays content about a single topic,\n * in a structured way. It can contain a header, and some supporting media such\n * as an image or an icon, a body of text, or optional actions.\n *\n * @exampleComponent limel-example-card-basic\n * @exampleComponent limel-example-card-image\n * @exampleComponent limel-example-card-actions\n * @exampleComponent limel-example-card-clickable\n * @exampleComponent limel-example-card-orientation\n * @exampleComponent limel-example-card-slot\n * @exampleComponent limel-example-card-styling\n * @beta\n */\n@Component({\n tag: 'limel-card',\n shadow: true,\n styleUrl: 'card.scss',\n})\nexport class Card {\n /**\n * Heading of the card,\n * to provide a short title about the context.\n */\n @Prop({ reflect: true })\n public heading?: string;\n\n /**\n * Subheading of the card\n * to provide a short description of the context.\n */\n @Prop({ reflect: true })\n public subheading?: string;\n\n /**\n * A hero image to display in the card,\n * to enrich the content with visual information.\n */\n @Prop()\n public image?: Image;\n\n /**\n * An icon, to display along with the heading and subheading.\n */\n @Prop({ reflect: true })\n public icon?: string | Icon;\n\n /**\n * The content of the card.\n * Supports markdown, to provide a rich text experience.\n */\n @Prop()\n public value?: string;\n\n /**\n * Actions to display in the card,\n * to provide the user with options to interact with the content.\n */\n @Prop()\n public actions?: Array<ActionBarItem | ListSeparator> = [];\n\n /**\n * When true, improve the accessibility of the component and hints the user\n * that the card can be interacted width.\n */\n @Prop({ reflect: true })\n public clickable: boolean = false;\n\n /**\n * The orientation of the card,\n * specially useful when the card has an image.\n */\n @Prop({ reflect: true })\n public orientation: 'landscape' | 'portrait' = 'portrait';\n\n /**\n * Fired when a action bar item has been clicked.\n */\n @Event()\n public actionSelected: EventEmitter<ActionBarItem>;\n\n @Element()\n private host: HTMLElement;\n\n private handleMouseEnter: () => void;\n private handleMouseLeave: () => void;\n\n public componentWillLoad() {\n const { handleMouseEnter, handleMouseLeave } = getMouseEventHandlers(\n this.host,\n );\n this.handleMouseEnter = handleMouseEnter;\n this.handleMouseLeave = handleMouseLeave;\n }\n\n public render() {\n return (\n <Host\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n >\n <section tabindex={this.clickable ? 0 : ''}>\n {this.renderImage()}\n <div class=\"body\">\n {this.renderHeader()}\n {this.renderSlot()}\n {this.renderValue()}\n {this.renderActionBar()}\n </div>\n <div class=\"limel-3d-hover-effect-glow\" />\n </section>\n </Host>\n );\n }\n\n private renderImage() {\n if (!this.image) {\n return;\n }\n\n return <img src={this.image.src} alt={this.image.alt} loading=\"lazy\" />;\n }\n\n private renderHeader() {\n if (!this.heading && !this.subheading && !this.icon) {\n return;\n }\n\n return (\n <header>\n {this.renderIcon()}\n <div class=\"headings\">\n {this.renderHeading()}\n {this.renderSubheading()}\n </div>\n </header>\n );\n }\n\n private renderIcon() {\n const icon = getIconName(this.icon);\n const color =\n typeof this.icon !== 'string' ? this.icon?.color : undefined;\n\n if (!icon) {\n return;\n }\n\n return (\n <limel-icon\n style={{\n color: `${color}`,\n }}\n badge={true}\n name={icon}\n />\n );\n }\n\n private renderHeading() {\n if (!this.heading) {\n return;\n }\n\n return <h1>{this.heading}</h1>;\n }\n\n private renderSubheading() {\n if (!this.subheading) {\n return;\n }\n\n return <h2>{this.subheading}</h2>;\n }\n\n private renderSlot() {\n return <slot name=\"component\" />;\n }\n\n private renderValue() {\n return <limel-markdown value={this.value} />;\n }\n\n private handleActionSelect = (\n event: CustomEvent<ActionBarItem | ListSeparator>,\n ) => {\n event.stopPropagation();\n if (isItem(event.detail)) {\n this.actionSelected.emit(event.detail);\n }\n };\n\n private renderActionBar() {\n if (!this.actions.length) {\n return;\n }\n\n return (\n <limel-action-bar\n actions={this.actions}\n onItemSelected={this.handleActionSelect}\n />\n );\n }\n}\n"],"version":3}
1
+ {"file":"limel-card.entry.js","mappings":"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","names":[],"sources":["./src/components/card/card.scss?tag=limel-card&encapsulation=shadow","./src/components/card/card.tsx"],"sourcesContent":["/**\n* @prop --card-heading-color: color of the heading. Defaults to `--contrast-1100`;\n* @prop --card-subheading-color: color of the sub heading. Defaults to `--contrast-1000`;\n* @prop --card-border-radius: border radius of the card. Defaults to `0.95rem`;\n* @prop --card-background-color: background color of the card.\n* @prop --card-background-color--hovered: background color of the card, when hovered.\n*/\n\n@use '../../style/mixins';\n\n$default-border-radius: 0.95rem;\n\n* {\n box-sizing: border-box;\n min-width: 0;\n min-height: 0;\n}\n\n:host(limel-card) {\n display: flex;\n border-radius: var(--card-border-radius, $default-border-radius);\n}\n\nsection {\n box-sizing: border-box;\n\n display: flex;\n gap: 0.5rem;\n\n flex-direction: column;\n :host(limel-card[orientation='landscape']) & {\n flex-direction: row;\n }\n\n border-radius: var(--card-border-radius, $default-border-radius);\n border: 1px solid rgb(var(--contrast-500));\n\n padding: 0.25rem;\n background-color: var(--card-background-color, rgb(var(--contrast-300)));\n\n &:hover {\n border-color: transparent;\n background-color: var(\n --card-background-color--hovered,\n var(--card-background-color, rgb(var(--contrast-200)))\n );\n }\n}\n\n.body {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\nimg {\n flex-shrink: 0;\n transition: filter 0.6s ease;\n object-fit: cover;\n border-radius: calc(\n var(--card-border-radius, $default-border-radius) / 1.4\n );\n :host(limel-card[orientation='portrait']) & {\n width: 100%;\n }\n\n :host(limel-card[orientation='landscape']) & {\n max-width: 40%;\n height: 100%;\n }\n\n section:hover &,\n section:focus-visible & {\n transition-duration: 0.2s;\n filter: saturate(1.3);\n }\n}\n\nlimel-markdown {\n padding: 0.5rem 0.75rem;\n}\n\nheader {\n display: flex;\n justify-content: center;\n\n gap: 0.5rem;\n\n padding: 0.25rem 0.75rem;\n :host(limel-card[orientation='landscape']) & {\n padding-top: 0.5rem;\n }\n\n &:has(limel-icon) {\n padding-left: 0.25rem;\n }\n\n .headings {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n gap: 0.125rem;\n }\n\n limel-icon {\n flex-shrink: 0;\n width: 2rem;\n }\n\n h1 {\n font-size: 1.125rem;\n font-weight: 500;\n color: var(--card-heading-color, rgb(var(--contrast-1100)));\n letter-spacing: -0.03125rem; // 0.5px\n }\n\n h2 {\n font-size: 0.875rem;\n font-weight: 400;\n color: var(--card-subheading-color, rgb(var(--contrast-1000)));\n }\n\n h1,\n h2 {\n word-break: break-word;\n hyphens: auto;\n -webkit-hyphens: auto;\n margin: 0;\n }\n}\n\nlimel-action-bar {\n --action-bar-background-color: transparent;\n padding: 0.5rem;\n margin-left: auto;\n}\n\n// The 3D effect\n@include mixins.limel-3d-hover-effect-glow(\n section,\n var(--card-border-radius, $default-border-radius)\n);\n\n:host(limel-card) {\n @include mixins.parent-of-the-3d-element;\n}\n\nsection {\n @include mixins.the-3d-element;\n\n :host(limel-card[clickable]) & {\n @include mixins.the-3d-element--clickable;\n }\n}\n","import {\n Component,\n h,\n Prop,\n Event,\n EventEmitter,\n Element,\n Host,\n} from '@stencil/core';\nimport { Image } from '../../global/shared-types/image.types';\nimport { Icon } from '../../global/shared-types/icon.types';\nimport { isItem } from '../action-bar/isItem';\nimport { getIconName } from '../icon/get-icon-props';\nimport { ListSeparator } from '../../global/shared-types/separator.types';\nimport { ActionBarItem } from '../action-bar/action-bar.types';\nimport { getMouseEventHandlers } from '../../util/3d-tilt-hover-effect';\n\n/**\n * Card is a component that displays content about a single topic,\n * in a structured way. It can contain a header, and some supporting media such\n * as an image or an icon, a body of text, or optional actions.\n *\n * @exampleComponent limel-example-card-basic\n * @exampleComponent limel-example-card-image\n * @exampleComponent limel-example-card-actions\n * @exampleComponent limel-example-card-clickable\n * @exampleComponent limel-example-card-orientation\n * @exampleComponent limel-example-card-slot\n * @exampleComponent limel-example-card-styling\n * @beta\n */\n@Component({\n tag: 'limel-card',\n shadow: true,\n styleUrl: 'card.scss',\n})\nexport class Card {\n /**\n * Heading of the card,\n * to provide a short title about the context.\n */\n @Prop({ reflect: true })\n public heading?: string;\n\n /**\n * Subheading of the card\n * to provide a short description of the context.\n */\n @Prop({ reflect: true })\n public subheading?: string;\n\n /**\n * A hero image to display in the card,\n * to enrich the content with visual information.\n */\n @Prop()\n public image?: Image;\n\n /**\n * An icon, to display along with the heading and subheading.\n */\n @Prop({ reflect: true })\n public icon?: string | Icon;\n\n /**\n * The content of the card.\n * Supports markdown, to provide a rich text experience.\n */\n @Prop()\n public value?: string;\n\n /**\n * Actions to display in the card,\n * to provide the user with options to interact with the content.\n */\n @Prop()\n public actions?: Array<ActionBarItem | ListSeparator> = [];\n\n /**\n * When true, improve the accessibility of the component and hints the user\n * that the card can be interacted width.\n */\n @Prop({ reflect: true })\n public clickable: boolean = false;\n\n /**\n * The orientation of the card,\n * specially useful when the card has an image.\n */\n @Prop({ reflect: true })\n public orientation: 'landscape' | 'portrait' = 'portrait';\n\n /**\n * Fired when a action bar item has been clicked.\n */\n @Event()\n public actionSelected: EventEmitter<ActionBarItem>;\n\n @Element()\n private host: HTMLElement;\n\n private handleMouseEnter: () => void;\n private handleMouseLeave: () => void;\n\n public componentWillLoad() {\n const { handleMouseEnter, handleMouseLeave } = getMouseEventHandlers(\n this.host,\n );\n this.handleMouseEnter = handleMouseEnter;\n this.handleMouseLeave = handleMouseLeave;\n }\n\n public render() {\n return (\n <Host\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n >\n <section tabindex={this.clickable ? 0 : ''}>\n {this.renderImage()}\n <div class=\"body\">\n {this.renderHeader()}\n {this.renderSlot()}\n {this.renderValue()}\n {this.renderActionBar()}\n </div>\n <div class=\"limel-3d-hover-effect-glow\" />\n </section>\n </Host>\n );\n }\n\n private renderImage() {\n if (!this.image) {\n return;\n }\n\n return <img src={this.image.src} alt={this.image.alt} loading=\"lazy\" />;\n }\n\n private renderHeader() {\n if (!this.heading && !this.subheading && !this.icon) {\n return;\n }\n\n return (\n <header>\n {this.renderIcon()}\n <div class=\"headings\">\n {this.renderHeading()}\n {this.renderSubheading()}\n </div>\n </header>\n );\n }\n\n private renderIcon() {\n const icon = getIconName(this.icon);\n const color =\n typeof this.icon !== 'string' ? this.icon?.color : undefined;\n\n if (!icon) {\n return;\n }\n\n return (\n <limel-icon\n style={{\n color: `${color}`,\n }}\n badge={true}\n name={icon}\n />\n );\n }\n\n private renderHeading() {\n if (!this.heading) {\n return;\n }\n\n return <h1>{this.heading}</h1>;\n }\n\n private renderSubheading() {\n if (!this.subheading) {\n return;\n }\n\n return <h2>{this.subheading}</h2>;\n }\n\n private renderSlot() {\n return <slot name=\"component\" />;\n }\n\n private renderValue() {\n return <limel-markdown value={this.value} />;\n }\n\n private handleActionSelect = (\n event: CustomEvent<ActionBarItem | ListSeparator>,\n ) => {\n event.stopPropagation();\n if (isItem(event.detail)) {\n this.actionSelected.emit(event.detail);\n }\n };\n\n private renderActionBar() {\n if (!this.actions.length) {\n return;\n }\n\n return (\n <limel-action-bar\n actions={this.actions}\n onItemSelected={this.handleActionSelect}\n />\n );\n }\n}\n"],"version":3}
@@ -26307,6 +26307,7 @@ const createTriggerPlugin = (triggerCharacters, contentConverter) => {
26307
26307
  return;
26308
26308
  }
26309
26309
  if (!stillHasTrigger(newState, activeTrigger, triggerPosition, triggerText.length)) {
26310
+ stopTrigger();
26310
26311
  return;
26311
26312
  }
26312
26313
  const updatedText = processTransactions(triggerText, transactions, oldState);