@scalar/components 0.30.4 → 0.30.5
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScalarMarkdownSummary.vue.js","names":[],"sources":["../../../src/components/ScalarMarkdown/ScalarMarkdownSummary.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Markdown Summary component\n *\n * Displays a truncated preview of markdown content with\n * a \"More\" / \"Show Less\" toggle to expand and collapse.\n *\n * @example\n * <ScalarMarkdownSummary value=\"Long markdown text...\" :clamp=\"2\" />\n */\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { useResizeObserver } from '@vueuse/core'\nimport { onMounted, useId, useTemplateRef } from 'vue'\n\nimport ScalarMarkdown from './ScalarMarkdown.vue'\nimport type { ScalarMarkdownSummaryProps } from './types'\n\nconst { clamp = 1, ...props } = defineProps<ScalarMarkdownSummaryProps>()\n\nconst id = useId()\n\n/** * Whether the summary is open. */\nconst open = defineModel<boolean>({ default: false })\n\n/** Whether the markdown is being truncated */\nconst truncated = defineModel<boolean>('truncated', { default: false })\n\nconst markdown = useTemplateRef('scalar-markdown')\n\nuseResizeObserver(() => markdown.value?.el, checkTruncation)\n\n/** Check if the markdown is being truncated */\nfunction checkTruncation() {\n const el = markdown.value?.el\n if (!el) {\n return\n }\n truncated.value =\n el.scrollHeight > el.clientHeight || el.scrollWidth > el.clientWidth\n}\n\nonMounted(checkTruncation)\n\nconst { cx } = useBindCx()\ndefineOptions({ inheritAttrs: false })\n</script>\n<template>\n <div\n v-bind=\"\n cx(\n 'group/summary flex gap-0.5',\n open ? 'flex-col' : 'flex-row items-baseline',\n )\n \">\n <ScalarMarkdown\n v-bind=\"props\"\n :id=\"id\"\n ref=\"scalar-markdown\"\n :clamp=\"open ? undefined : clamp\"\n :class=\"{ 'markdown-summary truncate': !open }\" />\n <button\n v-if=\"!controlled && (truncated || open)\"\n :aria-controls=\"id\"\n :aria-expanded=\"open\"\n class=\"whitespace-nowrap font-medium hover:underline\"\n :class=\"{ 'self-end': open }\"\n type=\"button\"\n @click=\"open = !open\">\n <slot\n name=\"button\"\n :open=\"open\">\n {{ open ? ' Show Less' : 'More' }}\n </slot>\n </button>\n </div>\n</template>\n<style>\n.scalar-app {\n /*\n Summarized markdown styles\n Doubled up to bump specificity\n */\n .markdown.markdown-summary.markdown-summary {\n /* Hide the before and after pseudo-elements for all elements */\n *:before,\n *:after {\n content: none;\n }\n\n *:not(strong, em, a) {\n /* Disable formatting for non-inline elements */\n display: contents;\n font-size: inherit;\n font-weight: inherit;\n line-height: var(--markdown-line-height);\n }\n\n /* Hide elements that don't make sense in the summary */\n img,\n svg,\n hr,\n pre {\n display: none;\n }\n }\n}\n</style>\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"ScalarMarkdownSummary.vue.js","names":[],"sources":["../../../src/components/ScalarMarkdown/ScalarMarkdownSummary.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Markdown Summary component\n *\n * Displays a truncated preview of markdown content with\n * a \"More\" / \"Show Less\" toggle to expand and collapse.\n *\n * @example\n * <ScalarMarkdownSummary value=\"Long markdown text...\" :clamp=\"2\" />\n */\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { useResizeObserver } from '@vueuse/core'\nimport { onMounted, useId, useTemplateRef } from 'vue'\n\nimport ScalarMarkdown from './ScalarMarkdown.vue'\nimport type { ScalarMarkdownSummaryProps } from './types'\n\nconst { clamp = 1, ...props } = defineProps<ScalarMarkdownSummaryProps>()\n\nconst id = useId()\n\n/** * Whether the summary is open. */\nconst open = defineModel<boolean>({ default: false })\n\n/** Whether the markdown is being truncated */\nconst truncated = defineModel<boolean>('truncated', { default: false })\n\nconst markdown = useTemplateRef('scalar-markdown')\n\nuseResizeObserver(() => markdown.value?.el, checkTruncation)\n\n/** Check if the markdown is being truncated */\nfunction checkTruncation() {\n const el = markdown.value?.el\n if (!el) {\n return\n }\n truncated.value =\n el.scrollHeight > el.clientHeight || el.scrollWidth > el.clientWidth\n}\n\nonMounted(checkTruncation)\n\nconst { cx } = useBindCx()\ndefineOptions({ inheritAttrs: false })\n</script>\n<template>\n <div\n v-bind=\"\n cx(\n 'group/summary flex gap-0.5',\n open ? 'flex-col' : 'flex-row items-baseline',\n )\n \">\n <ScalarMarkdown\n v-bind=\"props\"\n :id=\"id\"\n ref=\"scalar-markdown\"\n :clamp=\"open ? undefined : clamp\"\n :class=\"{ 'markdown-summary truncate': !open }\" />\n <button\n v-if=\"!controlled && (truncated || open)\"\n :aria-controls=\"id\"\n :aria-expanded=\"open\"\n class=\"whitespace-nowrap font-medium hover:underline\"\n :class=\"{ 'self-end': open }\"\n type=\"button\"\n @click=\"open = !open\">\n <slot\n name=\"button\"\n :open=\"open\">\n {{ open ? ' Show Less' : 'More' }}\n </slot>\n </button>\n </div>\n</template>\n<style>\n.scalar-app {\n /*\n Summarized markdown styles\n Doubled up to bump specificity\n */\n .markdown.markdown-summary.markdown-summary {\n /* Hide the before and after pseudo-elements for all elements */\n *:before,\n *:after {\n content: none;\n }\n\n *:not(strong, em, a, code) {\n /* Disable formatting for non-inline elements */\n display: contents;\n font-size: inherit;\n font-weight: inherit;\n line-height: var(--markdown-line-height);\n }\n\n /* Hide elements that don't make sense in the summary */\n img,\n svg,\n hr,\n pre {\n display: none;\n }\n }\n}\n</style>\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScalarMarkdownSummary.vue.script.js","names":[],"sources":["../../../src/components/ScalarMarkdown/ScalarMarkdownSummary.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Markdown Summary component\n *\n * Displays a truncated preview of markdown content with\n * a \"More\" / \"Show Less\" toggle to expand and collapse.\n *\n * @example\n * <ScalarMarkdownSummary value=\"Long markdown text...\" :clamp=\"2\" />\n */\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { useResizeObserver } from '@vueuse/core'\nimport { onMounted, useId, useTemplateRef } from 'vue'\n\nimport ScalarMarkdown from './ScalarMarkdown.vue'\nimport type { ScalarMarkdownSummaryProps } from './types'\n\nconst { clamp = 1, ...props } = defineProps<ScalarMarkdownSummaryProps>()\n\nconst id = useId()\n\n/** * Whether the summary is open. */\nconst open = defineModel<boolean>({ default: false })\n\n/** Whether the markdown is being truncated */\nconst truncated = defineModel<boolean>('truncated', { default: false })\n\nconst markdown = useTemplateRef('scalar-markdown')\n\nuseResizeObserver(() => markdown.value?.el, checkTruncation)\n\n/** Check if the markdown is being truncated */\nfunction checkTruncation() {\n const el = markdown.value?.el\n if (!el) {\n return\n }\n truncated.value =\n el.scrollHeight > el.clientHeight || el.scrollWidth > el.clientWidth\n}\n\nonMounted(checkTruncation)\n\nconst { cx } = useBindCx()\ndefineOptions({ inheritAttrs: false })\n</script>\n<template>\n <div\n v-bind=\"\n cx(\n 'group/summary flex gap-0.5',\n open ? 'flex-col' : 'flex-row items-baseline',\n )\n \">\n <ScalarMarkdown\n v-bind=\"props\"\n :id=\"id\"\n ref=\"scalar-markdown\"\n :clamp=\"open ? undefined : clamp\"\n :class=\"{ 'markdown-summary truncate': !open }\" />\n <button\n v-if=\"!controlled && (truncated || open)\"\n :aria-controls=\"id\"\n :aria-expanded=\"open\"\n class=\"whitespace-nowrap font-medium hover:underline\"\n :class=\"{ 'self-end': open }\"\n type=\"button\"\n @click=\"open = !open\">\n <slot\n name=\"button\"\n :open=\"open\">\n {{ open ? ' Show Less' : 'More' }}\n </slot>\n </button>\n </div>\n</template>\n<style>\n.scalar-app {\n /*\n Summarized markdown styles\n Doubled up to bump specificity\n */\n .markdown.markdown-summary.markdown-summary {\n /* Hide the before and after pseudo-elements for all elements */\n *:before,\n *:after {\n content: none;\n }\n\n *:not(strong, em, a) {\n /* Disable formatting for non-inline elements */\n display: contents;\n font-size: inherit;\n font-weight: inherit;\n line-height: var(--markdown-line-height);\n }\n\n /* Hide elements that don't make sense in the summary */\n img,\n svg,\n hr,\n pre {\n display: none;\n }\n }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqBA,MAAM,QAA0B,qBAAA,SAAA,CAAA,OAAA,CAAA;EAEhC,MAAM,KAAK,MAAM;;EAGjB,MAAM,OAAO,SAAoB,SAAA,YAAmB;;EAGpD,MAAM,YAAY,SAAoB,SAAC,WAA+B;EAEtE,MAAM,WAAW,eAAe,iBAAiB;EAEjD,wBAAwB,SAAS,OAAO,IAAI,eAAe;;EAG3D,SAAS,kBAAkB;GACzB,MAAM,KAAK,SAAS,OAAO;GAC3B,IAAI,CAAC,IACH;GAEF,UAAU,QACR,GAAG,eAAe,GAAG,gBAAgB,GAAG,cAAc,GAAG;EAC7D;EAEA,UAAU,eAAe;EAEzB,MAAM,EAAE,OAAO,UAAU;;uBAIvB,mBA2BM,OAAA,eAAA,mBA1BW,MAAA,EAAA,CAAE,CAAA,8BAAgD,KAAA,QAAI,aAAA,yBAAA,CAAA,CAAA,GAAA,CAMrE,YAKoD,wBALpD,WACU,OAAK;IACZ,IAAI,MAAA,EAAA;IACL,KAAI;IACH,OAAO,KAAA,QAAO,KAAA,IAAY,QAAA;IAC1B,OAAK,EAAA,6BAAA,CAAkC,KAAA,MAAI;;;;;QAErC,QAAA,eAAe,UAAA,SAAa,KAAA,UAAA,UAAA,GADrC,mBAaS,UAAA;;IAXN,iBAAe,MAAA,EAAA;IACf,iBAAe,KAAA;IAChB,OAAK,eAAA,CAAC,iDAA+C,EAAA,YAC/B,KAAA,MAAI,CAAA,CAAA;IAC1B,MAAK;IACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,KAAA,QAAI,CAAI,KAAA;OAChB,WAIO,KAAA,QAAA,UAAA,EAFJ,MAAM,KAAA,MAAI,SAEN,CAAA,gBAAA,gBADF,KAAA,QAAI,eAAA,MAAA,GAAA,CAAA,CAAA,CAAA,CAAA,GAAA,IAAA,UAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,EAAA"}
|
|
1
|
+
{"version":3,"file":"ScalarMarkdownSummary.vue.script.js","names":[],"sources":["../../../src/components/ScalarMarkdown/ScalarMarkdownSummary.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Markdown Summary component\n *\n * Displays a truncated preview of markdown content with\n * a \"More\" / \"Show Less\" toggle to expand and collapse.\n *\n * @example\n * <ScalarMarkdownSummary value=\"Long markdown text...\" :clamp=\"2\" />\n */\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { useResizeObserver } from '@vueuse/core'\nimport { onMounted, useId, useTemplateRef } from 'vue'\n\nimport ScalarMarkdown from './ScalarMarkdown.vue'\nimport type { ScalarMarkdownSummaryProps } from './types'\n\nconst { clamp = 1, ...props } = defineProps<ScalarMarkdownSummaryProps>()\n\nconst id = useId()\n\n/** * Whether the summary is open. */\nconst open = defineModel<boolean>({ default: false })\n\n/** Whether the markdown is being truncated */\nconst truncated = defineModel<boolean>('truncated', { default: false })\n\nconst markdown = useTemplateRef('scalar-markdown')\n\nuseResizeObserver(() => markdown.value?.el, checkTruncation)\n\n/** Check if the markdown is being truncated */\nfunction checkTruncation() {\n const el = markdown.value?.el\n if (!el) {\n return\n }\n truncated.value =\n el.scrollHeight > el.clientHeight || el.scrollWidth > el.clientWidth\n}\n\nonMounted(checkTruncation)\n\nconst { cx } = useBindCx()\ndefineOptions({ inheritAttrs: false })\n</script>\n<template>\n <div\n v-bind=\"\n cx(\n 'group/summary flex gap-0.5',\n open ? 'flex-col' : 'flex-row items-baseline',\n )\n \">\n <ScalarMarkdown\n v-bind=\"props\"\n :id=\"id\"\n ref=\"scalar-markdown\"\n :clamp=\"open ? undefined : clamp\"\n :class=\"{ 'markdown-summary truncate': !open }\" />\n <button\n v-if=\"!controlled && (truncated || open)\"\n :aria-controls=\"id\"\n :aria-expanded=\"open\"\n class=\"whitespace-nowrap font-medium hover:underline\"\n :class=\"{ 'self-end': open }\"\n type=\"button\"\n @click=\"open = !open\">\n <slot\n name=\"button\"\n :open=\"open\">\n {{ open ? ' Show Less' : 'More' }}\n </slot>\n </button>\n </div>\n</template>\n<style>\n.scalar-app {\n /*\n Summarized markdown styles\n Doubled up to bump specificity\n */\n .markdown.markdown-summary.markdown-summary {\n /* Hide the before and after pseudo-elements for all elements */\n *:before,\n *:after {\n content: none;\n }\n\n *:not(strong, em, a, code) {\n /* Disable formatting for non-inline elements */\n display: contents;\n font-size: inherit;\n font-weight: inherit;\n line-height: var(--markdown-line-height);\n }\n\n /* Hide elements that don't make sense in the summary */\n img,\n svg,\n hr,\n pre {\n display: none;\n }\n }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqBA,MAAM,QAA0B,qBAAA,SAAA,CAAA,OAAA,CAAA;EAEhC,MAAM,KAAK,MAAM;;EAGjB,MAAM,OAAO,SAAoB,SAAA,YAAmB;;EAGpD,MAAM,YAAY,SAAoB,SAAC,WAA+B;EAEtE,MAAM,WAAW,eAAe,iBAAiB;EAEjD,wBAAwB,SAAS,OAAO,IAAI,eAAe;;EAG3D,SAAS,kBAAkB;GACzB,MAAM,KAAK,SAAS,OAAO;GAC3B,IAAI,CAAC,IACH;GAEF,UAAU,QACR,GAAG,eAAe,GAAG,gBAAgB,GAAG,cAAc,GAAG;EAC7D;EAEA,UAAU,eAAe;EAEzB,MAAM,EAAE,OAAO,UAAU;;uBAIvB,mBA2BM,OAAA,eAAA,mBA1BW,MAAA,EAAA,CAAE,CAAA,8BAAgD,KAAA,QAAI,aAAA,yBAAA,CAAA,CAAA,GAAA,CAMrE,YAKoD,wBALpD,WACU,OAAK;IACZ,IAAI,MAAA,EAAA;IACL,KAAI;IACH,OAAO,KAAA,QAAO,KAAA,IAAY,QAAA;IAC1B,OAAK,EAAA,6BAAA,CAAkC,KAAA,MAAI;;;;;QAErC,QAAA,eAAe,UAAA,SAAa,KAAA,UAAA,UAAA,GADrC,mBAaS,UAAA;;IAXN,iBAAe,MAAA,EAAA;IACf,iBAAe,KAAA;IAChB,OAAK,eAAA,CAAC,iDAA+C,EAAA,YAC/B,KAAA,MAAI,CAAA,CAAA;IAC1B,MAAK;IACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,KAAA,QAAI,CAAI,KAAA;OAChB,WAIO,KAAA,QAAA,UAAA,EAFJ,MAAM,KAAA,MAAI,SAEN,CAAA,gBAAA,gBADF,KAAA,QAAI,eAAA,MAAA,GAAA,CAAA,CAAA,CAAA,CAAA,GAAA,IAAA,UAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,EAAA"}
|
package/dist/style.css
CHANGED
package/dist/vue-styles.css
CHANGED