lightweight-charts-react-components 2.6.1 → 2.7.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.
- package/README.md +40 -3
- package/dist/index.d.ts +11 -3
- package/dist/lightweight-charts-react-components.mjs +3 -3
- package/dist/lightweight-charts-react-components.mjs.map +1 -1
- package/dist/lightweight-charts-react-components.standalone.js +2 -2
- package/dist/lightweight-charts-react-components.standalone.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -46,10 +46,10 @@
|
|
|
46
46
|
</picture>
|
|
47
47
|
</a>
|
|
48
48
|
|
|
49
|
-
<a href="https://bundlephobia.com/package/lightweight-charts-react-components@2.
|
|
49
|
+
<a href="https://bundlephobia.com/package/lightweight-charts-react-components@2.7.0">
|
|
50
50
|
<picture>
|
|
51
|
-
<source media="(prefers-color-scheme: dark)" srcset="https://img.shields.io/bundlephobia/minzip/lightweight-charts-react-components/2.
|
|
52
|
-
<img src="https://img.shields.io/bundlephobia/minzip/lightweight-charts-react-components/2.
|
|
51
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://img.shields.io/bundlephobia/minzip/lightweight-charts-react-components/2.7.0?cacheSeconds=31536000&colorA=1e2029&colorB=1e2029&style=flat">
|
|
52
|
+
<img src="https://img.shields.io/bundlephobia/minzip/lightweight-charts-react-components/2.7.0?cacheSeconds=31536000&colorA=ffcc00&colorB=ffcc00&style=flat" alt="Minified size">
|
|
53
53
|
</picture>
|
|
54
54
|
</a>
|
|
55
55
|
|
|
@@ -270,6 +270,43 @@ const App = () => {
|
|
|
270
270
|
export { App };
|
|
271
271
|
```
|
|
272
272
|
|
|
273
|
+
`PriceScale` customizes a price scale of the pane it is rendered in. To give a series its own scale in the same pane (for example, volume under candlesticks), set a custom `priceScaleId` on the series and render `PriceScale` with the same `id` inside that series. A custom price scale exists only after a series that uses it is added, so nest `PriceScale` in that series or place it after the series:
|
|
274
|
+
|
|
275
|
+
```tsx
|
|
276
|
+
import React from "react";
|
|
277
|
+
import {
|
|
278
|
+
Chart,
|
|
279
|
+
CandlestickSeries,
|
|
280
|
+
HistogramSeries,
|
|
281
|
+
Pane,
|
|
282
|
+
PriceScale,
|
|
283
|
+
} from "lightweight-charts-react-components";
|
|
284
|
+
|
|
285
|
+
const candles = [
|
|
286
|
+
{ time: "2023-01-01", open: 100, high: 105, low: 98, close: 103 },
|
|
287
|
+
{ time: "2023-01-02", open: 103, high: 107, low: 101, close: 102 },
|
|
288
|
+
];
|
|
289
|
+
const volume = [
|
|
290
|
+
{ time: "2023-01-01", value: 1000 },
|
|
291
|
+
{ time: "2023-01-02", value: 1100 },
|
|
292
|
+
];
|
|
293
|
+
|
|
294
|
+
const App = () => {
|
|
295
|
+
return (
|
|
296
|
+
<Chart options={{ width: 600, height: 400 }}>
|
|
297
|
+
<Pane>
|
|
298
|
+
<CandlestickSeries data={candles} />
|
|
299
|
+
<HistogramSeries data={volume} options={{ priceScaleId: "volume" }}>
|
|
300
|
+
<PriceScale id="volume" options={{ scaleMargins: { top: 0.8, bottom: 0 } }} />
|
|
301
|
+
</HistogramSeries>
|
|
302
|
+
</Pane>
|
|
303
|
+
</Chart>
|
|
304
|
+
);
|
|
305
|
+
};
|
|
306
|
+
|
|
307
|
+
export { App };
|
|
308
|
+
```
|
|
309
|
+
|
|
273
310
|
Pane-wide overlays that belong to a whole pane rather than a single series can be mounted declaratively with `PanePrimitive` inside `Pane`. This works well for session bands, pane-scoped annotations, and background highlights that need access to both the chart and the target pane. See the `PanePrimitives` sample in the examples app for a full working example, and the upstream [pane primitives documentation](https://tradingview.github.io/lightweight-charts/docs/plugins/pane-primitives) for the underlying Lightweight Charts plugin contract.
|
|
274
311
|
|
|
275
312
|
### Chart Container Sizing
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/**!
|
|
3
|
-
* lightweight-charts-react-components v2.
|
|
3
|
+
* lightweight-charts-react-components v2.7.0
|
|
4
4
|
*
|
|
5
5
|
* This source code is licensed under the MIT license found in the
|
|
6
6
|
* LICENSE.md file in the root directory of this source tree.
|
|
@@ -604,7 +604,7 @@ export declare type PriceLineProps = {
|
|
|
604
604
|
};
|
|
605
605
|
|
|
606
606
|
/**
|
|
607
|
-
* PriceScale component that can be used to
|
|
607
|
+
* PriceScale component that can be used to customize a price scale of the pane it is rendered in.
|
|
608
608
|
*
|
|
609
609
|
* @param props - The properties for the price scale.
|
|
610
610
|
* @param ref - The ref to access the price scale API.
|
|
@@ -614,6 +614,11 @@ export declare type PriceLineProps = {
|
|
|
614
614
|
* @example
|
|
615
615
|
* ```tsx
|
|
616
616
|
* <PriceScale id="right" options={{}} />
|
|
617
|
+
*
|
|
618
|
+
* // Custom overlay price scale used by the parent series
|
|
619
|
+
* <HistogramSeries data={volume} options={{ priceScaleId: "volume" }}>
|
|
620
|
+
* <PriceScale id="volume" options={{ scaleMargins: { top: 0.8, bottom: 0 } }} />
|
|
621
|
+
* </HistogramSeries>
|
|
617
622
|
* ```
|
|
618
623
|
*/
|
|
619
624
|
export declare const PriceScale: ForwardRefExoticComponent<PriceScaleProps & RefAttributes<PriceScaleApiRef>>;
|
|
@@ -655,7 +660,10 @@ export declare type PriceScaleProps = {
|
|
|
655
660
|
*/
|
|
656
661
|
options?: PriceScaleOptions;
|
|
657
662
|
/**
|
|
658
|
-
* The ID of the price scale.
|
|
663
|
+
* The ID of the price scale: `"left"`, `"right"`, or a custom `priceScaleId` of a series in the same pane.
|
|
664
|
+
*
|
|
665
|
+
* A custom (overlay) price scale exists only after a series that uses it is added,
|
|
666
|
+
* so render `PriceScale` inside that series or after it.
|
|
659
667
|
*/
|
|
660
668
|
id: string;
|
|
661
669
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/**!
|
|
3
|
-
* lightweight-charts-react-components v2.
|
|
3
|
+
* lightweight-charts-react-components v2.7.0
|
|
4
4
|
*
|
|
5
5
|
* This source code is licensed under the MIT license found in the
|
|
6
6
|
* LICENSE.md file in the root directory of this source tree.
|
|
@@ -8,9 +8,9 @@
|
|
|
8
8
|
* @license MIT
|
|
9
9
|
*/
|
|
10
10
|
|
|
11
|
-
import*as e from"lightweight-charts";import*as t from"react";let r=(e,t)=>{if(e){if("function"==typeof e)return void e(t);e.current=t}},i=(0,t.createContext)(null);i.displayName="ChartContext";let a={addDefaultPane:!1},n=({container:r,onClick:i,onCrosshairMove:n,options:l={},onDblClick:u,createChartApi:s=e.createChart})=>{let[c,f]=(0,t.useState)(!1),p=(0,t.useRef)({_chart:null,_isDisposing:!1,api(){return this._chart},init(){if(null===this._chart){let e=s(r,{...a,...l});this._chart=e}return c||f(!0),this._chart},clear(){this._isDisposing=!1,null!==this._chart&&(f(!1),this._chart.remove(),this._chart=null)}});return(0,t.useLayoutEffect)(()=>(p.current.init(),()=>{p.current._isDisposing=!0}),[]),(0,t.useEffect)(()=>()=>{p.current.clear()},[]),(0,t.useLayoutEffect)(()=>{if(r){if(i){var e;null==(e=p.current.api())||e.subscribeClick(i)}return()=>{if(i){var e;null==(e=p.current.api())||e.unsubscribeClick(i)}}}},[i]),(0,t.useLayoutEffect)(()=>{if(r){if(n){var e;null==(e=p.current.api())||e.subscribeCrosshairMove(n)}return()=>{if(n){var e;null==(e=p.current.api())||e.unsubscribeCrosshairMove(n)}}}},[n]),(0,t.useLayoutEffect)(()=>{if(r){if(u){var e;null==(e=p.current.api())||e.subscribeDblClick(u)}return()=>{if(u){var e;null==(e=p.current.api())||e.unsubscribeDblClick(u)}}}},[u]),(0,t.useLayoutEffect)(()=>{var e;r&&(null==(e=p.current.api())||e.applyOptions({...a,...l}))},[l]),{chartApiRef:p,isReady:c}},l=(0,t.forwardRef)(({children:e,container:r,onClick:a,onCrosshairMove:l,options:u,onDblClick:s,chartKind:c="time",createChartApi:f},p)=>{let{chartApiRef:{current:o},isReady:d}=n({container:r,onClick:a,onCrosshairMove:l,options:u,onDblClick:s,createChartApi:f});return(0,t.useImperativeHandle)(p,()=>o,[o]),t.default.createElement(i.Provider,{value:{chartApiRef:o,isReady:d,chartKind:c}},e)});l.displayName="ChartComponent";let u=(0,t.forwardRef)(({children:i,containerProps:a,containerRef:n,...u},s)=>{let[c,f]=(0,t.useState)(),p=(0,t.useCallback)(e=>{f(e??void 0),r(n,e)},[n]);return t.default.createElement("div",{ref:p,"aria-hidden":(null==a?void 0:a["aria-hidden"])??!0,...a},!!c&&t.default.createElement(l,{ref:s,container:c,createChartApi:e.createChart,chartKind:"time",...u},i))});u.displayName="ChartWrapper";let s=(0,t.forwardRef)(({children:i,containerProps:a,containerRef:n,...u},s)=>{let[c,f]=(0,t.useState)(),p=(0,t.useCallback)(e=>{f(e??void 0),r(n,e)},[n]);return t.default.createElement("div",{ref:p,"aria-hidden":(null==a?void 0:a["aria-hidden"])??!0,...a},!!c&&t.default.createElement(l,{ref:s,container:c,createChartApi:e.createOptionsChart,chartKind:"options",...u},i))});s.displayName="OptionsChart";let c=(0,t.forwardRef)(({children:i,containerProps:a,containerRef:n,...u},s)=>{let[c,f]=(0,t.useState)(),p=(0,t.useCallback)(e=>{f(e??void 0),r(n,e)},[n]);return t.default.createElement("div",{ref:p,"aria-hidden":(null==a?void 0:a["aria-hidden"])??!0,...a},!!c&&t.default.createElement(l,{ref:s,container:c,createChartApi:e.createYieldCurveChart,chartKind:"yield-curve",...u},i))});c.displayName="YieldCurveChart";let f=(0,t.forwardRef)(({children:i,containerProps:a,containerRef:n,horzScaleBehavior:u,...s},c)=>{let[f,p]=(0,t.useState)(),o=(0,t.useCallback)(e=>{p(e??void 0),r(n,e)},[n]),d=(0,t.useCallback)((t,r)=>(0,e.createChartEx)(t,u,r),[u]);return t.default.createElement("div",{ref:o,"aria-hidden":(null==a?void 0:a["aria-hidden"])??!0,...a},!!f&&t.default.createElement(l,{ref:c,container:f,createChartApi:d,chartKind:"custom",...s},i))});f.displayName="CustomChart";let p=(0,t.createContext)(null);p.displayName="TimeScaleContext";let o="2.
|
|
11
|
+
import*as e from"lightweight-charts";import*as t from"react";let r=(e,t)=>{if(e){if("function"==typeof e)return void e(t);e.current=t}},i=(0,t.createContext)(null);i.displayName="ChartContext";let a={addDefaultPane:!1},n=({container:r,onClick:i,onCrosshairMove:n,options:l={},onDblClick:u,createChartApi:s=e.createChart})=>{let[c,f]=(0,t.useState)(!1),p=(0,t.useRef)({_chart:null,_isDisposing:!1,api(){return this._chart},init(){if(null===this._chart){let e=s(r,{...a,...l});this._chart=e}return c||f(!0),this._chart},clear(){this._isDisposing=!1,null!==this._chart&&(f(!1),this._chart.remove(),this._chart=null)}});return(0,t.useLayoutEffect)(()=>(p.current.init(),()=>{p.current._isDisposing=!0}),[]),(0,t.useEffect)(()=>()=>{p.current.clear()},[]),(0,t.useLayoutEffect)(()=>{if(r){if(i){var e;null==(e=p.current.api())||e.subscribeClick(i)}return()=>{if(i){var e;null==(e=p.current.api())||e.unsubscribeClick(i)}}}},[i]),(0,t.useLayoutEffect)(()=>{if(r){if(n){var e;null==(e=p.current.api())||e.subscribeCrosshairMove(n)}return()=>{if(n){var e;null==(e=p.current.api())||e.unsubscribeCrosshairMove(n)}}}},[n]),(0,t.useLayoutEffect)(()=>{if(r){if(u){var e;null==(e=p.current.api())||e.subscribeDblClick(u)}return()=>{if(u){var e;null==(e=p.current.api())||e.unsubscribeDblClick(u)}}}},[u]),(0,t.useLayoutEffect)(()=>{var e;r&&(null==(e=p.current.api())||e.applyOptions({...a,...l}))},[l]),{chartApiRef:p,isReady:c}},l=(0,t.forwardRef)(({children:e,container:r,onClick:a,onCrosshairMove:l,options:u,onDblClick:s,chartKind:c="time",createChartApi:f},p)=>{let{chartApiRef:{current:o},isReady:d}=n({container:r,onClick:a,onCrosshairMove:l,options:u,onDblClick:s,createChartApi:f});return(0,t.useImperativeHandle)(p,()=>o,[o]),t.default.createElement(i.Provider,{value:{chartApiRef:o,isReady:d,chartKind:c}},e)});l.displayName="ChartComponent";let u=(0,t.forwardRef)(({children:i,containerProps:a,containerRef:n,...u},s)=>{let[c,f]=(0,t.useState)(),p=(0,t.useCallback)(e=>{f(e??void 0),r(n,e)},[n]);return t.default.createElement("div",{ref:p,"aria-hidden":(null==a?void 0:a["aria-hidden"])??!0,...a},!!c&&t.default.createElement(l,{ref:s,container:c,createChartApi:e.createChart,chartKind:"time",...u},i))});u.displayName="ChartWrapper";let s=(0,t.forwardRef)(({children:i,containerProps:a,containerRef:n,...u},s)=>{let[c,f]=(0,t.useState)(),p=(0,t.useCallback)(e=>{f(e??void 0),r(n,e)},[n]);return t.default.createElement("div",{ref:p,"aria-hidden":(null==a?void 0:a["aria-hidden"])??!0,...a},!!c&&t.default.createElement(l,{ref:s,container:c,createChartApi:e.createOptionsChart,chartKind:"options",...u},i))});s.displayName="OptionsChart";let c=(0,t.forwardRef)(({children:i,containerProps:a,containerRef:n,...u},s)=>{let[c,f]=(0,t.useState)(),p=(0,t.useCallback)(e=>{f(e??void 0),r(n,e)},[n]);return t.default.createElement("div",{ref:p,"aria-hidden":(null==a?void 0:a["aria-hidden"])??!0,...a},!!c&&t.default.createElement(l,{ref:s,container:c,createChartApi:e.createYieldCurveChart,chartKind:"yield-curve",...u},i))});c.displayName="YieldCurveChart";let f=(0,t.forwardRef)(({children:i,containerProps:a,containerRef:n,horzScaleBehavior:u,...s},c)=>{let[f,p]=(0,t.useState)(),o=(0,t.useCallback)(e=>{p(e??void 0),r(n,e)},[n]),d=(0,t.useCallback)((t,r)=>(0,e.createChartEx)(t,u,r),[u]);return t.default.createElement("div",{ref:o,"aria-hidden":(null==a?void 0:a["aria-hidden"])??!0,...a},!!f&&t.default.createElement(l,{ref:c,container:f,createChartApi:d,chartKind:"custom",...s},i))});f.displayName="CustomChart";let p=(0,t.createContext)(null);p.displayName="TimeScaleContext";let o="2.7.0";function d(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}class h extends Error{constructor(e,{isOperational:t=!0,cause:r,docsPath:i}={}){super(e),d(this,"isOperational",void 0),d(this,"cause",void 0),this.name=this.constructor.name??"InternalError",this.isOperational=t,this.cause=r,this.message=`${e??"An error occurred"}`,i&&(this.message=`${this.message}
|
|
12
12
|
|
|
13
13
|
Docs: see ${"https://ukorvl.github.io/lightweight-charts-react-components/docs/"+i}`),o&&(this.message=`${this.message}
|
|
14
14
|
|
|
15
|
-
Version: lightweight-charts-react-components@${o}`),Object.setPrototypeOf(this,h.prototype)}}let m=(e,r)=>{let i=(0,t.useContext)(e);if(!i){let t=e.name??e.displayName??"Context";throw new h(r??`${t} not found.`,{isOperational:!0})}return i},v=(0,t.createContext)(null);v.displayName="PaneContext";let y=()=>{let e=(0,t.useContext)(v),r=!!e;return{isInsidePane:r,isPaneReady:!!(null==e?void 0:e.isReady),paneApiRef:null==e?void 0:e.paneApiRef}},R=({onVisibleTimeRangeChange:e,onVisibleLogicalRangeChange:r,onSizeChange:a,visibleRange:n,visibleLogicalRange:l,options:u={}})=>{let{isReady:s,chartApiRef:c}=m(i),{isPaneReady:f,isInsidePane:p}=y(),[o,d]=(0,t.useState)(!1),h=(0,t.useRef)({_timeScale:null,api(){return this._timeScale},init(){if(this._timeScale)return this._timeScale;let e=null==c?void 0:c.api();return e?(this._timeScale=e.timeScale(),this._timeScale.applyOptions(u),n&&this._timeScale.setVisibleRange(n),l&&this._timeScale.setVisibleLogicalRange(l),d(!0),this._timeScale):null},clear(){this._timeScale=null,d(!1)}});return(0,t.useLayoutEffect)(()=>{s&&(!p||f)&&h.current.init()},[s,p,f]),(0,t.useLayoutEffect)(()=>()=>{h.current.clear()},[]),(0,t.useLayoutEffect)(()=>{if(c&&u){var e,t;null==(t=h.current)||null==(e=t.api())||e.applyOptions(u)}},[u]),(0,t.useLayoutEffect)(()=>{if(!c||!o)return;let e=h.current.api();return a&&e&&e.subscribeSizeChange(a),()=>{a&&e&&e.unsubscribeSizeChange(a)}},[c,o,a]),(0,t.useLayoutEffect)(()=>{if(!c||!o)return;let e=h.current.api();return r&&e&&e.subscribeVisibleLogicalRangeChange(r),()=>{r&&e&&e.unsubscribeVisibleLogicalRangeChange(r)}},[c,o,r]),(0,t.useLayoutEffect)(()=>{if(!c||!o)return;let t=h.current.api();return e&&t&&t.subscribeVisibleTimeRangeChange(e),()=>{e&&t&&t.unsubscribeVisibleTimeRangeChange(e)}},[c,o,e]),(0,t.useLayoutEffect)(()=>{if(c&&n){var e,t;null==(t=h.current)||null==(e=t.api())||e.setVisibleRange(n)}},[n]),(0,t.useLayoutEffect)(()=>{if(c&&l){var e,t;null==(t=h.current)||null==(e=t.api())||e.setVisibleLogicalRange(l)}},[l]),{timeScaleApiRef:h,isReady:o}},_=(0,t.forwardRef)(({children:e,...r},i)=>{let{timeScaleApiRef:{current:a},isReady:n}=R(r);return(0,t.useImperativeHandle)(i,()=>a,[a]),t.default.createElement(p.Provider,{value:{timeScaleApiRef:a,isReady:n}},e)});_.displayName="TimeScale";let S=({options:e={},id:r})=>{let{isReady:a,chartApiRef:n}=m(i),{isInsidePane:l,isPaneReady:u}=y(),s=(0,t.useRef)({_priceScale:null,api(){return this._priceScale},init(){if(!this._priceScale){let t=null==n?void 0:n.api();if(!t)return null;this._priceScale=t.priceScale(r),this._priceScale.applyOptions(e)}return this._priceScale},setId(t){null!==this._priceScale&&null!==n&&(this._priceScale=n.api().priceScale(t),this._priceScale.applyOptions(e))},clear(){this._priceScale=null}});return(0,t.useLayoutEffect)(()=>{if(a){if(!l)throw new h("PriceScale must be used inside a pane. Please ensure that the component is wrapped in a pane component.",{isOperational:!0,docsPath:""});u&&s.current.init()}},[a,l,u]),(0,t.useLayoutEffect)(()=>()=>{s.current.clear()},[]),(0,t.useLayoutEffect)(()=>{var e;n&&(null==(e=s.current)||e.setId(r))},[r]),(0,t.useLayoutEffect)(()=>{if(n&&e){var t,r;null==(r=s.current)||null==(t=r.api())||t.applyOptions(e)}},[e]),s},C=(0,t.forwardRef)((e,r)=>{let i=S(e);return(0,t.useImperativeHandle)(r,()=>i.current,[i]),null});C.displayName="PriceScale";let g=({deps:e})=>{let{timeScaleApiRef:r,isReady:i}=m(p);(0,t.useLayoutEffect)(()=>{if(!i||!r)return;let e=r.api();queueMicrotask(()=>{e&&e.fitContent()})},[...e,i])},E=({deps:e})=>(g({deps:e}),null),L=(0,t.createContext)({seriesApiRef:null,isReady:!1});L.displayName="SeriesContext";let w=({type:e,data:r,options:a={},reactive:n=!0,seriesOrder:l,alwaysReplaceData:u=!1,...s})=>{let{isReady:c,chartApiRef:f,chartKind:p}=m(i),{isPaneReady:o,isInsidePane:d,paneApiRef:v}=y(),[R,_]=(0,t.useState)(!1),S=(0,t.useRef)({_series:null,api(){return this._series},init(){if(!this._series){var t,i,n;let u=null==f?void 0:f.api();if(!u)return null;let c=d?null==v||null==(t=v.api())?void 0:t.paneIndex():void 0;if("Custom"===e){let e=s.plugin;if(!e)throw new h("Custom series requires a plugin to be defined");this._series=u.addCustomSeries(e,a,c)}else{if("yield-curve"===p&&"Area"!==e&&"Line"!==e)throw new h("YieldCurveChart only supports LineSeries and AreaSeries.",{isOperational:!0});this._series=u.addSeries(b[e],a,c)}null==(i=this._series)||i.setData(r),void 0!==l&&(null==(n=this._series)||n.setSeriesOrder(l)),_(!0)}return this._series},clear(){if(null!==this._series){if(!(null==f?void 0:f._isDisposing)){var e;null==f||null==(e=f.api())||e.removeSeries(this._series)}this._series=null,_(!1)}}});return(0,t.useLayoutEffect)(()=>{c&&(!d||o)&&S.current.init()},[c,d,o]),(0,t.useLayoutEffect)(()=>()=>{S.current.clear()},[]),(0,t.useLayoutEffect)(()=>{if(f&&r&&n){let e=S.current.api();if(!e)return;let t=e.data();if(u||!k(t,r))return void e.setData(r);let i=r[r.length-1];e.update(i)}},[r,n,u]),(0,t.useLayoutEffect)(()=>{if(f&&a){var e;null==(e=S.current.api())||e.applyOptions(a)}},[a]),(0,t.useLayoutEffect)(()=>{if(f&&void 0!==l){var e;null==(e=S.current.api())||e.setSeriesOrder(l)}},[l]),{isReady:R,seriesApiRef:S}},b={Line:e.LineSeries,Candlestick:e.CandlestickSeries,Histogram:e.HistogramSeries,Area:e.AreaSeries,Baseline:e.BaselineSeries,Bar:e.BarSeries},k=(e,t)=>{let r=t.length-e.length;return 0!==e.length&&0!==t.length&&!(r<0)&&!(r>1)&&(0===r?P(e,t,e.length-1)&&A(e[e.length-1],t[t.length-1]):P(e,t,e.length)&&!A(e[e.length-1],t[t.length-1]))},P=(e,t,r)=>{for(let i=0;i<r;i+=1)if(e[i]!==t[i])return!1;return!0},A=(e,t)=>{let r=e.time,i=t.time;return r===i||N(r)&&N(i)&&O(r,i)},N=t=>(0,e.isBusinessDay)(t),O=(e,t)=>e.year===t.year&&e.month===t.month&&e.day===t.day,x=(0,t.forwardRef)(({children:e,...r},i)=>{let{seriesApiRef:{current:a},isReady:n}=w(r);return(0,t.useImperativeHandle)(i,()=>a,[a]),t.default.createElement(L.Provider,{value:{seriesApiRef:a,isReady:n}},e)});x.displayName="SeriesTemplate";let I=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(x,{type:"Line",ref:i,...r},e));I.displayName="LineSeries";let H=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(x,{type:"Histogram",ref:i,...r},e));H.displayName="HistogramSeries";let B=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(x,{type:"Candlestick",ref:i,...r},e));B.displayName="CandlestickSeries";let D=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(x,{type:"Area",ref:i,...r},e));D.displayName="AreaSeries";let T=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(x,{type:"Baseline",ref:i,...r},e));T.displayName="BaselineSeries";let V=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(x,{type:"Bar",ref:i,...r},e));V.displayName="BarSeries";let W=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(x,{type:"Custom",ref:i,...r},e));W.displayName="CustomSeries";let M=({options:e,price:r})=>{let{isReady:i,seriesApiRef:a}=m(L),n=(0,t.useRef)({_priceLine:null,api(){return this._priceLine},init(){if(!this._priceLine){let t=null==a?void 0:a.api();if(!t)return null;this._priceLine=t.createPriceLine({price:r,...e})}return this._priceLine},clear(){if(null!==this._priceLine){var e;null==a||null==(e=a.api())||e.removePriceLine(this._priceLine),this._priceLine=null}}});return(0,t.useLayoutEffect)(()=>{i&&n.current.init()},[i]),(0,t.useLayoutEffect)(()=>()=>{n.current.clear()},[]),(0,t.useLayoutEffect)(()=>{if(a&&e){var t;null==(t=n.current.api())||t.applyOptions(e)}},[e]),(0,t.useLayoutEffect)(()=>{var e;a&&(null==(e=n.current.api())||e.applyOptions({price:r}))},[r]),n},$=(0,t.forwardRef)((e,r)=>{let i=M(e);return(0,t.useImperativeHandle)(r,()=>i.current,[i]),null});$.displayName="PriceLine";let K=({reactive:r=!0,markers:i,options:a})=>{let{isReady:n,seriesApiRef:l}=m(L),u=(0,t.useRef)({_markers:null,api(){return this._markers},init(){if(null===this._markers){let t=null==l?void 0:l.api();if(!t)return null;this._markers=(0,e.createSeriesMarkers)(t,i,a)}return this._markers},clear(){null!==this._markers&&(this._markers.detach(),this._markers=null)}});return(0,t.useLayoutEffect)(()=>{n&&u.current.init()},[n]),(0,t.useLayoutEffect)(()=>()=>{u.current.clear()},[]),(0,t.useLayoutEffect)(()=>{if(l&&i&&r){var e;null==(e=u.current.api())||e.setMarkers(i)}},[i,r]),u},Y=(0,t.forwardRef)(({...e},r)=>{let i=K(e);return(0,t.useImperativeHandle)(r,()=>i.current,[i]),null});Y.displayName="Markers";let F=e=>{let r=(0,t.useRef)(e);return r.current=e,r},j=r=>{let{isReady:a,chartApiRef:n}=m(i),{isPaneReady:l,isInsidePane:u,paneApiRef:s}=y(),c=F(r),f=F(n),p=F(s),o=z(r),d=(0,t.useRef)({_watermark:null,api(){return this._watermark},init(){if(null===this._watermark){var t,r;let i=null==(t=f.current)?void 0:t.api(),a=null==(r=p.current)?void 0:r.api(),n=c.current;if(!i||!a)return null;if(G(n)){let{type:t,...r}=n;this._watermark=(0,e.createTextWatermark)(a,r)}else{let{type:t,src:r,...i}=n;this._watermark=(0,e.createImageWatermark)(a,r,i)}}return this._watermark},clear(){null!==this._watermark&&(this._watermark.detach(),this._watermark=null)}});return(0,t.useLayoutEffect)(()=>{if(a){if(!u)throw new h("Watermark must be used inside a pane. Please ensure that the component is wrapped in a pane component.",{isOperational:!0,docsPath:""});l&&(d.current.clear(),d.current.init())}},[a,l,u,o]),(0,t.useLayoutEffect)(()=>()=>{d.current.clear()},[]),(0,t.useLayoutEffect)(()=>{var e;n&&r&&(null==(e=d.current.api())||e.applyOptions(q(r)))},[r]),d},q=e=>{if(G(e)){let{type:t,...r}=e;return r}let{type:t,src:r,...i}=e;return i},z=e=>{if(!G(e))return e.src},G=e=>"text"===e.type,J=(e,r)=>{let i=j(e);return(0,t.useImperativeHandle)(r,()=>i.current,[i]),null},Q=(0,t.forwardRef)((e,t)=>J({...e,type:"text"},t)),U=(0,t.forwardRef)((e,t)=>J({...e,type:"image"},t));Q.displayName="WatermarkText",U.displayName="WatermarkImage";let X=({isReady:e,props:r,primitiveIdentity:i,mountPrimitive:a})=>{let n=(0,t.useRef)(r),l=(0,t.useRef)(i),u=(0,t.useRef)(a),s=(0,t.useRef)(null);n.current=r,u.current=a;let c=(0,t.useRef)({_primitive:null,api(){return this._primitive},init(){if(!this._primitive){let e=u.current(n.current);if(!e)return null;s.current=e.detach,this._primitive=e.primitive}return this._primitive},clear(){if(null!==this._primitive){var e;null==(e=s.current)||e.call(s),s.current=null,this._primitive=null}}});return(0,t.useLayoutEffect)(()=>{e&&(l.current!==i&&(c.current.clear(),l.current=i),c.current.init())},[e,i]),(0,t.useLayoutEffect)(()=>()=>{c.current.clear()},[]),c},Z=e=>{let{isReady:r,chartApiRef:a}=m(i),{isInsidePane:n,isPaneReady:l,paneApiRef:u}=y(),s=(0,t.useRef)(a),c=(0,t.useRef)(u);s.current=a,c.current=u;let f=X({isReady:r&&n&&l,props:e,primitiveIdentity:e.plugin??e.render,mountPrimitive(e){var t,r;let i=null==(t=s.current)?void 0:t.api(),a=null==(r=c.current)?void 0:r.api();if(!i||!a)return null;let n=void 0!==e.plugin?e.plugin:e.render({chart:i,pane:a});return a.attachPrimitive(n),{primitive:n,detach:()=>a.detachPrimitive(n)}}});return(0,t.useLayoutEffect)(()=>{if(r&&!n)throw new h("PanePrimitive must be used inside a pane. Please ensure that the component is wrapped in a pane component.",{isOperational:!0,docsPath:"pane-primitives"})},[r,n]),f},ee=(0,t.forwardRef)((e,r)=>{let i=Z(e);return(0,t.useImperativeHandle)(r,()=>i.current,[i]),null});ee.displayName="PanePrimitive";let et=e=>{let{isReady:r,chartApiRef:a}=m(i),{isReady:n,seriesApiRef:l}=m(L),u=(0,t.useRef)(a),s=(0,t.useRef)(l);return u.current=a,s.current=l,X({isReady:r&&n,props:e,primitiveIdentity:e.plugin??e.render,mountPrimitive(e){var t,r;let i=null==(t=s.current)?void 0:t.api(),a=null==(r=u.current)?void 0:r.api();if(!a||!i)return null;let n=void 0!==e.plugin?e.plugin:e.render({chart:a,series:i});return i.attachPrimitive(n),{primitive:n,detach:()=>i.detachPrimitive(n)}}})},er=(0,t.forwardRef)((e,r)=>{let i=et(e);return(0,t.useImperativeHandle)(r,()=>i.current,[i]),null});er.displayName="SeriesPrimitive";let ei=({stretchFactor:e}={})=>{let{chartApiRef:r,isReady:a}=m(i),[n,l]=(0,t.useState)(!1),u=(0,t.useRef)({_pane:null,api(){return this._pane},init(){let t=null==r?void 0:r.api();if(!t)return null;let i=t.addPane(!0);return this._pane=i,l(!0),void 0!==e&&this._pane.setStretchFactor(e),this._pane},clear(){if(null!==this._pane){var e;null==r||null==(e=r.api())||e.removePane(this._pane.paneIndex()),l(!1),this._pane=null}}});return(0,t.useLayoutEffect)(()=>{a&&u.current.init()},[a]),(0,t.useEffect)(()=>()=>{u.current.clear()},[]),(0,t.useLayoutEffect)(()=>{if(void 0===e)return;let t=u.current.api();t&&t.setStretchFactor(e)},[e]),{paneApiRef:u,isReady:n}},ea=(0,t.forwardRef)(({children:e,stretchFactor:r},i)=>{let{paneApiRef:{current:a},isReady:n}=ei({stretchFactor:r});return(0,t.useImperativeHandle)(i,()=>a,[a]),t.default.createElement(v.Provider,{value:{paneApiRef:a,isReady:n}},e)});ea.displayName="Pane";export{D as AreaSeries,V as BarSeries,T as BaselineSeries,B as CandlestickSeries,u as Chart,f as CustomChart,W as CustomSeries,H as HistogramSeries,I as LineSeries,Y as Markers,s as OptionsChart,ea as Pane,ee as PanePrimitive,$ as PriceLine,C as PriceScale,er as SeriesPrimitive,_ as TimeScale,E as TimeScaleFitContentTrigger,U as WatermarkImage,Q as WatermarkText,c as YieldCurveChart};
|
|
15
|
+
Version: lightweight-charts-react-components@${o}`),Object.setPrototypeOf(this,h.prototype)}}let m=(e,r)=>{let i=(0,t.useContext)(e);if(!i){let t=e.name??e.displayName??"Context";throw new h(r??`${t} not found.`,{isOperational:!0})}return i},v=(0,t.createContext)(null);v.displayName="PaneContext";let y=()=>{let e=(0,t.useContext)(v),r=!!e;return{isInsidePane:r,isPaneReady:!!(null==e?void 0:e.isReady),paneApiRef:null==e?void 0:e.paneApiRef}},R=({onVisibleTimeRangeChange:e,onVisibleLogicalRangeChange:r,onSizeChange:a,visibleRange:n,visibleLogicalRange:l,options:u={}})=>{let{isReady:s,chartApiRef:c}=m(i),{isPaneReady:f,isInsidePane:p}=y(),[o,d]=(0,t.useState)(!1),h=(0,t.useRef)({_timeScale:null,api(){return this._timeScale},init(){if(this._timeScale)return this._timeScale;let e=null==c?void 0:c.api();return e?(this._timeScale=e.timeScale(),this._timeScale.applyOptions(u),n&&this._timeScale.setVisibleRange(n),l&&this._timeScale.setVisibleLogicalRange(l),d(!0),this._timeScale):null},clear(){this._timeScale=null,d(!1)}});return(0,t.useLayoutEffect)(()=>{s&&(!p||f)&&h.current.init()},[s,p,f]),(0,t.useLayoutEffect)(()=>()=>{h.current.clear()},[]),(0,t.useLayoutEffect)(()=>{if(c&&u){var e,t;null==(t=h.current)||null==(e=t.api())||e.applyOptions(u)}},[u]),(0,t.useLayoutEffect)(()=>{if(!c||!o)return;let e=h.current.api();return a&&e&&e.subscribeSizeChange(a),()=>{a&&e&&e.unsubscribeSizeChange(a)}},[c,o,a]),(0,t.useLayoutEffect)(()=>{if(!c||!o)return;let e=h.current.api();return r&&e&&e.subscribeVisibleLogicalRangeChange(r),()=>{r&&e&&e.unsubscribeVisibleLogicalRangeChange(r)}},[c,o,r]),(0,t.useLayoutEffect)(()=>{if(!c||!o)return;let t=h.current.api();return e&&t&&t.subscribeVisibleTimeRangeChange(e),()=>{e&&t&&t.unsubscribeVisibleTimeRangeChange(e)}},[c,o,e]),(0,t.useLayoutEffect)(()=>{if(c&&n){var e,t;null==(t=h.current)||null==(e=t.api())||e.setVisibleRange(n)}},[n]),(0,t.useLayoutEffect)(()=>{if(c&&l){var e,t;null==(t=h.current)||null==(e=t.api())||e.setVisibleLogicalRange(l)}},[l]),{timeScaleApiRef:h,isReady:o}},_=(0,t.forwardRef)(({children:e,...r},i)=>{let{timeScaleApiRef:{current:a},isReady:n}=R(r);return(0,t.useImperativeHandle)(i,()=>a,[a]),t.default.createElement(p.Provider,{value:{timeScaleApiRef:a,isReady:n}},e)});_.displayName="TimeScale";let S=e=>{let r=(0,t.useRef)(e);return r.current=e,r},C=(0,t.createContext)({seriesApiRef:null,isReady:!1});C.displayName="SeriesContext";let g=({options:e={},id:r})=>{let{isReady:a,chartApiRef:n}=m(i),{isInsidePane:l,isPaneReady:u,paneApiRef:s}=y(),{seriesApiRef:c,isReady:f}=(0,t.useContext)(C),p=null===c||f,o=S(e),d=(0,t.useRef)({_priceScale:null,api(){return this._priceScale},init(){if(!this._priceScale){var e;let t=null==n?void 0:n.api();if(!t)return null;this._priceScale=t.priceScale(r,null==s||null==(e=s.api())?void 0:e.paneIndex()),this._priceScale.applyOptions(o.current)}return this._priceScale},setId(e){var t;null!==this._priceScale&&null!==n&&(this._priceScale=n.api().priceScale(e,null==s||null==(t=s.api())?void 0:t.paneIndex()),this._priceScale.applyOptions(o.current))},clear(){this._priceScale=null}});return(0,t.useEffect)(()=>{if(a){if(!l)throw new h("PriceScale must be used inside a pane. Please ensure that the component is wrapped in a pane component.",{isOperational:!0,docsPath:""});u&&p&&d.current.init()}},[a,l,u,p]),(0,t.useLayoutEffect)(()=>()=>{d.current.clear()},[]),(0,t.useEffect)(()=>{n&&d.current.setId(r)},[r,e]),d},E=(0,t.forwardRef)((e,r)=>{let i=g(e);return(0,t.useImperativeHandle)(r,()=>i.current,[i]),null});E.displayName="PriceScale";let L=({deps:e})=>{let{timeScaleApiRef:r,isReady:i}=m(p);(0,t.useLayoutEffect)(()=>{if(!i||!r)return;let e=r.api();queueMicrotask(()=>{e&&e.fitContent()})},[...e,i])},w=({deps:e})=>(L({deps:e}),null),b=({type:e,data:r,options:a={},reactive:n=!0,seriesOrder:l,alwaysReplaceData:u=!1,...s})=>{let{isReady:c,chartApiRef:f,chartKind:p}=m(i),{isPaneReady:o,isInsidePane:d,paneApiRef:v}=y(),[R,_]=(0,t.useState)(!1),S=(0,t.useRef)({_series:null,api(){return this._series},init(){if(!this._series){var t,i,n;let u=null==f?void 0:f.api();if(!u)return null;let c=d?null==v||null==(t=v.api())?void 0:t.paneIndex():void 0;if("Custom"===e){let e=s.plugin;if(!e)throw new h("Custom series requires a plugin to be defined");this._series=u.addCustomSeries(e,a,c)}else{if("yield-curve"===p&&"Area"!==e&&"Line"!==e)throw new h("YieldCurveChart only supports LineSeries and AreaSeries.",{isOperational:!0});this._series=u.addSeries(k[e],a,c)}null==(i=this._series)||i.setData(r),void 0!==l&&(null==(n=this._series)||n.setSeriesOrder(l)),_(!0)}return this._series},clear(){if(null!==this._series){if(!(null==f?void 0:f._isDisposing)){var e;null==f||null==(e=f.api())||e.removeSeries(this._series)}this._series=null,_(!1)}}});return(0,t.useLayoutEffect)(()=>{c&&(!d||o)&&S.current.init()},[c,d,o]),(0,t.useLayoutEffect)(()=>()=>{S.current.clear()},[]),(0,t.useLayoutEffect)(()=>{if(f&&r&&n){let e=S.current.api();if(!e)return;let t=e.data();if(u||!P(t,r))return void e.setData(r);let i=r[r.length-1];e.update(i)}},[r,n,u]),(0,t.useLayoutEffect)(()=>{if(f&&a){var e;null==(e=S.current.api())||e.applyOptions(a)}},[a]),(0,t.useLayoutEffect)(()=>{if(f&&void 0!==l){var e;null==(e=S.current.api())||e.setSeriesOrder(l)}},[l]),{isReady:R,seriesApiRef:S}},k={Line:e.LineSeries,Candlestick:e.CandlestickSeries,Histogram:e.HistogramSeries,Area:e.AreaSeries,Baseline:e.BaselineSeries,Bar:e.BarSeries},P=(e,t)=>{let r=t.length-e.length;return 0!==e.length&&0!==t.length&&!(r<0)&&!(r>1)&&(0===r?A(e,t,e.length-1)&&N(e[e.length-1],t[t.length-1]):A(e,t,e.length)&&!N(e[e.length-1],t[t.length-1]))},A=(e,t,r)=>{for(let i=0;i<r;i+=1)if(e[i]!==t[i])return!1;return!0},N=(e,t)=>{let r=e.time,i=t.time;return r===i||x(r)&&x(i)&&O(r,i)},x=t=>(0,e.isBusinessDay)(t),O=(e,t)=>e.year===t.year&&e.month===t.month&&e.day===t.day,I=(0,t.forwardRef)(({children:e,...r},i)=>{let{seriesApiRef:{current:a},isReady:n}=b(r);return(0,t.useImperativeHandle)(i,()=>a,[a]),t.default.createElement(C.Provider,{value:{seriesApiRef:a,isReady:n}},e)});I.displayName="SeriesTemplate";let H=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(I,{type:"Line",ref:i,...r},e));H.displayName="LineSeries";let B=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(I,{type:"Histogram",ref:i,...r},e));B.displayName="HistogramSeries";let D=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(I,{type:"Candlestick",ref:i,...r},e));D.displayName="CandlestickSeries";let T=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(I,{type:"Area",ref:i,...r},e));T.displayName="AreaSeries";let V=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(I,{type:"Baseline",ref:i,...r},e));V.displayName="BaselineSeries";let W=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(I,{type:"Bar",ref:i,...r},e));W.displayName="BarSeries";let M=(0,t.forwardRef)(({children:e,...r},i)=>t.default.createElement(I,{type:"Custom",ref:i,...r},e));M.displayName="CustomSeries";let $=({options:e,price:r})=>{let{isReady:i,seriesApiRef:a}=m(C),n=(0,t.useRef)({_priceLine:null,api(){return this._priceLine},init(){if(!this._priceLine){let t=null==a?void 0:a.api();if(!t)return null;this._priceLine=t.createPriceLine({price:r,...e})}return this._priceLine},clear(){if(null!==this._priceLine){var e;null==a||null==(e=a.api())||e.removePriceLine(this._priceLine),this._priceLine=null}}});return(0,t.useLayoutEffect)(()=>{i&&n.current.init()},[i]),(0,t.useLayoutEffect)(()=>()=>{n.current.clear()},[]),(0,t.useLayoutEffect)(()=>{if(a&&e){var t;null==(t=n.current.api())||t.applyOptions(e)}},[e]),(0,t.useLayoutEffect)(()=>{var e;a&&(null==(e=n.current.api())||e.applyOptions({price:r}))},[r]),n},K=(0,t.forwardRef)((e,r)=>{let i=$(e);return(0,t.useImperativeHandle)(r,()=>i.current,[i]),null});K.displayName="PriceLine";let Y=({reactive:r=!0,markers:i,options:a})=>{let{isReady:n,seriesApiRef:l}=m(C),u=(0,t.useRef)({_markers:null,api(){return this._markers},init(){if(null===this._markers){let t=null==l?void 0:l.api();if(!t)return null;this._markers=(0,e.createSeriesMarkers)(t,i,a)}return this._markers},clear(){null!==this._markers&&(this._markers.detach(),this._markers=null)}});return(0,t.useLayoutEffect)(()=>{n&&u.current.init()},[n]),(0,t.useLayoutEffect)(()=>()=>{u.current.clear()},[]),(0,t.useLayoutEffect)(()=>{if(l&&i&&r){var e;null==(e=u.current.api())||e.setMarkers(i)}},[i,r]),u},F=(0,t.forwardRef)(({...e},r)=>{let i=Y(e);return(0,t.useImperativeHandle)(r,()=>i.current,[i]),null});F.displayName="Markers";let j=r=>{let{isReady:a,chartApiRef:n}=m(i),{isPaneReady:l,isInsidePane:u,paneApiRef:s}=y(),c=S(r),f=S(n),p=S(s),o=z(r),d=(0,t.useRef)({_watermark:null,api(){return this._watermark},init(){if(null===this._watermark){var t,r;let i=null==(t=f.current)?void 0:t.api(),a=null==(r=p.current)?void 0:r.api(),n=c.current;if(!i||!a)return null;if(G(n)){let{type:t,...r}=n;this._watermark=(0,e.createTextWatermark)(a,r)}else{let{type:t,src:r,...i}=n;this._watermark=(0,e.createImageWatermark)(a,r,i)}}return this._watermark},clear(){null!==this._watermark&&(this._watermark.detach(),this._watermark=null)}});return(0,t.useLayoutEffect)(()=>{if(a){if(!u)throw new h("Watermark must be used inside a pane. Please ensure that the component is wrapped in a pane component.",{isOperational:!0,docsPath:""});l&&(d.current.clear(),d.current.init())}},[a,l,u,o]),(0,t.useLayoutEffect)(()=>()=>{d.current.clear()},[]),(0,t.useLayoutEffect)(()=>{var e;n&&r&&(null==(e=d.current.api())||e.applyOptions(q(r)))},[r]),d},q=e=>{if(G(e)){let{type:t,...r}=e;return r}let{type:t,src:r,...i}=e;return i},z=e=>{if(!G(e))return e.src},G=e=>"text"===e.type,J=(e,r)=>{let i=j(e);return(0,t.useImperativeHandle)(r,()=>i.current,[i]),null},Q=(0,t.forwardRef)((e,t)=>J({...e,type:"text"},t)),U=(0,t.forwardRef)((e,t)=>J({...e,type:"image"},t));Q.displayName="WatermarkText",U.displayName="WatermarkImage";let X=({isReady:e,props:r,primitiveIdentity:i,mountPrimitive:a})=>{let n=(0,t.useRef)(r),l=(0,t.useRef)(i),u=(0,t.useRef)(a),s=(0,t.useRef)(null);n.current=r,u.current=a;let c=(0,t.useRef)({_primitive:null,api(){return this._primitive},init(){if(!this._primitive){let e=u.current(n.current);if(!e)return null;s.current=e.detach,this._primitive=e.primitive}return this._primitive},clear(){if(null!==this._primitive){var e;null==(e=s.current)||e.call(s),s.current=null,this._primitive=null}}});return(0,t.useLayoutEffect)(()=>{e&&(l.current!==i&&(c.current.clear(),l.current=i),c.current.init())},[e,i]),(0,t.useLayoutEffect)(()=>()=>{c.current.clear()},[]),c},Z=e=>{let{isReady:r,chartApiRef:a}=m(i),{isInsidePane:n,isPaneReady:l,paneApiRef:u}=y(),s=(0,t.useRef)(a),c=(0,t.useRef)(u);s.current=a,c.current=u;let f=X({isReady:r&&n&&l,props:e,primitiveIdentity:e.plugin??e.render,mountPrimitive(e){var t,r;let i=null==(t=s.current)?void 0:t.api(),a=null==(r=c.current)?void 0:r.api();if(!i||!a)return null;let n=void 0!==e.plugin?e.plugin:e.render({chart:i,pane:a});return a.attachPrimitive(n),{primitive:n,detach:()=>a.detachPrimitive(n)}}});return(0,t.useLayoutEffect)(()=>{if(r&&!n)throw new h("PanePrimitive must be used inside a pane. Please ensure that the component is wrapped in a pane component.",{isOperational:!0,docsPath:"pane-primitives"})},[r,n]),f},ee=(0,t.forwardRef)((e,r)=>{let i=Z(e);return(0,t.useImperativeHandle)(r,()=>i.current,[i]),null});ee.displayName="PanePrimitive";let et=e=>{let{isReady:r,chartApiRef:a}=m(i),{isReady:n,seriesApiRef:l}=m(C),u=(0,t.useRef)(a),s=(0,t.useRef)(l);return u.current=a,s.current=l,X({isReady:r&&n,props:e,primitiveIdentity:e.plugin??e.render,mountPrimitive(e){var t,r;let i=null==(t=s.current)?void 0:t.api(),a=null==(r=u.current)?void 0:r.api();if(!a||!i)return null;let n=void 0!==e.plugin?e.plugin:e.render({chart:a,series:i});return i.attachPrimitive(n),{primitive:n,detach:()=>i.detachPrimitive(n)}}})},er=(0,t.forwardRef)((e,r)=>{let i=et(e);return(0,t.useImperativeHandle)(r,()=>i.current,[i]),null});er.displayName="SeriesPrimitive";let ei=({stretchFactor:e}={})=>{let{chartApiRef:r,isReady:a}=m(i),[n,l]=(0,t.useState)(!1),u=(0,t.useRef)({_pane:null,api(){return this._pane},init(){let t=null==r?void 0:r.api();if(!t)return null;let i=t.addPane(!0);return this._pane=i,l(!0),void 0!==e&&this._pane.setStretchFactor(e),this._pane},clear(){if(null!==this._pane){var e;null==r||null==(e=r.api())||e.removePane(this._pane.paneIndex()),l(!1),this._pane=null}}});return(0,t.useLayoutEffect)(()=>{a&&u.current.init()},[a]),(0,t.useEffect)(()=>()=>{u.current.clear()},[]),(0,t.useLayoutEffect)(()=>{if(void 0===e)return;let t=u.current.api();t&&t.setStretchFactor(e)},[e]),{paneApiRef:u,isReady:n}},ea=(0,t.forwardRef)(({children:e,stretchFactor:r},i)=>{let{paneApiRef:{current:a},isReady:n}=ei({stretchFactor:r});return(0,t.useImperativeHandle)(i,()=>a,[a]),t.default.createElement(v.Provider,{value:{paneApiRef:a,isReady:n}},e)});ea.displayName="Pane";export{T as AreaSeries,W as BarSeries,V as BaselineSeries,D as CandlestickSeries,u as Chart,f as CustomChart,M as CustomSeries,B as HistogramSeries,H as LineSeries,F as Markers,s as OptionsChart,ea as Pane,ee as PanePrimitive,K as PriceLine,E as PriceScale,er as SeriesPrimitive,_ as TimeScale,w as TimeScaleFitContentTrigger,U as WatermarkImage,Q as WatermarkText,c as YieldCurveChart};
|
|
16
16
|
//# sourceMappingURL=lightweight-charts-react-components.mjs.map
|