Skip to content

Conversation

@himanshu27tasveer
Copy link
Contributor

New Pull Request: Add TypeScript Type Definition for Nonce in ApexCharts Options

This pull request addresses a TypeScript type error related to the nonce attribute within the ApexCharts options. While the functionality to include a nonce in the chart options already existed, the TypeScript type definitions were missing the correct type for this parameter, causing TypeScript projects to report errors. This PR adds the necessary type definition to the ApexChart interface in the apexcharts.d.ts file, ensuring proper TypeScript support.

Type of change

  • Bug fix (non-breaking change which fixes an issue)
  • This change requires a documentation update (If you added or changed public API, please add documentation)

Summary of Changes

This PR adds the correct type definition for the nonce parameter within the ApexChart interface in the global TypeScript types file (apexcharts.d.ts).

Key changes:

  • Added the nonce?: string property to the ApexChart interface.
  • This resolves TypeScript type errors that occurred when using the nonce parameter in ApexCharts options.
  • No changes were made to the ApexCharts library logic itself.

Motivation and Context

The nonce attribute is crucial for Content Security Policy (CSP) compliance, enhancing security by allowing developers to include CSP nonces in script tags generated by ApexCharts. While the functionality was present, the lack of a proper TypeScript type definition hindered TypeScript project integration. This change fixes the type-related issue, improving developer experience and preventing potential type errors.

Dependencies

This change does not introduce any new dependencies. It only modifies existing TypeScript type definitions within the apexcharts.d.ts file.

Example Usage

// Example of how to use nonce in ApexCharts options (now with correct typing):
const options: ApexCharts.ApexOptions = {
  // ... other options
  chart: {
    // ... other chart options
    nonce: 'your-unique-nonce-value', // No more type errors!
  },
  // ... other options
};

const chart = new ApexCharts(document.querySelector("#chart"), options);
chart.render();

@junedchhipa junedchhipa merged commit cc262be into apexcharts:main Mar 27, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants