@cairntale/chimeling-react 1.0.0-alpha.3 → 1.0.0-alpha.4
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.
package/CHANGELOG.md
CHANGED
|
@@ -10,7 +10,7 @@ function PlaygroundPanel() {
|
|
|
10
10
|
return /* @__PURE__ */ jsx(ClassNames, { children: ({ css, cx }) => /* @__PURE__ */ jsxs("div", {
|
|
11
11
|
className: cx("dialkit-root", css({
|
|
12
12
|
width: 320,
|
|
13
|
-
display: "
|
|
13
|
+
display: "absolute",
|
|
14
14
|
flexDirection: "column",
|
|
15
15
|
gap: "var(--dial-row-gap)",
|
|
16
16
|
position: "fixed",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"panel.js","names":["dialkitStyles"],"sources":["../../../src/components/playground/panel.tsx"],"sourcesContent":["'use client'\n\nimport dialkitStyles from 'dialkit/styles.css?raw'\nimport { Global, ClassNames } from '@emotion/react'\nimport { TextControl, SelectControl, Folder, Toggle, Slider, ButtonGroup } from 'dialkit'\nimport useTweaks from './store'\n\nexport function PlaygroundPanel() {\n const tweaks = useTweaks()\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <div\n className={cx(\n 'dialkit-root',\n css({\n width: 320,\n display: '
|
|
1
|
+
{"version":3,"file":"panel.js","names":["dialkitStyles"],"sources":["../../../src/components/playground/panel.tsx"],"sourcesContent":["'use client'\n\nimport dialkitStyles from 'dialkit/styles.css?raw'\nimport { Global, ClassNames } from '@emotion/react'\nimport { TextControl, SelectControl, Folder, Toggle, Slider, ButtonGroup } from 'dialkit'\nimport useTweaks from './store'\n\nexport function PlaygroundPanel() {\n const tweaks = useTweaks()\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <div\n className={cx(\n 'dialkit-root',\n css({\n width: 320,\n display: 'absolute',\n flexDirection: 'column',\n gap: 'var(--dial-row-gap)',\n position: 'fixed',\n top: 'calc(var(--dial-row-gap) * 1.5)',\n right: 'calc(var(--dial-row-gap) * 1.5)',\n boxShadow: 'var(--dial-shadow)',\n background: 'var(--dial-glass-bg)',\n border: '1px solid var(--dial-border)',\n backdropFilter: 'blur(var(--dial-backdrop-blur))',\n padding: 'calc(var(--dial-row-gap) * 1.5)',\n borderRadius: 14,\n }),\n )}\n data-theme=\"system\"\n >\n <Global styles={dialkitStyles} />\n <SelectControl\n label=\"Mode\"\n value={tweaks.mode}\n options={[\n {\n label: 'Live',\n value: 'live',\n },\n { label: 'Mock', value: 'mock' },\n ]}\n onChange={v => tweaks.set('mode', v)}\n />\n {tweaks.mode === 'live' && (\n <>\n <TextControl\n label=\"Base URL\"\n value={tweaks.baseUrl}\n onChange={v => tweaks.set('baseUrl', v)}\n />\n <TextControl\n label=\"User ID\"\n value={tweaks.userId}\n onChange={v => tweaks.set('userId', v)}\n />\n </>\n )}\n {tweaks.mode === 'mock' && (\n <Folder title=\"Presence\">\n <SelectControl\n label=\"Status\"\n value={tweaks.presence.status}\n options={[\n {\n label: 'Online',\n value: 'online',\n },\n { label: 'Idle', value: 'idle' },\n { label: 'Offline', value: 'offline' },\n ]}\n onChange={v => tweaks.set('presence.status', v)}\n />\n {tweaks.presence.status !== 'offline' && tweaks.presence.activity !== null && (\n <>\n <TextControl\n label=\"Gerund\"\n value={tweaks.presence.activity.gerund}\n onChange={v => tweaks.set('presence.activity.gerund', v)}\n />\n <TextControl\n label=\"App Name\"\n value={tweaks.presence.activity.appName}\n onChange={v => tweaks.set('presence.activity.appName', v)}\n />\n <TextControl\n label=\"Icon Hash\"\n value={tweaks.presence.activity.iconHash!}\n onChange={v => tweaks.set('presence.activity.iconHash', v)}\n />\n </>\n )}\n </Folder>\n )}\n <Folder title=\"Behavior\">\n <SelectControl\n label=\"Side\"\n value={tweaks.behavior.side}\n options={[\n { label: 'Top', value: 'top' },\n { label: 'Bottom', value: 'bottom' },\n { label: 'Left', value: 'left' },\n { label: 'Right', value: 'right' },\n { label: 'Inline Start', value: 'inline-start' },\n { label: 'Inline End', value: 'inline-end' },\n ]}\n onChange={v => tweaks.set('behavior.side', v)}\n />\n <SelectControl\n label=\"Align\"\n value={tweaks.behavior.align}\n options={[\n { label: 'Start', value: 'start' },\n { label: 'Center', value: 'center' },\n { label: 'End', value: 'end' },\n ]}\n onChange={v => tweaks.set('behavior.align', v)}\n />\n <Toggle\n label=\"Open on Hover\"\n checked={tweaks.behavior.openOnHover}\n onChange={v => tweaks.set('behavior.openOnHover', v)}\n />\n {tweaks.behavior.openOnHover && (\n <>\n <Slider\n label=\"Hover Open Delay\"\n min={0}\n max={1500}\n step={100}\n value={tweaks.behavior.hoverOpenDelay}\n onChange={v => tweaks.set('behavior.hoverOpenDelay', v)}\n />\n <Slider\n label=\"Hover Close Delay\"\n min={0}\n max={1500}\n step={100}\n value={tweaks.behavior.hoverCloseDelay}\n onChange={v => tweaks.set('behavior.hoverCloseDelay', v)}\n />\n </>\n )}\n </Folder>\n <ButtonGroup buttons={[{ label: 'Reset', onClick: tweaks.reset }]} />\n </div>\n )}\n </ClassNames>\n )\n}\n"],"mappings":";;;;;;;AAOA,SAAgB,kBAAkB;CAChC,MAAM,SAAS,UAAU;CAEzB,OACE,oBAAC,YAAD,EAAA,WACI,EAAE,KAAK,SACP,qBAAC,OAAD;EACE,WAAW,GACT,gBACA,IAAI;GACF,OAAO;GACP,SAAS;GACT,eAAe;GACf,KAAK;GACL,UAAU;GACV,KAAK;GACL,OAAO;GACP,WAAW;GACX,YAAY;GACZ,QAAQ;GACR,gBAAgB;GAChB,SAAS;GACT,cAAc;EAChB,CAAC,CACH;EACA,cAAW;EAnBb,UAAA;GAqBE,oBAAC,QAAD,EAAQ,QAAQA,eAAgB,CAAA;GAChC,oBAAC,eAAD;IACE,OAAM;IACN,OAAO,OAAO;IACd,SAAS,CACP;KACE,OAAO;KACP,OAAO;IACT,GACA;KAAE,OAAO;KAAQ,OAAO;IAAO,CACjC;IACA,WAAU,MAAK,OAAO,IAAI,QAAQ,CAAC;GACpC,CAAA;GACA,OAAO,SAAS,UACf,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,aAAD;IACE,OAAM;IACN,OAAO,OAAO;IACd,WAAU,MAAK,OAAO,IAAI,WAAW,CAAC;GACvC,CAAA,GACD,oBAAC,aAAD;IACE,OAAM;IACN,OAAO,OAAO;IACd,WAAU,MAAK,OAAO,IAAI,UAAU,CAAC;GACtC,CAAA,CACD,EAAA,CAAA;GAEH,OAAO,SAAS,UACf,qBAAC,QAAD;IAAQ,OAAM;IAAd,UAAA,CACE,oBAAC,eAAD;KACE,OAAM;KACN,OAAO,OAAO,SAAS;KACvB,SAAS;MACP;OACE,OAAO;OACP,OAAO;MACT;MACA;OAAE,OAAO;OAAQ,OAAO;MAAO;MAC/B;OAAE,OAAO;OAAW,OAAO;MAAU;KACvC;KACA,WAAU,MAAK,OAAO,IAAI,mBAAmB,CAAC;IAC/C,CAAA,GACA,OAAO,SAAS,WAAW,aAAa,OAAO,SAAS,aAAa,QACpE,qBAAA,UAAA,EAAA,UAAA;KACE,oBAAC,aAAD;MACE,OAAM;MACN,OAAO,OAAO,SAAS,SAAS;MAChC,WAAU,MAAK,OAAO,IAAI,4BAA4B,CAAC;KACxD,CAAA;KACD,oBAAC,aAAD;MACE,OAAM;MACN,OAAO,OAAO,SAAS,SAAS;MAChC,WAAU,MAAK,OAAO,IAAI,6BAA6B,CAAC;KACzD,CAAA;KACD,oBAAC,aAAD;MACE,OAAM;MACN,OAAO,OAAO,SAAS,SAAS;MAChC,WAAU,MAAK,OAAO,IAAI,8BAA8B,CAAC;KAC1D,CAAA;IACD,EAAA,CAAA,CAEE;;GAEV,qBAAC,QAAD;IAAQ,OAAM;IAAd,UAAA;KACE,oBAAC,eAAD;MACE,OAAM;MACN,OAAO,OAAO,SAAS;MACvB,SAAS;OACP;QAAE,OAAO;QAAO,OAAO;OAAM;OAC7B;QAAE,OAAO;QAAU,OAAO;OAAS;OACnC;QAAE,OAAO;QAAQ,OAAO;OAAO;OAC/B;QAAE,OAAO;QAAS,OAAO;OAAQ;OACjC;QAAE,OAAO;QAAgB,OAAO;OAAe;OAC/C;QAAE,OAAO;QAAc,OAAO;OAAa;MAC7C;MACA,WAAU,MAAK,OAAO,IAAI,iBAAiB,CAAC;KAC7C,CAAA;KACD,oBAAC,eAAD;MACE,OAAM;MACN,OAAO,OAAO,SAAS;MACvB,SAAS;OACP;QAAE,OAAO;QAAS,OAAO;OAAQ;OACjC;QAAE,OAAO;QAAU,OAAO;OAAS;OACnC;QAAE,OAAO;QAAO,OAAO;OAAM;MAC/B;MACA,WAAU,MAAK,OAAO,IAAI,kBAAkB,CAAC;KAC9C,CAAA;KACD,oBAAC,QAAD;MACE,OAAM;MACN,SAAS,OAAO,SAAS;MACzB,WAAU,MAAK,OAAO,IAAI,wBAAwB,CAAC;KACpD,CAAA;KACA,OAAO,SAAS,eACf,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,QAAD;MACE,OAAM;MACN,KAAK;MACL,KAAK;MACL,MAAM;MACN,OAAO,OAAO,SAAS;MACvB,WAAU,MAAK,OAAO,IAAI,2BAA2B,CAAC;KACvD,CAAA,GACD,oBAAC,QAAD;MACE,OAAM;MACN,KAAK;MACL,KAAK;MACL,MAAM;MACN,OAAO,OAAO,SAAS;MACvB,WAAU,MAAK,OAAO,IAAI,4BAA4B,CAAC;KACxD,CAAA,CACD,EAAA,CAAA;IAEE;;GACR,oBAAC,aAAD,EAAa,SAAS,CAAC;IAAE,OAAO;IAAS,SAAS,OAAO;GAAM,CAAC,EAAI,CAAA;EACjE;CAEG,CAAA,EAAA,CAAA;AAEhB"}
|
|
@@ -12,7 +12,8 @@ function ChimelingPlayground({ className }) {
|
|
|
12
12
|
className: cx(css({
|
|
13
13
|
display: "flex",
|
|
14
14
|
alignItems: "center",
|
|
15
|
-
justifyContent: "center"
|
|
15
|
+
justifyContent: "center",
|
|
16
|
+
position: "relative"
|
|
16
17
|
}), className),
|
|
17
18
|
children: [/* @__PURE__ */ jsx(PlaygroundPanel, {}), /* @__PURE__ */ jsx(ChimelingProvider, {
|
|
18
19
|
baseUrl: tweaks.baseUrl,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"playground.js","names":[],"sources":["../../../src/components/playground/playground.tsx"],"sourcesContent":["'use client'\n\nimport { ClassNames } from '@emotion/react'\nimport { Chimeling } from '../chimeling'\nimport { ChimelingProvider } from '../provider'\nimport { PlaygroundPanel } from './panel'\nimport useTweaks from './store'\n\nexport type ChimelingPlaygroundProps = {\n className?: string\n}\n\nexport function ChimelingPlayground({ className }: ChimelingPlaygroundProps) {\n const tweaks = useTweaks()\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <div\n className={cx(\n css({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n }),\n className,\n )}\n >\n <PlaygroundPanel />\n <ChimelingProvider baseUrl={tweaks.baseUrl}>\n <Chimeling.Root\n userId={tweaks.userId}\n presence={tweaks.mode === 'mock' ? tweaks.presence : undefined}\n side={tweaks.behavior.side}\n align={tweaks.behavior.align}\n openOnHover={tweaks.behavior.openOnHover}\n hoverOpenDelay={tweaks.behavior.hoverOpenDelay}\n hoverCloseDelay={tweaks.behavior.hoverCloseDelay}\n >\n <Chimeling.Trigger />\n <Chimeling.Popover />\n </Chimeling.Root>\n </ChimelingProvider>\n </div>\n )}\n </ClassNames>\n )\n}\n"],"mappings":";;;;;;;;AAYA,SAAgB,oBAAoB,EAAE,aAAuC;CAC3E,MAAM,SAAS,UAAU;CAEzB,OACE,oBAAC,YAAD,EAAA,WACI,EAAE,KAAK,SACP,qBAAC,OAAD;EACE,WAAW,GACT,IAAI;GACF,SAAS;GACT,YAAY;GACZ,gBAAgB;
|
|
1
|
+
{"version":3,"file":"playground.js","names":[],"sources":["../../../src/components/playground/playground.tsx"],"sourcesContent":["'use client'\n\nimport { ClassNames } from '@emotion/react'\nimport { Chimeling } from '../chimeling'\nimport { ChimelingProvider } from '../provider'\nimport { PlaygroundPanel } from './panel'\nimport useTweaks from './store'\n\nexport type ChimelingPlaygroundProps = {\n className?: string\n}\n\nexport function ChimelingPlayground({ className }: ChimelingPlaygroundProps) {\n const tweaks = useTweaks()\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <div\n className={cx(\n css({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n }),\n className,\n )}\n >\n <PlaygroundPanel />\n <ChimelingProvider baseUrl={tweaks.baseUrl}>\n <Chimeling.Root\n userId={tweaks.userId}\n presence={tweaks.mode === 'mock' ? tweaks.presence : undefined}\n side={tweaks.behavior.side}\n align={tweaks.behavior.align}\n openOnHover={tweaks.behavior.openOnHover}\n hoverOpenDelay={tweaks.behavior.hoverOpenDelay}\n hoverCloseDelay={tweaks.behavior.hoverCloseDelay}\n >\n <Chimeling.Trigger />\n <Chimeling.Popover />\n </Chimeling.Root>\n </ChimelingProvider>\n </div>\n )}\n </ClassNames>\n )\n}\n"],"mappings":";;;;;;;;AAYA,SAAgB,oBAAoB,EAAE,aAAuC;CAC3E,MAAM,SAAS,UAAU;CAEzB,OACE,oBAAC,YAAD,EAAA,WACI,EAAE,KAAK,SACP,qBAAC,OAAD;EACE,WAAW,GACT,IAAI;GACF,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,UAAU;EACZ,CAAC,GACD,SACF;EATF,UAAA,CAWE,oBAAC,iBAAD,CAAkB,CAAA,GAClB,oBAAC,mBAAD;GAAmB,SAAS,OAAO;GACjC,UAAA,qBAAC,UAAU,MAAX;IACE,QAAQ,OAAO;IACf,UAAU,OAAO,SAAS,SAAS,OAAO,WAAW,KAAA;IACrD,MAAM,OAAO,SAAS;IACtB,OAAO,OAAO,SAAS;IACvB,aAAa,OAAO,SAAS;IAC7B,gBAAgB,OAAO,SAAS;IAChC,iBAAiB,OAAO,SAAS;IAPnC,UAAA,CASE,oBAAC,UAAU,SAAX,CAAoB,CAAA,GACpB,oBAAC,UAAU,SAAX,CAAoB,CAAA,CACN;;EACC,CAAA,CAChB;CAEG,CAAA,EAAA,CAAA;AAEhB"}
|