@mantine-vue/mantine-header 3.0.0 → 3.2.0

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 (6) hide show
  1. package/cjs/index.cjs +5 -1
  2. package/cjs/index.cjs.map +1 -1
  3. package/esm/index.mjs +5 -1
  4. package/esm/index.mjs.map +1 -1
  5. package/lib/HeaderControl.d.ts +6 -4
  6. package/package.json +2 -2
package/cjs/index.cjs CHANGED
@@ -14,7 +14,11 @@ var HeaderControl = (0, vue.defineComponent)({
14
14
  required: true
15
15
  },
16
16
  component: {
17
- type: String,
17
+ type: [
18
+ String,
19
+ Object,
20
+ Function
21
+ ],
18
22
  default: "button"
19
23
  },
20
24
  "aria-label": {
package/cjs/index.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","names":[],"sources":["../src/HeaderControl.module.css","../src/HeaderControl.ts","../src/ColorSchemeControl.module.css","../src/ColorSchemeControl.ts","../src/DirectionControl.ts","../src/icons/DiscordIcon.ts","../src/DiscordControl.module.css","../src/DiscordControl.ts","../src/icons/GithubIcon.ts","../src/GithubControl.ts","../src/SearchControl/SearchControl.module.css","../src/SearchControl/SearchControl.ts","../src/SupportControl.module.css","../src/SupportControl.ts","../src/HeaderControls.ts","../src/SearchMobileControl.ts"],"sourcesContent":[".control {\n width: 34px;\n height: 34px;\n border-radius: var(--mantine-radius-md);\n border: 1px solid;\n display: flex;\n align-items: center;\n justify-content: center;\n\n @mixin light {\n border-color: var(--mantine-color-gray-3);\n color: var(--mantine-color-gray-7);\n background-color: var(--mantine-color-white);\n\n @mixin hover {\n background-color: var(--mantine-color-gray-0);\n }\n }\n\n @mixin dark {\n border-color: var(--mantine-color-dark-4);\n color: var(--mantine-color-white);\n background-color: var(--mantine-color-dark-6);\n\n @mixin hover {\n background-color: var(--mantine-color-dark-5);\n }\n }\n}\n","import { Tooltip, UnstyledButton } from '@mantine-vue/core'\nimport { defineComponent, h } from 'vue'\nimport classes from './HeaderControl.module.css'\n\n// Renders as a <button> by default, or as any element via the `component`\n// prop, e.g. `a` for link-style controls. UnstyledButton is already\n// polymorphic through its own `component` prop, so we forward it the same way.\nexport interface HeaderControlProps {\n tooltip: string\n component?: string\n 'aria-label'?: string\n}\n\nexport const HeaderControl = defineComponent({\n name: 'HeaderControl',\n inheritAttrs: false,\n props: {\n tooltip: { type: String, required: true },\n component: { type: String, default: 'button' },\n 'aria-label': { type: String, default: undefined },\n },\n setup(props, { attrs, slots }) {\n return () =>\n h(Tooltip, { label: props.tooltip }, () =>\n h(\n UnstyledButton,\n {\n ...attrs,\n component: props.component,\n class: [classes.control, attrs.class],\n 'aria-label': props['aria-label'] || props.tooltip,\n },\n () => slots.default?.(),\n ),\n )\n },\n})\n",".icon {\n width: 22px;\n height: 22px;\n}\n\n.dark {\n @mixin dark {\n display: none;\n }\n\n @mixin light {\n display: block;\n }\n}\n\n.light {\n @mixin light {\n display: none;\n }\n\n @mixin dark {\n display: block;\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { useComputedColorScheme, useMantineColorScheme } from '@mantine-vue/core'\nimport { PhMoon, PhSun } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\nimport classes from './ColorSchemeControl.module.css'\n\nexport const ColorSchemeControl = defineComponent({\n name: 'ColorSchemeControl',\n setup() {\n const { setColorScheme } = useMantineColorScheme()\n const computedColorScheme = useComputedColorScheme('light', { getInitialValueInEffect: true })\n\n return () =>\n h(\n HeaderControl,\n {\n onClick: () => setColorScheme(computedColorScheme.value === 'light' ? 'dark' : 'light'),\n tooltip: `${computedColorScheme.value === 'dark' ? 'Light' : 'Dark'} mode`,\n 'aria-label': 'Toggle color scheme',\n },\n () => [\n h(PhSun, { class: [classes.icon, classes.light] }),\n h(PhMoon, { class: [classes.icon, classes.dark] }),\n ],\n )\n },\n})\n","import { defineComponent, h } from 'vue'\nimport { rem, useDirection } from '@mantine-vue/core'\nimport { PhTextAlignLeft, PhTextAlignRight } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\n\nexport const DirectionControl = defineComponent({\n name: 'DirectionControl',\n setup() {\n const { toggleDirection, dir } = useDirection()\n\n return () =>\n h(\n HeaderControl,\n {\n onClick: () => toggleDirection(),\n tooltip: `${dir.value === 'ltr' ? 'RTL' : 'LTR'} direction`,\n },\n () =>\n h(dir.value === 'rtl' ? PhTextAlignLeft : PhTextAlignRight, {\n style: { width: rem(22), height: rem(22), pointerEvents: 'none' },\n }),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Box, rem } from '@mantine-vue/core'\n\nexport const DiscordIcon = defineComponent({\n name: 'DiscordIcon',\n props: {\n size: { type: [String, Number] as PropType<string | number>, default: undefined },\n },\n setup(props, { attrs }) {\n return () =>\n h(\n Box,\n {\n component: 'svg',\n xmlns: 'http://www.w3.org/2000/svg',\n fill: 'none',\n viewBox: '0 0 256 199',\n ...attrs,\n style: [{ width: rem(props.size), height: rem(props.size) }, attrs.style as any],\n },\n () =>\n h('path', {\n fill: 'currentColor',\n d: 'M216.856 16.597A208.5 208.5 0 00164.042 0c-2.275 4.113-4.933 9.646-6.766 14.046-19.692-2.961-39.203-2.961-58.533 0-1.832-4.4-4.55-9.933-6.846-14.046a207.807 207.807 0 00-52.855 16.638C5.618 67.147-3.443 116.4 1.087 164.956c22.169 16.555 43.653 26.612 64.775 33.193A161.13 161.13 0 0079.735 175.3a136.374 136.374 0 01-21.846-10.632 108.542 108.542 0 005.356-4.237c42.122 19.702 87.89 19.702 129.51 0 1.751 1.46 3.543 2.88 5.355 4.237a136.011 136.011 0 01-21.886 10.653c4.006 8.02 8.638 15.671 13.873 22.848 21.142-6.581 42.646-16.637 64.815-33.213 5.316-56.288-9.081-105.09-38.056-148.36zM85.474 135.095c-12.645 0-23.015-11.805-23.015-26.18s10.149-26.2 23.015-26.2c12.867 0 23.236 11.804 23.015 26.2.02 14.375-10.148 26.18-23.015 26.18zm85.051 0c-12.645 0-23.014-11.805-23.014-26.18s10.148-26.2 23.014-26.2c12.867 0 23.236 11.804 23.015 26.2 0 14.375-10.148 26.18-23.015 26.18z',\n }),\n )\n },\n})\n",".discord {\n --discord-color: #5865f2;\n --discord-color-hover: #4f5bd5;\n\n [data-mantine-color-scheme] & {\n background-color: var(--discord-color);\n border-color: var(--discord-color);\n color: var(--mantine-color-white);\n\n @mixin hover {\n background-color: var(--discord-color-hover);\n border-color: var(--discord-color-hover);\n }\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { HeaderControl } from './HeaderControl'\nimport { DiscordIcon } from './icons/DiscordIcon'\nimport classes from './DiscordControl.module.css'\n\nexport const DiscordControl = defineComponent({\n name: 'DiscordControl',\n props: {\n link: { type: String, required: true },\n },\n setup(props) {\n return () =>\n h(\n HeaderControl,\n { tooltip: 'Discord', component: 'a', href: props.link, class: classes.discord },\n () => h(DiscordIcon, { size: 20 }),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Box, rem } from '@mantine-vue/core'\n\nexport const GithubIcon = defineComponent({\n name: 'GithubIcon',\n props: {\n size: { type: [String, Number] as PropType<string | number>, default: undefined },\n },\n setup(props, { attrs }) {\n return () =>\n h(\n Box,\n {\n component: 'svg',\n xmlns: 'http://www.w3.org/2000/svg',\n viewBox: '0 0 16 16',\n fill: 'currentColor',\n ...attrs,\n style: [{ width: rem(props.size), height: rem(props.size) }, attrs.style as any],\n },\n () =>\n h('path', {\n 'fill-rule': 'evenodd',\n d: 'M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z',\n }),\n )\n },\n})\n","import { defineComponent, h } from 'vue'\nimport { HeaderControl } from './HeaderControl'\nimport { GithubIcon } from './icons/GithubIcon'\n\nexport const GithubControl = defineComponent({\n name: 'GithubControl',\n props: {\n link: { type: String, required: true },\n },\n setup(props) {\n return () =>\n h(HeaderControl, { tooltip: 'Source code', component: 'a', href: props.link }, () =>\n h(GithubIcon, { size: 22 }),\n )\n },\n})\n",".root {\n height: 34px;\n padding-left: var(--mantine-spacing-sm);\n padding-right: 4px;\n border-radius: var(--mantine-radius-md);\n color: var(--mantine-color-placeholder);\n border: 1px solid;\n\n @mixin light {\n border-color: var(--mantine-color-gray-3);\n background-color: var(--mantine-color-white);\n }\n\n @mixin dark {\n border-color: var(--mantine-color-dark-4);\n background-color: var(--mantine-color-dark-6);\n }\n\n @mixin rtl {\n padding-left: 4px;\n padding-right: var(--mantine-spacing-sm);\n }\n}\n\n.shortcut {\n font-size: 11px;\n line-height: 1;\n padding: 4px 7px;\n border-radius: var(--mantine-radius-sm);\n border: 1px solid;\n font-weight: bold;\n\n @mixin light {\n color: var(--mantine-color-gray-7);\n border-color: var(--mantine-color-gray-2);\n background-color: var(--mantine-color-gray-0);\n }\n\n @mixin dark {\n color: var(--mantine-color-dark-0);\n border-color: var(--mantine-color-dark-7);\n background-color: var(--mantine-color-dark-7);\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { Group, rem, Text, UnstyledButton } from '@mantine-vue/core'\nimport { PhMagnifyingGlass } from '@phosphor-icons/vue'\nimport classes from './SearchControl.module.css'\n\nexport const SearchControl = defineComponent({\n name: 'SearchControl',\n inheritAttrs: false,\n setup(_props, { attrs }) {\n return () =>\n h(UnstyledButton, { ...attrs, class: [classes.root, attrs.class] }, () =>\n h(Group, { gap: 'xs' }, () => [\n h(PhMagnifyingGlass, { style: { width: rem(15), height: rem(15) } }),\n h(Text, { fz: 'sm', c: 'dimmed', pr: 80 }, () => 'Search'),\n h(Text, { fw: 700, class: classes.shortcut }, () => 'Ctrl + K'),\n ]),\n )\n },\n})\n",".support {\n @mixin light {\n color: var(--mantine-color-red-8);\n }\n\n @mixin dark {\n color: var(--mantine-color-white);\n background-color: var(--mantine-color-red-9);\n border-color: var(--mantine-color-red-9);\n\n @mixin hover {\n background-color: var(--mantine-color-red-8);\n border-color: var(--mantine-color-red-8);\n }\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { rem } from '@mantine-vue/core'\nimport { PhHeart } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\nimport classes from './SupportControl.module.css'\n\nexport const SupportControl = defineComponent({\n name: 'SupportControl',\n setup() {\n return () =>\n h(\n HeaderControl,\n {\n component: 'a',\n href: '',\n tooltip: 'Sponsor',\n 'aria-label': 'Sponsor',\n class: classes.support,\n },\n () => h(PhHeart, { weight: 'fill', style: { width: rem(22), height: rem(22) } }),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Group, Tooltip } from '@mantine-vue/core'\nimport { ColorSchemeControl } from './ColorSchemeControl'\nimport { DirectionControl } from './DirectionControl'\nimport { DiscordControl } from './DiscordControl'\nimport { GithubControl } from './GithubControl'\nimport { SearchControl } from './SearchControl'\nimport { SupportControl } from './SupportControl'\n\nexport const HeaderControls = defineComponent({\n name: 'HeaderControls',\n inheritAttrs: false,\n props: {\n onSearch: { type: Function as PropType<() => void>, default: undefined },\n githubLink: { type: String, default: undefined },\n withDirectionToggle: { type: Boolean, default: true },\n withSearch: { type: Boolean, default: true },\n withGithub: { type: Boolean, default: true },\n withDiscord: { type: Boolean, default: true },\n discordLink: { type: String, required: true },\n withColorScheme: { type: Boolean, default: true },\n withSupport: { type: Boolean, default: true },\n },\n setup(props, { attrs }) {\n return () =>\n h(Tooltip.Group, { openDelay: 600, closeDelay: 100 }, () =>\n h(Group, { gap: 'xs', ...attrs }, () => [\n props.withSearch ? h(SearchControl, { onClick: props.onSearch }) : null,\n props.withDiscord ? h(DiscordControl, { link: props.discordLink }) : null,\n props.withSupport ? h(SupportControl) : null,\n props.withGithub ? h(GithubControl, { link: props.githubLink! }) : null,\n props.withDirectionToggle ? h(DirectionControl) : null,\n props.withColorScheme ? h(ColorSchemeControl) : null,\n ]),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { rem } from '@mantine-vue/core'\nimport { PhMagnifyingGlass } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\n\nexport const SearchMobileControl = defineComponent({\n name: 'SearchMobileControl',\n props: {\n onSearch: { type: Function as PropType<() => void>, required: true },\n },\n setup(props) {\n return () =>\n h(HeaderControl, { onClick: () => props.onSearch(), tooltip: 'Search' }, () =>\n h(PhMagnifyingGlass, { style: { width: rem(22), height: rem(22) } }),\n )\n },\n})\n"],"mappings":";;;;;;;ACaA,IAAa,iBAAA,GAAA,IAAA,iBAAgC;CAC3C,MAAM;CACN,cAAc;CACd,OAAO;EACL,SAAS;GAAE,MAAM;GAAQ,UAAU;EAAK;EACxC,WAAW;GAAE,MAAM;GAAQ,SAAS;EAAS;EAC7C,cAAc;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;CACnD;CACA,MAAM,OAAO,EAAE,OAAO,SAAS;EAC7B,cAAA,GAAA,IAAA,GACI,kBAAA,SAAS,EAAE,OAAO,MAAM,QAAQ,UAAA,GAAA,IAAA,GAE9B,kBAAA,gBACA;GACE,GAAG;GACH,WAAW,MAAM;GACjB,OAAO,CAAC,6BAAQ,SAAS,MAAM,KAAK;GACpC,cAAc,MAAM,iBAAiB,MAAM;EAC7C,SACM,MAAM,UAAU,CACxB,CACF;CACJ;AACF,CAAC;;;;;;;;AE9BD,IAAa,sBAAA,GAAA,IAAA,iBAAqC;CAChD,MAAM;CACN,QAAQ;EACN,MAAM,EAAE,oBAAA,GAAA,kBAAA,uBAAyC;EACjD,MAAM,uBAAA,GAAA,kBAAA,wBAA6C,SAAS,EAAE,yBAAyB,KAAK,CAAC;EAE7F,cAAA,GAAA,IAAA,GAEI,eACA;GACE,eAAe,eAAe,oBAAoB,UAAU,UAAU,SAAS,OAAO;GACtF,SAAS,GAAG,oBAAoB,UAAU,SAAS,UAAU,OAAO;GACpE,cAAc;EAChB,SACM,EAAA,GAAA,IAAA,GACF,oBAAA,OAAO,EAAE,OAAO,CAAC,kCAAQ,MAAM,kCAAQ,KAAK,EAAE,CAAC,IAAA,GAAA,IAAA,GAC/C,oBAAA,QAAQ,EAAE,OAAO,CAAC,kCAAQ,MAAM,kCAAQ,IAAI,EAAE,CAAC,CACnD,CACF;CACJ;AACF,CAAC;;;ACrBD,IAAa,oBAAA,GAAA,IAAA,iBAAmC;CAC9C,MAAM;CACN,QAAQ;EACN,MAAM,EAAE,iBAAiB,SAAA,GAAA,kBAAA,cAAqB;EAE9C,cAAA,GAAA,IAAA,GAEI,eACA;GACE,eAAe,gBAAgB;GAC/B,SAAS,GAAG,IAAI,UAAU,QAAQ,QAAQ,MAAM;EAClD,UAAA,GAAA,IAAA,GAEI,IAAI,UAAU,QAAQ,oBAAA,kBAAkB,oBAAA,kBAAkB,EAC1D,OAAO;GAAE,QAAA,GAAA,kBAAA,KAAW,EAAE;GAAG,SAAA,GAAA,kBAAA,KAAY,EAAE;GAAG,eAAe;EAAO,EAClE,CAAC,CACL;CACJ;AACF,CAAC;;;ACpBD,IAAa,eAAA,GAAA,IAAA,iBAA8B;CACzC,MAAM;CACN,OAAO,EACL,MAAM;EAAE,MAAM,CAAC,QAAQ,MAAM;EAAgC,SAAS,KAAA;CAAU,EAClF;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,cAAA,GAAA,IAAA,GAEI,kBAAA,KACA;GACE,WAAW;GACX,OAAO;GACP,MAAM;GACN,SAAS;GACT,GAAG;GACH,OAAO,CAAC;IAAE,QAAA,GAAA,kBAAA,KAAW,MAAM,IAAI;IAAG,SAAA,GAAA,kBAAA,KAAY,MAAM,IAAI;GAAE,GAAG,MAAM,KAAY;EACjF,UAAA,GAAA,IAAA,GAEI,QAAQ;GACR,MAAM;GACN,GAAG;EACL,CAAC,CACL;CACJ;AACF,CAAC;;;;AEtBD,IAAa,kBAAA,GAAA,IAAA,iBAAiC;CAC5C,MAAM;CACN,OAAO,EACL,MAAM;EAAE,MAAM;EAAQ,UAAU;CAAK,EACvC;CACA,MAAM,OAAO;EACX,cAAA,GAAA,IAAA,GAEI,eACA;GAAE,SAAS;GAAW,WAAW;GAAK,MAAM,MAAM;GAAM,OAAO,8BAAQ;EAAQ,UAAA,GAAA,IAAA,GACvE,aAAa,EAAE,MAAM,GAAG,CAAC,CACnC;CACJ;AACF,CAAC;;;ACfD,IAAa,cAAA,GAAA,IAAA,iBAA6B;CACxC,MAAM;CACN,OAAO,EACL,MAAM;EAAE,MAAM,CAAC,QAAQ,MAAM;EAAgC,SAAS,KAAA;CAAU,EAClF;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,cAAA,GAAA,IAAA,GAEI,kBAAA,KACA;GACE,WAAW;GACX,OAAO;GACP,SAAS;GACT,MAAM;GACN,GAAG;GACH,OAAO,CAAC;IAAE,QAAA,GAAA,kBAAA,KAAW,MAAM,IAAI;IAAG,SAAA,GAAA,kBAAA,KAAY,MAAM,IAAI;GAAE,GAAG,MAAM,KAAY;EACjF,UAAA,GAAA,IAAA,GAEI,QAAQ;GACR,aAAa;GACb,GAAG;EACL,CAAC,CACL;CACJ;AACF,CAAC;;;ACvBD,IAAa,iBAAA,GAAA,IAAA,iBAAgC;CAC3C,MAAM;CACN,OAAO,EACL,MAAM;EAAE,MAAM;EAAQ,UAAU;CAAK,EACvC;CACA,MAAM,OAAO;EACX,cAAA,GAAA,IAAA,GACI,eAAe;GAAE,SAAS;GAAe,WAAW;GAAK,MAAM,MAAM;EAAK,UAAA,GAAA,IAAA,GACxE,YAAY,EAAE,MAAM,GAAG,CAAC,CAC5B;CACJ;AACF,CAAC;;;;;;;AEVD,IAAa,iBAAA,GAAA,IAAA,iBAAgC;CAC3C,MAAM;CACN,cAAc;CACd,MAAM,QAAQ,EAAE,SAAS;EACvB,cAAA,GAAA,IAAA,GACI,kBAAA,gBAAgB;GAAE,GAAG;GAAO,OAAO,CAAC,6BAAQ,MAAM,MAAM,KAAK;EAAE,UAAA,GAAA,IAAA,GAC7D,kBAAA,OAAO,EAAE,KAAK,KAAK,SAAS;cAC1B,oBAAA,mBAAmB,EAAE,OAAO;IAAE,QAAA,GAAA,kBAAA,KAAW,EAAE;IAAG,SAAA,GAAA,kBAAA,KAAY,EAAE;GAAE,EAAE,CAAC;cACjE,kBAAA,MAAM;IAAE,IAAI;IAAM,GAAG;IAAU,IAAI;GAAG,SAAS,QAAQ;cACvD,kBAAA,MAAM;IAAE,IAAI;IAAK,OAAO,6BAAQ;GAAS,SAAS,UAAU;EAChE,CAAC,CACH;CACJ;AACF,CAAC;;;;AEZD,IAAa,kBAAA,GAAA,IAAA,iBAAiC;CAC5C,MAAM;CACN,QAAQ;EACN,cAAA,GAAA,IAAA,GAEI,eACA;GACE,WAAW;GACX,MAAM;GACN,SAAS;GACT,cAAc;GACd,OAAO,8BAAQ;EACjB,UAAA,GAAA,IAAA,GACQ,oBAAA,SAAS;GAAE,QAAQ;GAAQ,OAAO;IAAE,QAAA,GAAA,kBAAA,KAAW,EAAE;IAAG,SAAA,GAAA,kBAAA,KAAY,EAAE;GAAE;EAAE,CAAC,CACjF;CACJ;AACF,CAAC;;;ACbD,IAAa,kBAAA,GAAA,IAAA,iBAAiC;CAC5C,MAAM;CACN,cAAc;CACd,OAAO;EACL,UAAU;GAAE,MAAM;GAAkC,SAAS,KAAA;EAAU;EACvE,YAAY;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;EAC/C,qBAAqB;GAAE,MAAM;GAAS,SAAS;EAAK;EACpD,YAAY;GAAE,MAAM;GAAS,SAAS;EAAK;EAC3C,YAAY;GAAE,MAAM;GAAS,SAAS;EAAK;EAC3C,aAAa;GAAE,MAAM;GAAS,SAAS;EAAK;EAC5C,aAAa;GAAE,MAAM;GAAQ,UAAU;EAAK;EAC5C,iBAAiB;GAAE,MAAM;GAAS,SAAS;EAAK;EAChD,aAAa;GAAE,MAAM;GAAS,SAAS;EAAK;CAC9C;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,cAAA,GAAA,IAAA,GACI,kBAAA,QAAQ,OAAO;GAAE,WAAW;GAAK,YAAY;EAAI,UAAA,GAAA,IAAA,GAC/C,kBAAA,OAAO;GAAE,KAAK;GAAM,GAAG;EAAM,SAAS;GACtC,MAAM,cAAA,GAAA,IAAA,GAAe,eAAe,EAAE,SAAS,MAAM,SAAS,CAAC,IAAI;GACnE,MAAM,eAAA,GAAA,IAAA,GAAgB,gBAAgB,EAAE,MAAM,MAAM,YAAY,CAAC,IAAI;GACrE,MAAM,eAAA,GAAA,IAAA,GAAgB,cAAc,IAAI;GACxC,MAAM,cAAA,GAAA,IAAA,GAAe,eAAe,EAAE,MAAM,MAAM,WAAY,CAAC,IAAI;GACnE,MAAM,uBAAA,GAAA,IAAA,GAAwB,gBAAgB,IAAI;GAClD,MAAM,mBAAA,GAAA,IAAA,GAAoB,kBAAkB,IAAI;EAClD,CAAC,CACH;CACJ;AACF,CAAC;;;AC/BD,IAAa,uBAAA,GAAA,IAAA,iBAAsC;CACjD,MAAM;CACN,OAAO,EACL,UAAU;EAAE,MAAM;EAAkC,UAAU;CAAK,EACrE;CACA,MAAM,OAAO;EACX,cAAA,GAAA,IAAA,GACI,eAAe;GAAE,eAAe,MAAM,SAAS;GAAG,SAAS;EAAS,UAAA,GAAA,IAAA,GAClE,oBAAA,mBAAmB,EAAE,OAAO;GAAE,QAAA,GAAA,kBAAA,KAAW,EAAE;GAAG,SAAA,GAAA,kBAAA,KAAY,EAAE;EAAE,EAAE,CAAC,CACrE;CACJ;AACF,CAAC"}
1
+ {"version":3,"file":"index.cjs","names":[],"sources":["../src/HeaderControl.module.css","../src/HeaderControl.ts","../src/ColorSchemeControl.module.css","../src/ColorSchemeControl.ts","../src/DirectionControl.ts","../src/icons/DiscordIcon.ts","../src/DiscordControl.module.css","../src/DiscordControl.ts","../src/icons/GithubIcon.ts","../src/GithubControl.ts","../src/SearchControl/SearchControl.module.css","../src/SearchControl/SearchControl.ts","../src/SupportControl.module.css","../src/SupportControl.ts","../src/HeaderControls.ts","../src/SearchMobileControl.ts"],"sourcesContent":[".control {\n width: 34px;\n height: 34px;\n border-radius: var(--mantine-radius-md);\n border: 1px solid;\n display: flex;\n align-items: center;\n justify-content: center;\n\n @mixin light {\n border-color: var(--mantine-color-gray-3);\n color: var(--mantine-color-gray-7);\n background-color: var(--mantine-color-white);\n\n @mixin hover {\n background-color: var(--mantine-color-gray-0);\n }\n }\n\n @mixin dark {\n border-color: var(--mantine-color-dark-4);\n color: var(--mantine-color-white);\n background-color: var(--mantine-color-dark-6);\n\n @mixin hover {\n background-color: var(--mantine-color-dark-5);\n }\n }\n}\n","import { Tooltip, UnstyledButton } from '@mantine-vue/core'\nimport type { MantineElementType } from '@mantine-vue/core'\nimport { defineComponent, h, type PropType } from 'vue'\nimport classes from './HeaderControl.module.css'\n\n// Renders as a <button> by default, or as any element via the `component`\n// prop, e.g. `a` for link-style controls. UnstyledButton is already\n// polymorphic through its own `component` prop, so we forward it the same way.\nexport interface HeaderControlProps {\n tooltip: string\n component?: MantineElementType\n 'aria-label'?: string\n}\n\nexport const HeaderControl = defineComponent({\n name: 'HeaderControl',\n inheritAttrs: false,\n props: {\n tooltip: { type: String, required: true },\n component: {\n type: [String, Object, Function] as PropType<MantineElementType>,\n default: 'button',\n },\n 'aria-label': { type: String, default: undefined },\n },\n setup(props, { attrs, slots }) {\n return () =>\n h(Tooltip, { label: props.tooltip }, () =>\n h(\n UnstyledButton,\n {\n ...attrs,\n component: props.component,\n class: [classes.control, attrs.class],\n 'aria-label': props['aria-label'] || props.tooltip,\n },\n () => slots.default?.(),\n ),\n )\n },\n})\n",".icon {\n width: 22px;\n height: 22px;\n}\n\n.dark {\n @mixin dark {\n display: none;\n }\n\n @mixin light {\n display: block;\n }\n}\n\n.light {\n @mixin light {\n display: none;\n }\n\n @mixin dark {\n display: block;\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { useComputedColorScheme, useMantineColorScheme } from '@mantine-vue/core'\nimport { PhMoon, PhSun } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\nimport classes from './ColorSchemeControl.module.css'\n\nexport const ColorSchemeControl = defineComponent({\n name: 'ColorSchemeControl',\n setup() {\n const { setColorScheme } = useMantineColorScheme()\n const computedColorScheme = useComputedColorScheme('light', { getInitialValueInEffect: true })\n\n return () =>\n h(\n HeaderControl,\n {\n onClick: () => setColorScheme(computedColorScheme.value === 'light' ? 'dark' : 'light'),\n tooltip: `${computedColorScheme.value === 'dark' ? 'Light' : 'Dark'} mode`,\n 'aria-label': 'Toggle color scheme',\n },\n () => [\n h(PhSun, { class: [classes.icon, classes.light] }),\n h(PhMoon, { class: [classes.icon, classes.dark] }),\n ],\n )\n },\n})\n","import { defineComponent, h } from 'vue'\nimport { rem, useDirection } from '@mantine-vue/core'\nimport { PhTextAlignLeft, PhTextAlignRight } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\n\nexport const DirectionControl = defineComponent({\n name: 'DirectionControl',\n setup() {\n const { toggleDirection, dir } = useDirection()\n\n return () =>\n h(\n HeaderControl,\n {\n onClick: () => toggleDirection(),\n tooltip: `${dir.value === 'ltr' ? 'RTL' : 'LTR'} direction`,\n },\n () =>\n h(dir.value === 'rtl' ? PhTextAlignLeft : PhTextAlignRight, {\n style: { width: rem(22), height: rem(22), pointerEvents: 'none' },\n }),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Box, rem } from '@mantine-vue/core'\n\nexport const DiscordIcon = defineComponent({\n name: 'DiscordIcon',\n props: {\n size: { type: [String, Number] as PropType<string | number>, default: undefined },\n },\n setup(props, { attrs }) {\n return () =>\n h(\n Box,\n {\n component: 'svg',\n xmlns: 'http://www.w3.org/2000/svg',\n fill: 'none',\n viewBox: '0 0 256 199',\n ...attrs,\n style: [{ width: rem(props.size), height: rem(props.size) }, attrs.style as any],\n },\n () =>\n h('path', {\n fill: 'currentColor',\n d: 'M216.856 16.597A208.5 208.5 0 00164.042 0c-2.275 4.113-4.933 9.646-6.766 14.046-19.692-2.961-39.203-2.961-58.533 0-1.832-4.4-4.55-9.933-6.846-14.046a207.807 207.807 0 00-52.855 16.638C5.618 67.147-3.443 116.4 1.087 164.956c22.169 16.555 43.653 26.612 64.775 33.193A161.13 161.13 0 0079.735 175.3a136.374 136.374 0 01-21.846-10.632 108.542 108.542 0 005.356-4.237c42.122 19.702 87.89 19.702 129.51 0 1.751 1.46 3.543 2.88 5.355 4.237a136.011 136.011 0 01-21.886 10.653c4.006 8.02 8.638 15.671 13.873 22.848 21.142-6.581 42.646-16.637 64.815-33.213 5.316-56.288-9.081-105.09-38.056-148.36zM85.474 135.095c-12.645 0-23.015-11.805-23.015-26.18s10.149-26.2 23.015-26.2c12.867 0 23.236 11.804 23.015 26.2.02 14.375-10.148 26.18-23.015 26.18zm85.051 0c-12.645 0-23.014-11.805-23.014-26.18s10.148-26.2 23.014-26.2c12.867 0 23.236 11.804 23.015 26.2 0 14.375-10.148 26.18-23.015 26.18z',\n }),\n )\n },\n})\n",".discord {\n --discord-color: #5865f2;\n --discord-color-hover: #4f5bd5;\n\n [data-mantine-color-scheme] & {\n background-color: var(--discord-color);\n border-color: var(--discord-color);\n color: var(--mantine-color-white);\n\n @mixin hover {\n background-color: var(--discord-color-hover);\n border-color: var(--discord-color-hover);\n }\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { HeaderControl } from './HeaderControl'\nimport { DiscordIcon } from './icons/DiscordIcon'\nimport classes from './DiscordControl.module.css'\n\nexport const DiscordControl = defineComponent({\n name: 'DiscordControl',\n props: {\n link: { type: String, required: true },\n },\n setup(props) {\n return () =>\n h(\n HeaderControl,\n { tooltip: 'Discord', component: 'a', href: props.link, class: classes.discord },\n () => h(DiscordIcon, { size: 20 }),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Box, rem } from '@mantine-vue/core'\n\nexport const GithubIcon = defineComponent({\n name: 'GithubIcon',\n props: {\n size: { type: [String, Number] as PropType<string | number>, default: undefined },\n },\n setup(props, { attrs }) {\n return () =>\n h(\n Box,\n {\n component: 'svg',\n xmlns: 'http://www.w3.org/2000/svg',\n viewBox: '0 0 16 16',\n fill: 'currentColor',\n ...attrs,\n style: [{ width: rem(props.size), height: rem(props.size) }, attrs.style as any],\n },\n () =>\n h('path', {\n 'fill-rule': 'evenodd',\n d: 'M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z',\n }),\n )\n },\n})\n","import { defineComponent, h } from 'vue'\nimport { HeaderControl } from './HeaderControl'\nimport { GithubIcon } from './icons/GithubIcon'\n\nexport const GithubControl = defineComponent({\n name: 'GithubControl',\n props: {\n link: { type: String, required: true },\n },\n setup(props) {\n return () =>\n h(HeaderControl, { tooltip: 'Source code', component: 'a', href: props.link }, () =>\n h(GithubIcon, { size: 22 }),\n )\n },\n})\n",".root {\n height: 34px;\n padding-left: var(--mantine-spacing-sm);\n padding-right: 4px;\n border-radius: var(--mantine-radius-md);\n color: var(--mantine-color-placeholder);\n border: 1px solid;\n\n @mixin light {\n border-color: var(--mantine-color-gray-3);\n background-color: var(--mantine-color-white);\n }\n\n @mixin dark {\n border-color: var(--mantine-color-dark-4);\n background-color: var(--mantine-color-dark-6);\n }\n\n @mixin rtl {\n padding-left: 4px;\n padding-right: var(--mantine-spacing-sm);\n }\n}\n\n.shortcut {\n font-size: 11px;\n line-height: 1;\n padding: 4px 7px;\n border-radius: var(--mantine-radius-sm);\n border: 1px solid;\n font-weight: bold;\n\n @mixin light {\n color: var(--mantine-color-gray-7);\n border-color: var(--mantine-color-gray-2);\n background-color: var(--mantine-color-gray-0);\n }\n\n @mixin dark {\n color: var(--mantine-color-dark-0);\n border-color: var(--mantine-color-dark-7);\n background-color: var(--mantine-color-dark-7);\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { Group, rem, Text, UnstyledButton } from '@mantine-vue/core'\nimport { PhMagnifyingGlass } from '@phosphor-icons/vue'\nimport classes from './SearchControl.module.css'\n\nexport const SearchControl = defineComponent({\n name: 'SearchControl',\n inheritAttrs: false,\n setup(_props, { attrs }) {\n return () =>\n h(UnstyledButton, { ...attrs, class: [classes.root, attrs.class] }, () =>\n h(Group, { gap: 'xs' }, () => [\n h(PhMagnifyingGlass, { style: { width: rem(15), height: rem(15) } }),\n h(Text, { fz: 'sm', c: 'dimmed', pr: 80 }, () => 'Search'),\n h(Text, { fw: 700, class: classes.shortcut }, () => 'Ctrl + K'),\n ]),\n )\n },\n})\n",".support {\n @mixin light {\n color: var(--mantine-color-red-8);\n }\n\n @mixin dark {\n color: var(--mantine-color-white);\n background-color: var(--mantine-color-red-9);\n border-color: var(--mantine-color-red-9);\n\n @mixin hover {\n background-color: var(--mantine-color-red-8);\n border-color: var(--mantine-color-red-8);\n }\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { rem } from '@mantine-vue/core'\nimport { PhHeart } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\nimport classes from './SupportControl.module.css'\n\nexport const SupportControl = defineComponent({\n name: 'SupportControl',\n setup() {\n return () =>\n h(\n HeaderControl,\n {\n component: 'a',\n href: '',\n tooltip: 'Sponsor',\n 'aria-label': 'Sponsor',\n class: classes.support,\n },\n () => h(PhHeart, { weight: 'fill', style: { width: rem(22), height: rem(22) } }),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Group, Tooltip } from '@mantine-vue/core'\nimport { ColorSchemeControl } from './ColorSchemeControl'\nimport { DirectionControl } from './DirectionControl'\nimport { DiscordControl } from './DiscordControl'\nimport { GithubControl } from './GithubControl'\nimport { SearchControl } from './SearchControl'\nimport { SupportControl } from './SupportControl'\n\nexport const HeaderControls = defineComponent({\n name: 'HeaderControls',\n inheritAttrs: false,\n props: {\n onSearch: { type: Function as PropType<() => void>, default: undefined },\n githubLink: { type: String, default: undefined },\n withDirectionToggle: { type: Boolean, default: true },\n withSearch: { type: Boolean, default: true },\n withGithub: { type: Boolean, default: true },\n withDiscord: { type: Boolean, default: true },\n discordLink: { type: String, required: true },\n withColorScheme: { type: Boolean, default: true },\n withSupport: { type: Boolean, default: true },\n },\n setup(props, { attrs }) {\n return () =>\n h(Tooltip.Group, { openDelay: 600, closeDelay: 100 }, () =>\n h(Group, { gap: 'xs', ...attrs }, () => [\n props.withSearch ? h(SearchControl, { onClick: props.onSearch }) : null,\n props.withDiscord ? h(DiscordControl, { link: props.discordLink }) : null,\n props.withSupport ? h(SupportControl) : null,\n props.withGithub ? h(GithubControl, { link: props.githubLink! }) : null,\n props.withDirectionToggle ? h(DirectionControl) : null,\n props.withColorScheme ? h(ColorSchemeControl) : null,\n ]),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { rem } from '@mantine-vue/core'\nimport { PhMagnifyingGlass } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\n\nexport const SearchMobileControl = defineComponent({\n name: 'SearchMobileControl',\n props: {\n onSearch: { type: Function as PropType<() => void>, required: true },\n },\n setup(props) {\n return () =>\n h(HeaderControl, { onClick: () => props.onSearch(), tooltip: 'Search' }, () =>\n h(PhMagnifyingGlass, { style: { width: rem(22), height: rem(22) } }),\n )\n },\n})\n"],"mappings":"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"}
package/esm/index.mjs CHANGED
@@ -13,7 +13,11 @@ var HeaderControl = defineComponent({
13
13
  required: true
14
14
  },
15
15
  component: {
16
- type: String,
16
+ type: [
17
+ String,
18
+ Object,
19
+ Function
20
+ ],
17
21
  default: "button"
18
22
  },
19
23
  "aria-label": {
package/esm/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","names":[],"sources":["../src/HeaderControl.module.css","../src/HeaderControl.ts","../src/ColorSchemeControl.module.css","../src/ColorSchemeControl.ts","../src/DirectionControl.ts","../src/icons/DiscordIcon.ts","../src/DiscordControl.module.css","../src/DiscordControl.ts","../src/icons/GithubIcon.ts","../src/GithubControl.ts","../src/SearchControl/SearchControl.module.css","../src/SearchControl/SearchControl.ts","../src/SupportControl.module.css","../src/SupportControl.ts","../src/HeaderControls.ts","../src/SearchMobileControl.ts"],"sourcesContent":[".control {\n width: 34px;\n height: 34px;\n border-radius: var(--mantine-radius-md);\n border: 1px solid;\n display: flex;\n align-items: center;\n justify-content: center;\n\n @mixin light {\n border-color: var(--mantine-color-gray-3);\n color: var(--mantine-color-gray-7);\n background-color: var(--mantine-color-white);\n\n @mixin hover {\n background-color: var(--mantine-color-gray-0);\n }\n }\n\n @mixin dark {\n border-color: var(--mantine-color-dark-4);\n color: var(--mantine-color-white);\n background-color: var(--mantine-color-dark-6);\n\n @mixin hover {\n background-color: var(--mantine-color-dark-5);\n }\n }\n}\n","import { Tooltip, UnstyledButton } from '@mantine-vue/core'\nimport { defineComponent, h } from 'vue'\nimport classes from './HeaderControl.module.css'\n\n// Renders as a <button> by default, or as any element via the `component`\n// prop, e.g. `a` for link-style controls. UnstyledButton is already\n// polymorphic through its own `component` prop, so we forward it the same way.\nexport interface HeaderControlProps {\n tooltip: string\n component?: string\n 'aria-label'?: string\n}\n\nexport const HeaderControl = defineComponent({\n name: 'HeaderControl',\n inheritAttrs: false,\n props: {\n tooltip: { type: String, required: true },\n component: { type: String, default: 'button' },\n 'aria-label': { type: String, default: undefined },\n },\n setup(props, { attrs, slots }) {\n return () =>\n h(Tooltip, { label: props.tooltip }, () =>\n h(\n UnstyledButton,\n {\n ...attrs,\n component: props.component,\n class: [classes.control, attrs.class],\n 'aria-label': props['aria-label'] || props.tooltip,\n },\n () => slots.default?.(),\n ),\n )\n },\n})\n",".icon {\n width: 22px;\n height: 22px;\n}\n\n.dark {\n @mixin dark {\n display: none;\n }\n\n @mixin light {\n display: block;\n }\n}\n\n.light {\n @mixin light {\n display: none;\n }\n\n @mixin dark {\n display: block;\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { useComputedColorScheme, useMantineColorScheme } from '@mantine-vue/core'\nimport { PhMoon, PhSun } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\nimport classes from './ColorSchemeControl.module.css'\n\nexport const ColorSchemeControl = defineComponent({\n name: 'ColorSchemeControl',\n setup() {\n const { setColorScheme } = useMantineColorScheme()\n const computedColorScheme = useComputedColorScheme('light', { getInitialValueInEffect: true })\n\n return () =>\n h(\n HeaderControl,\n {\n onClick: () => setColorScheme(computedColorScheme.value === 'light' ? 'dark' : 'light'),\n tooltip: `${computedColorScheme.value === 'dark' ? 'Light' : 'Dark'} mode`,\n 'aria-label': 'Toggle color scheme',\n },\n () => [\n h(PhSun, { class: [classes.icon, classes.light] }),\n h(PhMoon, { class: [classes.icon, classes.dark] }),\n ],\n )\n },\n})\n","import { defineComponent, h } from 'vue'\nimport { rem, useDirection } from '@mantine-vue/core'\nimport { PhTextAlignLeft, PhTextAlignRight } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\n\nexport const DirectionControl = defineComponent({\n name: 'DirectionControl',\n setup() {\n const { toggleDirection, dir } = useDirection()\n\n return () =>\n h(\n HeaderControl,\n {\n onClick: () => toggleDirection(),\n tooltip: `${dir.value === 'ltr' ? 'RTL' : 'LTR'} direction`,\n },\n () =>\n h(dir.value === 'rtl' ? PhTextAlignLeft : PhTextAlignRight, {\n style: { width: rem(22), height: rem(22), pointerEvents: 'none' },\n }),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Box, rem } from '@mantine-vue/core'\n\nexport const DiscordIcon = defineComponent({\n name: 'DiscordIcon',\n props: {\n size: { type: [String, Number] as PropType<string | number>, default: undefined },\n },\n setup(props, { attrs }) {\n return () =>\n h(\n Box,\n {\n component: 'svg',\n xmlns: 'http://www.w3.org/2000/svg',\n fill: 'none',\n viewBox: '0 0 256 199',\n ...attrs,\n style: [{ width: rem(props.size), height: rem(props.size) }, attrs.style as any],\n },\n () =>\n h('path', {\n fill: 'currentColor',\n d: 'M216.856 16.597A208.5 208.5 0 00164.042 0c-2.275 4.113-4.933 9.646-6.766 14.046-19.692-2.961-39.203-2.961-58.533 0-1.832-4.4-4.55-9.933-6.846-14.046a207.807 207.807 0 00-52.855 16.638C5.618 67.147-3.443 116.4 1.087 164.956c22.169 16.555 43.653 26.612 64.775 33.193A161.13 161.13 0 0079.735 175.3a136.374 136.374 0 01-21.846-10.632 108.542 108.542 0 005.356-4.237c42.122 19.702 87.89 19.702 129.51 0 1.751 1.46 3.543 2.88 5.355 4.237a136.011 136.011 0 01-21.886 10.653c4.006 8.02 8.638 15.671 13.873 22.848 21.142-6.581 42.646-16.637 64.815-33.213 5.316-56.288-9.081-105.09-38.056-148.36zM85.474 135.095c-12.645 0-23.015-11.805-23.015-26.18s10.149-26.2 23.015-26.2c12.867 0 23.236 11.804 23.015 26.2.02 14.375-10.148 26.18-23.015 26.18zm85.051 0c-12.645 0-23.014-11.805-23.014-26.18s10.148-26.2 23.014-26.2c12.867 0 23.236 11.804 23.015 26.2 0 14.375-10.148 26.18-23.015 26.18z',\n }),\n )\n },\n})\n",".discord {\n --discord-color: #5865f2;\n --discord-color-hover: #4f5bd5;\n\n [data-mantine-color-scheme] & {\n background-color: var(--discord-color);\n border-color: var(--discord-color);\n color: var(--mantine-color-white);\n\n @mixin hover {\n background-color: var(--discord-color-hover);\n border-color: var(--discord-color-hover);\n }\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { HeaderControl } from './HeaderControl'\nimport { DiscordIcon } from './icons/DiscordIcon'\nimport classes from './DiscordControl.module.css'\n\nexport const DiscordControl = defineComponent({\n name: 'DiscordControl',\n props: {\n link: { type: String, required: true },\n },\n setup(props) {\n return () =>\n h(\n HeaderControl,\n { tooltip: 'Discord', component: 'a', href: props.link, class: classes.discord },\n () => h(DiscordIcon, { size: 20 }),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Box, rem } from '@mantine-vue/core'\n\nexport const GithubIcon = defineComponent({\n name: 'GithubIcon',\n props: {\n size: { type: [String, Number] as PropType<string | number>, default: undefined },\n },\n setup(props, { attrs }) {\n return () =>\n h(\n Box,\n {\n component: 'svg',\n xmlns: 'http://www.w3.org/2000/svg',\n viewBox: '0 0 16 16',\n fill: 'currentColor',\n ...attrs,\n style: [{ width: rem(props.size), height: rem(props.size) }, attrs.style as any],\n },\n () =>\n h('path', {\n 'fill-rule': 'evenodd',\n d: 'M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z',\n }),\n )\n },\n})\n","import { defineComponent, h } from 'vue'\nimport { HeaderControl } from './HeaderControl'\nimport { GithubIcon } from './icons/GithubIcon'\n\nexport const GithubControl = defineComponent({\n name: 'GithubControl',\n props: {\n link: { type: String, required: true },\n },\n setup(props) {\n return () =>\n h(HeaderControl, { tooltip: 'Source code', component: 'a', href: props.link }, () =>\n h(GithubIcon, { size: 22 }),\n )\n },\n})\n",".root {\n height: 34px;\n padding-left: var(--mantine-spacing-sm);\n padding-right: 4px;\n border-radius: var(--mantine-radius-md);\n color: var(--mantine-color-placeholder);\n border: 1px solid;\n\n @mixin light {\n border-color: var(--mantine-color-gray-3);\n background-color: var(--mantine-color-white);\n }\n\n @mixin dark {\n border-color: var(--mantine-color-dark-4);\n background-color: var(--mantine-color-dark-6);\n }\n\n @mixin rtl {\n padding-left: 4px;\n padding-right: var(--mantine-spacing-sm);\n }\n}\n\n.shortcut {\n font-size: 11px;\n line-height: 1;\n padding: 4px 7px;\n border-radius: var(--mantine-radius-sm);\n border: 1px solid;\n font-weight: bold;\n\n @mixin light {\n color: var(--mantine-color-gray-7);\n border-color: var(--mantine-color-gray-2);\n background-color: var(--mantine-color-gray-0);\n }\n\n @mixin dark {\n color: var(--mantine-color-dark-0);\n border-color: var(--mantine-color-dark-7);\n background-color: var(--mantine-color-dark-7);\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { Group, rem, Text, UnstyledButton } from '@mantine-vue/core'\nimport { PhMagnifyingGlass } from '@phosphor-icons/vue'\nimport classes from './SearchControl.module.css'\n\nexport const SearchControl = defineComponent({\n name: 'SearchControl',\n inheritAttrs: false,\n setup(_props, { attrs }) {\n return () =>\n h(UnstyledButton, { ...attrs, class: [classes.root, attrs.class] }, () =>\n h(Group, { gap: 'xs' }, () => [\n h(PhMagnifyingGlass, { style: { width: rem(15), height: rem(15) } }),\n h(Text, { fz: 'sm', c: 'dimmed', pr: 80 }, () => 'Search'),\n h(Text, { fw: 700, class: classes.shortcut }, () => 'Ctrl + K'),\n ]),\n )\n },\n})\n",".support {\n @mixin light {\n color: var(--mantine-color-red-8);\n }\n\n @mixin dark {\n color: var(--mantine-color-white);\n background-color: var(--mantine-color-red-9);\n border-color: var(--mantine-color-red-9);\n\n @mixin hover {\n background-color: var(--mantine-color-red-8);\n border-color: var(--mantine-color-red-8);\n }\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { rem } from '@mantine-vue/core'\nimport { PhHeart } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\nimport classes from './SupportControl.module.css'\n\nexport const SupportControl = defineComponent({\n name: 'SupportControl',\n setup() {\n return () =>\n h(\n HeaderControl,\n {\n component: 'a',\n href: '',\n tooltip: 'Sponsor',\n 'aria-label': 'Sponsor',\n class: classes.support,\n },\n () => h(PhHeart, { weight: 'fill', style: { width: rem(22), height: rem(22) } }),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Group, Tooltip } from '@mantine-vue/core'\nimport { ColorSchemeControl } from './ColorSchemeControl'\nimport { DirectionControl } from './DirectionControl'\nimport { DiscordControl } from './DiscordControl'\nimport { GithubControl } from './GithubControl'\nimport { SearchControl } from './SearchControl'\nimport { SupportControl } from './SupportControl'\n\nexport const HeaderControls = defineComponent({\n name: 'HeaderControls',\n inheritAttrs: false,\n props: {\n onSearch: { type: Function as PropType<() => void>, default: undefined },\n githubLink: { type: String, default: undefined },\n withDirectionToggle: { type: Boolean, default: true },\n withSearch: { type: Boolean, default: true },\n withGithub: { type: Boolean, default: true },\n withDiscord: { type: Boolean, default: true },\n discordLink: { type: String, required: true },\n withColorScheme: { type: Boolean, default: true },\n withSupport: { type: Boolean, default: true },\n },\n setup(props, { attrs }) {\n return () =>\n h(Tooltip.Group, { openDelay: 600, closeDelay: 100 }, () =>\n h(Group, { gap: 'xs', ...attrs }, () => [\n props.withSearch ? h(SearchControl, { onClick: props.onSearch }) : null,\n props.withDiscord ? h(DiscordControl, { link: props.discordLink }) : null,\n props.withSupport ? h(SupportControl) : null,\n props.withGithub ? h(GithubControl, { link: props.githubLink! }) : null,\n props.withDirectionToggle ? h(DirectionControl) : null,\n props.withColorScheme ? h(ColorSchemeControl) : null,\n ]),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { rem } from '@mantine-vue/core'\nimport { PhMagnifyingGlass } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\n\nexport const SearchMobileControl = defineComponent({\n name: 'SearchMobileControl',\n props: {\n onSearch: { type: Function as PropType<() => void>, required: true },\n },\n setup(props) {\n return () =>\n h(HeaderControl, { onClick: () => props.onSearch(), tooltip: 'Search' }, () =>\n h(PhMagnifyingGlass, { style: { width: rem(22), height: rem(22) } }),\n )\n },\n})\n"],"mappings":";;;;;;ACaA,IAAa,gBAAgB,gBAAgB;CAC3C,MAAM;CACN,cAAc;CACd,OAAO;EACL,SAAS;GAAE,MAAM;GAAQ,UAAU;EAAK;EACxC,WAAW;GAAE,MAAM;GAAQ,SAAS;EAAS;EAC7C,cAAc;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;CACnD;CACA,MAAM,OAAO,EAAE,OAAO,SAAS;EAC7B,aACE,EAAE,SAAS,EAAE,OAAO,MAAM,QAAQ,SAChC,EACE,gBACA;GACE,GAAG;GACH,WAAW,MAAM;GACjB,OAAO,CAAC,6BAAQ,SAAS,MAAM,KAAK;GACpC,cAAc,MAAM,iBAAiB,MAAM;EAC7C,SACM,MAAM,UAAU,CACxB,CACF;CACJ;AACF,CAAC;;;;;;;;AE9BD,IAAa,qBAAqB,gBAAgB;CAChD,MAAM;CACN,QAAQ;EACN,MAAM,EAAE,mBAAmB,sBAAsB;EACjD,MAAM,sBAAsB,uBAAuB,SAAS,EAAE,yBAAyB,KAAK,CAAC;EAE7F,aACE,EACE,eACA;GACE,eAAe,eAAe,oBAAoB,UAAU,UAAU,SAAS,OAAO;GACtF,SAAS,GAAG,oBAAoB,UAAU,SAAS,UAAU,OAAO;GACpE,cAAc;EAChB,SACM,CACJ,EAAE,OAAO,EAAE,OAAO,CAAC,kCAAQ,MAAM,kCAAQ,KAAK,EAAE,CAAC,GACjD,EAAE,QAAQ,EAAE,OAAO,CAAC,kCAAQ,MAAM,kCAAQ,IAAI,EAAE,CAAC,CACnD,CACF;CACJ;AACF,CAAC;;;ACrBD,IAAa,mBAAmB,gBAAgB;CAC9C,MAAM;CACN,QAAQ;EACN,MAAM,EAAE,iBAAiB,QAAQ,aAAa;EAE9C,aACE,EACE,eACA;GACE,eAAe,gBAAgB;GAC/B,SAAS,GAAG,IAAI,UAAU,QAAQ,QAAQ,MAAM;EAClD,SAEE,EAAE,IAAI,UAAU,QAAQ,kBAAkB,kBAAkB,EAC1D,OAAO;GAAE,OAAO,IAAI,EAAE;GAAG,QAAQ,IAAI,EAAE;GAAG,eAAe;EAAO,EAClE,CAAC,CACL;CACJ;AACF,CAAC;;;ACpBD,IAAa,cAAc,gBAAgB;CACzC,MAAM;CACN,OAAO,EACL,MAAM;EAAE,MAAM,CAAC,QAAQ,MAAM;EAAgC,SAAS,KAAA;CAAU,EAClF;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,aACE,EACE,KACA;GACE,WAAW;GACX,OAAO;GACP,MAAM;GACN,SAAS;GACT,GAAG;GACH,OAAO,CAAC;IAAE,OAAO,IAAI,MAAM,IAAI;IAAG,QAAQ,IAAI,MAAM,IAAI;GAAE,GAAG,MAAM,KAAY;EACjF,SAEE,EAAE,QAAQ;GACR,MAAM;GACN,GAAG;EACL,CAAC,CACL;CACJ;AACF,CAAC;;;;AEtBD,IAAa,iBAAiB,gBAAgB;CAC5C,MAAM;CACN,OAAO,EACL,MAAM;EAAE,MAAM;EAAQ,UAAU;CAAK,EACvC;CACA,MAAM,OAAO;EACX,aACE,EACE,eACA;GAAE,SAAS;GAAW,WAAW;GAAK,MAAM,MAAM;GAAM,OAAO,8BAAQ;EAAQ,SACzE,EAAE,aAAa,EAAE,MAAM,GAAG,CAAC,CACnC;CACJ;AACF,CAAC;;;ACfD,IAAa,aAAa,gBAAgB;CACxC,MAAM;CACN,OAAO,EACL,MAAM;EAAE,MAAM,CAAC,QAAQ,MAAM;EAAgC,SAAS,KAAA;CAAU,EAClF;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,aACE,EACE,KACA;GACE,WAAW;GACX,OAAO;GACP,SAAS;GACT,MAAM;GACN,GAAG;GACH,OAAO,CAAC;IAAE,OAAO,IAAI,MAAM,IAAI;IAAG,QAAQ,IAAI,MAAM,IAAI;GAAE,GAAG,MAAM,KAAY;EACjF,SAEE,EAAE,QAAQ;GACR,aAAa;GACb,GAAG;EACL,CAAC,CACL;CACJ;AACF,CAAC;;;ACvBD,IAAa,gBAAgB,gBAAgB;CAC3C,MAAM;CACN,OAAO,EACL,MAAM;EAAE,MAAM;EAAQ,UAAU;CAAK,EACvC;CACA,MAAM,OAAO;EACX,aACE,EAAE,eAAe;GAAE,SAAS;GAAe,WAAW;GAAK,MAAM,MAAM;EAAK,SAC1E,EAAE,YAAY,EAAE,MAAM,GAAG,CAAC,CAC5B;CACJ;AACF,CAAC;;;;;;;AEVD,IAAa,gBAAgB,gBAAgB;CAC3C,MAAM;CACN,cAAc;CACd,MAAM,QAAQ,EAAE,SAAS;EACvB,aACE,EAAE,gBAAgB;GAAE,GAAG;GAAO,OAAO,CAAC,6BAAQ,MAAM,MAAM,KAAK;EAAE,SAC/D,EAAE,OAAO,EAAE,KAAK,KAAK,SAAS;GAC5B,EAAE,mBAAmB,EAAE,OAAO;IAAE,OAAO,IAAI,EAAE;IAAG,QAAQ,IAAI,EAAE;GAAE,EAAE,CAAC;GACnE,EAAE,MAAM;IAAE,IAAI;IAAM,GAAG;IAAU,IAAI;GAAG,SAAS,QAAQ;GACzD,EAAE,MAAM;IAAE,IAAI;IAAK,OAAO,6BAAQ;GAAS,SAAS,UAAU;EAChE,CAAC,CACH;CACJ;AACF,CAAC;;;;AEZD,IAAa,iBAAiB,gBAAgB;CAC5C,MAAM;CACN,QAAQ;EACN,aACE,EACE,eACA;GACE,WAAW;GACX,MAAM;GACN,SAAS;GACT,cAAc;GACd,OAAO,8BAAQ;EACjB,SACM,EAAE,SAAS;GAAE,QAAQ;GAAQ,OAAO;IAAE,OAAO,IAAI,EAAE;IAAG,QAAQ,IAAI,EAAE;GAAE;EAAE,CAAC,CACjF;CACJ;AACF,CAAC;;;ACbD,IAAa,iBAAiB,gBAAgB;CAC5C,MAAM;CACN,cAAc;CACd,OAAO;EACL,UAAU;GAAE,MAAM;GAAkC,SAAS,KAAA;EAAU;EACvE,YAAY;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;EAC/C,qBAAqB;GAAE,MAAM;GAAS,SAAS;EAAK;EACpD,YAAY;GAAE,MAAM;GAAS,SAAS;EAAK;EAC3C,YAAY;GAAE,MAAM;GAAS,SAAS;EAAK;EAC3C,aAAa;GAAE,MAAM;GAAS,SAAS;EAAK;EAC5C,aAAa;GAAE,MAAM;GAAQ,UAAU;EAAK;EAC5C,iBAAiB;GAAE,MAAM;GAAS,SAAS;EAAK;EAChD,aAAa;GAAE,MAAM;GAAS,SAAS;EAAK;CAC9C;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,aACE,EAAE,QAAQ,OAAO;GAAE,WAAW;GAAK,YAAY;EAAI,SACjD,EAAE,OAAO;GAAE,KAAK;GAAM,GAAG;EAAM,SAAS;GACtC,MAAM,aAAa,EAAE,eAAe,EAAE,SAAS,MAAM,SAAS,CAAC,IAAI;GACnE,MAAM,cAAc,EAAE,gBAAgB,EAAE,MAAM,MAAM,YAAY,CAAC,IAAI;GACrE,MAAM,cAAc,EAAE,cAAc,IAAI;GACxC,MAAM,aAAa,EAAE,eAAe,EAAE,MAAM,MAAM,WAAY,CAAC,IAAI;GACnE,MAAM,sBAAsB,EAAE,gBAAgB,IAAI;GAClD,MAAM,kBAAkB,EAAE,kBAAkB,IAAI;EAClD,CAAC,CACH;CACJ;AACF,CAAC;;;AC/BD,IAAa,sBAAsB,gBAAgB;CACjD,MAAM;CACN,OAAO,EACL,UAAU;EAAE,MAAM;EAAkC,UAAU;CAAK,EACrE;CACA,MAAM,OAAO;EACX,aACE,EAAE,eAAe;GAAE,eAAe,MAAM,SAAS;GAAG,SAAS;EAAS,SACpE,EAAE,mBAAmB,EAAE,OAAO;GAAE,OAAO,IAAI,EAAE;GAAG,QAAQ,IAAI,EAAE;EAAE,EAAE,CAAC,CACrE;CACJ;AACF,CAAC"}
1
+ {"version":3,"file":"index.mjs","names":[],"sources":["../src/HeaderControl.module.css","../src/HeaderControl.ts","../src/ColorSchemeControl.module.css","../src/ColorSchemeControl.ts","../src/DirectionControl.ts","../src/icons/DiscordIcon.ts","../src/DiscordControl.module.css","../src/DiscordControl.ts","../src/icons/GithubIcon.ts","../src/GithubControl.ts","../src/SearchControl/SearchControl.module.css","../src/SearchControl/SearchControl.ts","../src/SupportControl.module.css","../src/SupportControl.ts","../src/HeaderControls.ts","../src/SearchMobileControl.ts"],"sourcesContent":[".control {\n width: 34px;\n height: 34px;\n border-radius: var(--mantine-radius-md);\n border: 1px solid;\n display: flex;\n align-items: center;\n justify-content: center;\n\n @mixin light {\n border-color: var(--mantine-color-gray-3);\n color: var(--mantine-color-gray-7);\n background-color: var(--mantine-color-white);\n\n @mixin hover {\n background-color: var(--mantine-color-gray-0);\n }\n }\n\n @mixin dark {\n border-color: var(--mantine-color-dark-4);\n color: var(--mantine-color-white);\n background-color: var(--mantine-color-dark-6);\n\n @mixin hover {\n background-color: var(--mantine-color-dark-5);\n }\n }\n}\n","import { Tooltip, UnstyledButton } from '@mantine-vue/core'\nimport type { MantineElementType } from '@mantine-vue/core'\nimport { defineComponent, h, type PropType } from 'vue'\nimport classes from './HeaderControl.module.css'\n\n// Renders as a <button> by default, or as any element via the `component`\n// prop, e.g. `a` for link-style controls. UnstyledButton is already\n// polymorphic through its own `component` prop, so we forward it the same way.\nexport interface HeaderControlProps {\n tooltip: string\n component?: MantineElementType\n 'aria-label'?: string\n}\n\nexport const HeaderControl = defineComponent({\n name: 'HeaderControl',\n inheritAttrs: false,\n props: {\n tooltip: { type: String, required: true },\n component: {\n type: [String, Object, Function] as PropType<MantineElementType>,\n default: 'button',\n },\n 'aria-label': { type: String, default: undefined },\n },\n setup(props, { attrs, slots }) {\n return () =>\n h(Tooltip, { label: props.tooltip }, () =>\n h(\n UnstyledButton,\n {\n ...attrs,\n component: props.component,\n class: [classes.control, attrs.class],\n 'aria-label': props['aria-label'] || props.tooltip,\n },\n () => slots.default?.(),\n ),\n )\n },\n})\n",".icon {\n width: 22px;\n height: 22px;\n}\n\n.dark {\n @mixin dark {\n display: none;\n }\n\n @mixin light {\n display: block;\n }\n}\n\n.light {\n @mixin light {\n display: none;\n }\n\n @mixin dark {\n display: block;\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { useComputedColorScheme, useMantineColorScheme } from '@mantine-vue/core'\nimport { PhMoon, PhSun } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\nimport classes from './ColorSchemeControl.module.css'\n\nexport const ColorSchemeControl = defineComponent({\n name: 'ColorSchemeControl',\n setup() {\n const { setColorScheme } = useMantineColorScheme()\n const computedColorScheme = useComputedColorScheme('light', { getInitialValueInEffect: true })\n\n return () =>\n h(\n HeaderControl,\n {\n onClick: () => setColorScheme(computedColorScheme.value === 'light' ? 'dark' : 'light'),\n tooltip: `${computedColorScheme.value === 'dark' ? 'Light' : 'Dark'} mode`,\n 'aria-label': 'Toggle color scheme',\n },\n () => [\n h(PhSun, { class: [classes.icon, classes.light] }),\n h(PhMoon, { class: [classes.icon, classes.dark] }),\n ],\n )\n },\n})\n","import { defineComponent, h } from 'vue'\nimport { rem, useDirection } from '@mantine-vue/core'\nimport { PhTextAlignLeft, PhTextAlignRight } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\n\nexport const DirectionControl = defineComponent({\n name: 'DirectionControl',\n setup() {\n const { toggleDirection, dir } = useDirection()\n\n return () =>\n h(\n HeaderControl,\n {\n onClick: () => toggleDirection(),\n tooltip: `${dir.value === 'ltr' ? 'RTL' : 'LTR'} direction`,\n },\n () =>\n h(dir.value === 'rtl' ? PhTextAlignLeft : PhTextAlignRight, {\n style: { width: rem(22), height: rem(22), pointerEvents: 'none' },\n }),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Box, rem } from '@mantine-vue/core'\n\nexport const DiscordIcon = defineComponent({\n name: 'DiscordIcon',\n props: {\n size: { type: [String, Number] as PropType<string | number>, default: undefined },\n },\n setup(props, { attrs }) {\n return () =>\n h(\n Box,\n {\n component: 'svg',\n xmlns: 'http://www.w3.org/2000/svg',\n fill: 'none',\n viewBox: '0 0 256 199',\n ...attrs,\n style: [{ width: rem(props.size), height: rem(props.size) }, attrs.style as any],\n },\n () =>\n h('path', {\n fill: 'currentColor',\n d: 'M216.856 16.597A208.5 208.5 0 00164.042 0c-2.275 4.113-4.933 9.646-6.766 14.046-19.692-2.961-39.203-2.961-58.533 0-1.832-4.4-4.55-9.933-6.846-14.046a207.807 207.807 0 00-52.855 16.638C5.618 67.147-3.443 116.4 1.087 164.956c22.169 16.555 43.653 26.612 64.775 33.193A161.13 161.13 0 0079.735 175.3a136.374 136.374 0 01-21.846-10.632 108.542 108.542 0 005.356-4.237c42.122 19.702 87.89 19.702 129.51 0 1.751 1.46 3.543 2.88 5.355 4.237a136.011 136.011 0 01-21.886 10.653c4.006 8.02 8.638 15.671 13.873 22.848 21.142-6.581 42.646-16.637 64.815-33.213 5.316-56.288-9.081-105.09-38.056-148.36zM85.474 135.095c-12.645 0-23.015-11.805-23.015-26.18s10.149-26.2 23.015-26.2c12.867 0 23.236 11.804 23.015 26.2.02 14.375-10.148 26.18-23.015 26.18zm85.051 0c-12.645 0-23.014-11.805-23.014-26.18s10.148-26.2 23.014-26.2c12.867 0 23.236 11.804 23.015 26.2 0 14.375-10.148 26.18-23.015 26.18z',\n }),\n )\n },\n})\n",".discord {\n --discord-color: #5865f2;\n --discord-color-hover: #4f5bd5;\n\n [data-mantine-color-scheme] & {\n background-color: var(--discord-color);\n border-color: var(--discord-color);\n color: var(--mantine-color-white);\n\n @mixin hover {\n background-color: var(--discord-color-hover);\n border-color: var(--discord-color-hover);\n }\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { HeaderControl } from './HeaderControl'\nimport { DiscordIcon } from './icons/DiscordIcon'\nimport classes from './DiscordControl.module.css'\n\nexport const DiscordControl = defineComponent({\n name: 'DiscordControl',\n props: {\n link: { type: String, required: true },\n },\n setup(props) {\n return () =>\n h(\n HeaderControl,\n { tooltip: 'Discord', component: 'a', href: props.link, class: classes.discord },\n () => h(DiscordIcon, { size: 20 }),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Box, rem } from '@mantine-vue/core'\n\nexport const GithubIcon = defineComponent({\n name: 'GithubIcon',\n props: {\n size: { type: [String, Number] as PropType<string | number>, default: undefined },\n },\n setup(props, { attrs }) {\n return () =>\n h(\n Box,\n {\n component: 'svg',\n xmlns: 'http://www.w3.org/2000/svg',\n viewBox: '0 0 16 16',\n fill: 'currentColor',\n ...attrs,\n style: [{ width: rem(props.size), height: rem(props.size) }, attrs.style as any],\n },\n () =>\n h('path', {\n 'fill-rule': 'evenodd',\n d: 'M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z',\n }),\n )\n },\n})\n","import { defineComponent, h } from 'vue'\nimport { HeaderControl } from './HeaderControl'\nimport { GithubIcon } from './icons/GithubIcon'\n\nexport const GithubControl = defineComponent({\n name: 'GithubControl',\n props: {\n link: { type: String, required: true },\n },\n setup(props) {\n return () =>\n h(HeaderControl, { tooltip: 'Source code', component: 'a', href: props.link }, () =>\n h(GithubIcon, { size: 22 }),\n )\n },\n})\n",".root {\n height: 34px;\n padding-left: var(--mantine-spacing-sm);\n padding-right: 4px;\n border-radius: var(--mantine-radius-md);\n color: var(--mantine-color-placeholder);\n border: 1px solid;\n\n @mixin light {\n border-color: var(--mantine-color-gray-3);\n background-color: var(--mantine-color-white);\n }\n\n @mixin dark {\n border-color: var(--mantine-color-dark-4);\n background-color: var(--mantine-color-dark-6);\n }\n\n @mixin rtl {\n padding-left: 4px;\n padding-right: var(--mantine-spacing-sm);\n }\n}\n\n.shortcut {\n font-size: 11px;\n line-height: 1;\n padding: 4px 7px;\n border-radius: var(--mantine-radius-sm);\n border: 1px solid;\n font-weight: bold;\n\n @mixin light {\n color: var(--mantine-color-gray-7);\n border-color: var(--mantine-color-gray-2);\n background-color: var(--mantine-color-gray-0);\n }\n\n @mixin dark {\n color: var(--mantine-color-dark-0);\n border-color: var(--mantine-color-dark-7);\n background-color: var(--mantine-color-dark-7);\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { Group, rem, Text, UnstyledButton } from '@mantine-vue/core'\nimport { PhMagnifyingGlass } from '@phosphor-icons/vue'\nimport classes from './SearchControl.module.css'\n\nexport const SearchControl = defineComponent({\n name: 'SearchControl',\n inheritAttrs: false,\n setup(_props, { attrs }) {\n return () =>\n h(UnstyledButton, { ...attrs, class: [classes.root, attrs.class] }, () =>\n h(Group, { gap: 'xs' }, () => [\n h(PhMagnifyingGlass, { style: { width: rem(15), height: rem(15) } }),\n h(Text, { fz: 'sm', c: 'dimmed', pr: 80 }, () => 'Search'),\n h(Text, { fw: 700, class: classes.shortcut }, () => 'Ctrl + K'),\n ]),\n )\n },\n})\n",".support {\n @mixin light {\n color: var(--mantine-color-red-8);\n }\n\n @mixin dark {\n color: var(--mantine-color-white);\n background-color: var(--mantine-color-red-9);\n border-color: var(--mantine-color-red-9);\n\n @mixin hover {\n background-color: var(--mantine-color-red-8);\n border-color: var(--mantine-color-red-8);\n }\n }\n}\n","import { defineComponent, h } from 'vue'\nimport { rem } from '@mantine-vue/core'\nimport { PhHeart } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\nimport classes from './SupportControl.module.css'\n\nexport const SupportControl = defineComponent({\n name: 'SupportControl',\n setup() {\n return () =>\n h(\n HeaderControl,\n {\n component: 'a',\n href: '',\n tooltip: 'Sponsor',\n 'aria-label': 'Sponsor',\n class: classes.support,\n },\n () => h(PhHeart, { weight: 'fill', style: { width: rem(22), height: rem(22) } }),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Group, Tooltip } from '@mantine-vue/core'\nimport { ColorSchemeControl } from './ColorSchemeControl'\nimport { DirectionControl } from './DirectionControl'\nimport { DiscordControl } from './DiscordControl'\nimport { GithubControl } from './GithubControl'\nimport { SearchControl } from './SearchControl'\nimport { SupportControl } from './SupportControl'\n\nexport const HeaderControls = defineComponent({\n name: 'HeaderControls',\n inheritAttrs: false,\n props: {\n onSearch: { type: Function as PropType<() => void>, default: undefined },\n githubLink: { type: String, default: undefined },\n withDirectionToggle: { type: Boolean, default: true },\n withSearch: { type: Boolean, default: true },\n withGithub: { type: Boolean, default: true },\n withDiscord: { type: Boolean, default: true },\n discordLink: { type: String, required: true },\n withColorScheme: { type: Boolean, default: true },\n withSupport: { type: Boolean, default: true },\n },\n setup(props, { attrs }) {\n return () =>\n h(Tooltip.Group, { openDelay: 600, closeDelay: 100 }, () =>\n h(Group, { gap: 'xs', ...attrs }, () => [\n props.withSearch ? h(SearchControl, { onClick: props.onSearch }) : null,\n props.withDiscord ? h(DiscordControl, { link: props.discordLink }) : null,\n props.withSupport ? h(SupportControl) : null,\n props.withGithub ? h(GithubControl, { link: props.githubLink! }) : null,\n props.withDirectionToggle ? h(DirectionControl) : null,\n props.withColorScheme ? h(ColorSchemeControl) : null,\n ]),\n )\n },\n})\n","import { defineComponent, h, type PropType } from 'vue'\nimport { rem } from '@mantine-vue/core'\nimport { PhMagnifyingGlass } from '@phosphor-icons/vue'\nimport { HeaderControl } from './HeaderControl'\n\nexport const SearchMobileControl = defineComponent({\n name: 'SearchMobileControl',\n props: {\n onSearch: { type: Function as PropType<() => void>, required: true },\n },\n setup(props) {\n return () =>\n h(HeaderControl, { onClick: () => props.onSearch(), tooltip: 'Search' }, () =>\n h(PhMagnifyingGlass, { style: { width: rem(22), height: rem(22) } }),\n )\n },\n})\n"],"mappings":"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"}
package/lib/HeaderControl.d.ts CHANGED
@@ -1,6 +1,8 @@
1
+ import type { MantineElementType } from '@mantine-vue/core';
2
+ import { type PropType } from 'vue';
1
3
  export interface HeaderControlProps {
2
4
  tooltip: string;
3
- component?: string;
5
+ component?: MantineElementType;
4
6
  'aria-label'?: string;
5
7
  }
6
8
  export declare const HeaderControl: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -9,7 +11,7 @@ export declare const HeaderControl: import("vue").DefineComponent<import("vue").
9
11
  required: true;
10
12
  };
11
13
  component: {
12
- type: StringConstructor;
14
+ type: PropType<MantineElementType>;
13
15
  default: string;
14
16
  };
15
17
  'aria-label': {
@@ -24,7 +26,7 @@ export declare const HeaderControl: import("vue").DefineComponent<import("vue").
24
26
  required: true;
25
27
  };
26
28
  component: {
27
- type: StringConstructor;
29
+ type: PropType<MantineElementType>;
28
30
  default: string;
29
31
  };
30
32
  'aria-label': {
@@ -32,6 +34,6 @@ export declare const HeaderControl: import("vue").DefineComponent<import("vue").
32
34
  default: undefined;
33
35
  };
34
36
  }>> & Readonly<{}>, {
35
- component: string;
36
37
  'aria-label': string;
38
+ component: MantineElementType;
37
39
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mantine-vue/mantine-header",
3
- "version": "3.0.0",
3
+ "version": "3.2.0",
4
4
  "description": "Components used in headers of *.mantine.dev websites (Vue port of @mantinex/mantine-header)",
5
5
  "license": "MIT",
6
6
  "files": [
@@ -35,7 +35,7 @@
35
35
  "vue": "^3.5.0"
36
36
  },
37
37
  "peerDependencies": {
38
- "@mantine-vue/core": "3.0.0",
38
+ "@mantine-vue/core": "3.2.0",
39
39
  "@phosphor-icons/vue": "^2.2",
40
40
  "vue": "^3.5.0"
41
41
  }