# ak-editor-cq > Atlassian Editor component for Confluence Questions Latest version **3.1.6** (published 2017-01-26) · Apache-2.0 license · 0 weekly downloads > **Deprecated.** This package is deprecated. ## Install ```sh npm install ak-editor-cq pnpm add ak-editor-cq yarn add ak-editor-cq bun add ak-editor-cq ``` ## Health **Score 10/100 (F)** — status: deprecated. Negative: deprecated. ## Facts | | | |---|---| | Version | 3.1.6 | | Published | 2017-01-26 | | First published | 2016-11-14 | | Weekly downloads | 0 | | License | Apache-2.0 | | TypeScript types | bundled | | Module format | CommonJS | | Dependencies | 5 | | Known vulnerabilities | 0 | | Install scripts | no | | Author | Atlassian Pty Ltd | | Maintainers | atlassian-aui | ## Links - npm: https://www.npmjs.com/package/ak-editor-cq - Repository: https://bitbucket.org/atlassian/atlaskit - Homepage: https://bitbucket.org/atlassian/atlaskit#readme - npm.io page: https://npm.io/package/ak-editor-cq ## Dependencies (5) - [tslib](https://npm.io/package/tslib.md) ^1.2.0 - [ak-editor-core](https://npm.io/package/ak-editor-core.md) ^3.1.1 - [collapse-whitespace](https://npm.io/package/collapse-whitespace.md) ^1.1.4 - [akutil-shared-styles](https://npm.io/package/akutil-shared-styles.md) ^37.0.1 - [ak-editor-shared-styles](https://npm.io/package/ak-editor-shared-styles.md) ^3.0.0 ## Recent versions - 3.1.6 (latest) — 2017-01-26 - 3.1.5 — 2017-01-24 - 3.1.4 — 2017-01-23 - 3.1.3 — 2017-01-18 - 3.1.2 — 2017-01-17 - 3.1.1 — 2017-01-17 - 3.1.0 — 2017-01-09 - 3.0.0 — 2017-01-08 - 2.14.6 — 2017-01-06 - 2.14.5 — 2017-01-05 - 2.14.0 — 2016-12-28 - 2.13.0 — 2016-12-28 - 2.12.0 — 2016-12-22 - 2.11.0 — 2016-12-21 - 2.8.2 — 2016-12-20 - … 15 more at https://npm.io/package/ak-editor-cq/versions ## README [![AtlasKit component registry](https://img.shields.io/badge/AtlasKit-components-FF5230.svg)](http://aui-cdn.atlassian.com/atlaskit/registry/) [![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://Commitizen.github.io/cz-cli/) [![semantic-release](https://img.shields.io/badge/GitHub-semantic_release-ffab00.svg)](https://github.com/semantic-release/semantic-release) [![Report an issue](https://img.shields.io/badge/Report-an_issue-6554C0.svg)](https://ecosystem.atlassian.net/browse/AK) [![Ask in our forum](https://img.shields.io/badge/Ask-in_our_forum-6554C0.svg)](https://answers.atlassian.com/questions/ask?title=AtlasKit%3A%20&topics=atlaskit,ak-editor-cq,ak-editor-cq@3.1.6) # ak-editor-cq This component provides a packaged version of the Atlassian Editor for use in Confluence Questions. It's specific to CQ in that it: - has a schema that's compatible with Confluence's "storage format" (in shape) - provides encoding and decoding from Confluence's storage format ## Try it out Interact with a [live demo of the ak-editor-cq component with code examples](https://aui-cdn.atlassian.com/atlaskit/stories/ak-editor-cq/3.1.6/). ## Installation Install from NPM: ```sh npm install --save ak-editor-cq ``` Two flavours of JavaScript are published: - ES5 (referenced by the `main` field in `package.json`) - ES2015 (referenced by the `jsnext:main` field in `package.json`) If you're using webpack, adjust your [`resolve.packageMains`](https://webpack.github.io/docs/configuration.html#resolve-packagemains) accordingly. ## Usage The editor is built as a React component that can be used directly in a JSX file. **Example:** ```jsx import React, { Component } from 'react'; import Editor from 'ak-editor-cq'; class Page extends Component { render() { return (
); } handleSave = (editor) => { alert(`Saved with value Confluence Storage value: ${editor.value}`); } } ``` ## `Editor` API ```jsx import Editor from 'ak-editor-cq'; ``` ### Props #### `context?: 'default' | 'comment'` Adjusts the "context" of the editor. This affects the UI of the editor by making it appropriate for the given situation. #### `isExpandedByDefault?: boolean` The initial "expanded" value. When the editor is expanded it can have content added by the user. The non-expanded mode renders a small placeholder field that when focused, will switch to the expanded mode. #### `defaultValue?: string` The initial value for the editor, in Confluence Storage format. #### `onCancel?: (editor?: Editor) => void` A callback triggered when the cancel button is pressed. The cancel button is only rendered if this prop is provided. Omitting this prop can be used to hide the button. #### `onChange?: (editor?: Editor) => void` A callback triggered when a content change is made. #### `onSave?: (editor?: Editor) => void` A callback triggered when the save button is pressed. The save button is only rendered if this prop is provided. Omitting this prop can be used to hide the button. #### `placeholder?: string` A string to use in the non-expanded placeholder, e.g. `"What do you want to say?"`. ### Methods / setters / getters #### `focus(): void` Focuses the the editor. #### `clear(): void` Clears the content from the editor, returning it to an empty state. #### `isEmpty(): boolean` Returns true if the editor content is empty. #### `get value(): string | undefined` Returns the value of the editor in Confluence Storage format. This getter computes the value on request, as such only access this getter when the value is actually required. ## Support and feedback ### We're here to help! Let us know what you think of our components and docs, your feedback is really important for us. ### Community support Ask a question in our [forum](https://answers.atlassian.com/questions/ask?title=AtlasKit%3A%20&topics=atlaskit,ak-editor-cq,ak-editor-cq@3.1.6). Check [if someone has already asked the same question before](https://answers.atlassian.com/questions/topics/42926171/atlaskit). ### Create a support ticket Are you in trouble? [Let us know](https://ecosystem.atlassian.net/browse/AK)! --- _Source: https://npm.io/package/ak-editor-cq · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._