Add Nc prefix to all components

docs/index.md

@@ -15,12 +15,12 @@ npm i --save @nextcloud/vue
 
 # Usage
 ```js static
-import { AppNavigation } from '@nextcloud/vue'
+import { NcAppNavigation } from '@nextcloud/vue'
 
 export default {
  name: 'MyComponent',
  components: {
- AppNavigation
+ NcAppNavigation
  }
 }
 ```
@@ -29,7 +29,7 @@ You can also import individual module without bundling the full library.
 
 
 ```js static
-import Avatar from '@nextcloud/vue/dist/Components/Avatar'
+import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar'
 ```
 
 ## Recommendations

src/components/ActionButton/ActionButton.vue → src/components/NcActionButton/NcActionButton.vue

@@ -22,37 +22,37 @@
  -->
 
 <docs>
-This component is made to be used inside of the [Actions](#Actions) component slots.
+This component is made to be used inside of the [NcActions](#NcActions) component slots.
 
 ```vue
  <template>
  <div style="display: flex; align-items: center;">
- <Actions>
- <ActionButton @click="showMessage('Delete')">
+ <NcActions>
+ <NcActionButton @click="showMessage('Delete')">
  <template #icon>
  <Delete :size="20" />
  </template>
  Delete
- </ActionButton>
- <ActionButton :close-after-click="true" @click="showMessage('Delete and close menu')">
+ </NcActionButton>
+ <NcActionButton :close-after-click="true" @click="showMessage('Delete and close menu')">
  <template #icon>
  <Delete :size="20" />
  </template>
  Delete and close
- </ActionButton>
- <ActionButton :close-after-click="true" @click="focusInput">
+ </NcActionButton>
+ <NcActionButton :close-after-click="true" @click="focusInput">
  <template #icon>
  <Plus :size="20" />
  </template>
  Create
- </ActionButton>
- <ActionButton :disabled="true" @click="showMessage('Disabled')">
+ </NcActionButton>
+ <NcActionButton :disabled="true" @click="showMessage('Disabled')">
  <template #icon>
  <Delete :size="20" />
  </template>
  Disabled button
- </ActionButton>
- </Actions>
+ </NcActionButton>
+ </NcActions>
  <input ref="input" />
  </div>
  </template>
@@ -81,17 +81,17 @@ If you're using a long text you can specify a title
 
 ```vue
  <template>
- <Actions>
- <ActionButton icon="icon-add" @click="showMessage('Add')">
+ <NcActions>
+ <NcActionButton icon="icon-add" @click="showMessage('Add')">
  Add new
- </ActionButton>
- <ActionButton title="Long button" @click="showMessage('Delete')">
+ </NcActionButton>
+ <NcActionButton title="Long button" @click="showMessage('Delete')">
  <template #icon>
  <Delete :size="20" />
  </template>
  This button is associated with a very long text.\nAnd with new lines too.
- </ActionButton>
- </Actions>
+ </NcActionButton>
+ </NcActions>
  </template>
  <script>
  import Delete from 'vue-material-design-icons/Delete'
@@ -114,11 +114,11 @@ Action icon attribute with a single action
 
 ```vue
  <template>
- <Actions>
- <ActionButton icon="icon-add" @click="showMessage('Add')">
+ <NcActions>
+ <NcActionButton icon="icon-add" @click="showMessage('Add')">
  Add new
- </ActionButton>
- </Actions>
+ </NcActionButton>
+ </NcActions>
  </template>
  <script>
  export default {
@@ -136,20 +136,20 @@ You can also use a custom icon, for example from the vue-material-design-icons l
 
 ```vue
 <template>
- <Actions>
- <ActionButton>
+ <NcActions>
+ <NcActionButton>
  <template #icon>
  <HandBackLeft :size="20" />
  </template>
  Raise left hand
- </ActionButton>
- <ActionButton>
+ </NcActionButton>
+ <NcActionButton>
  <template #icon>
  <HandBackRight :size="20" />
  </template>
  Raise right hand
- </ActionButton>
- </Actions>
+ </NcActionButton>
+ </NcActions>
 </template>
 <script>
 import HandBackLeft from 'vue-material-design-icons/HandBackLeft'
@@ -214,7 +214,7 @@ import ActionTextMixin from '../../mixins/actionText.js'
  * Button component to be used in Actions
  */
 export default {
- name: 'ActionButton',
+ name: 'NcActionButton',
 
  mixins: [ActionTextMixin],
 

src/components/ActionCheckbox/index.js → src/components/NcActionButton/index.js

@@ -19,6 +19,6 @@
  * along with this program. If not, see <http://www.gnu.org/licenses/>.
  *
  */
-import ActionCheckbox from './ActionCheckbox.vue'
+import NcActionButton from './NcActionButton.vue'
 
-export default ActionCheckbox
+export default NcActionButton

src/components/ActionCaption/ActionCaption.vue → src/components/NcActionCaption/NcActionCaption.vue

@@ -19,13 +19,13 @@
  - along with this program. If not, see <http://www.gnu.org/licenses/>.
 -->
 <docs>
-This component is made to be used inside of the [Actions](#Actions) component slots.
+This component is made to be used inside of the [NcActions](#NcActions) component slots.
 
 ```vue
- <Actions>
- <ActionCaption title="Test caption" />
- <ActionCaption title="Test caption 2" />
- </Actions>
+ <NcActions>
+ <NcActionCaption title="Test caption" />
+ <NcActionCaption title="Test caption 2" />
+ </NcActions>
 ```
 </docs>
 
@@ -37,7 +37,7 @@ This component is made to be used inside of the [Actions](#Actions) component sl
 
 <script>
 export default {
- name: 'ActionCaption',
+ name: 'NcActionCaption',
  props: {
  /**
  * The caption's text

src/components/ActionCaption/index.js → src/components/NcActionCaption/index.js

@@ -19,6 +19,6 @@
  * along with this program. If not, see <http://www.gnu.org/licenses/>.
  *
  */
-import ActionCaption from './ActionCaption.vue'
+import NcActionCaption from './NcActionCaption.vue'
 
-export default ActionCaption
+export default NcActionCaption

src/components/ActionCheckbox/ActionCheckbox.vue → src/components/NcActionCheckbox/NcActionCheckbox.vue

@@ -22,15 +22,15 @@
  -->
 
 <docs>
-This component is made to be used inside of the [Actions](#Actions) component slots.
+This component is made to be used inside of the [NcActions](#NcActions) component slots.
 
 ```vue
- <Actions>
- <ActionCheckbox @change="alert('(un)checked !')">First choice</ActionCheckbox>
- <ActionCheckbox value="second" @change="alert('(un)checked !')">Second choice</ActionCheckbox>
- <ActionCheckbox :checked="true" @change="alert('(un)checked !')">Third choice (checked)</ActionCheckbox>
- <ActionCheckbox :disabled="true" @change="alert('(un)checked !')">Second choice (disabled)</ActionCheckbox>
- </Actions>
+ <NcActions>
+ <NcActionCheckbox @change="alert('(un)checked !')">First choice</NcActionCheckbox>
+ <NcActionCheckbox value="second" @change="alert('(un)checked !')">Second choice</NcActionCheckbox>
+ <NcActionCheckbox :checked="true" @change="alert('(un)checked !')">Third choice (checked)</NcActionCheckbox>
+ <NcActionCheckbox :disabled="true" @change="alert('(un)checked !')">Second choice (disabled)</NcActionCheckbox>
+ </NcActions>
 ```
 </docs>
 
@@ -60,7 +60,7 @@ import ActionGlobalMixin from '../../mixins/actionGlobal.js'
 import GenRandomId from '../../utils/GenRandomId.js'
 
 export default {
- name: 'ActionCheckbox',
+ name: 'NcActionCheckbox',
 
  mixins: [ActionGlobalMixin],
 

src/components/NcActionCheckbox/index.js

@@ -0,0 +1,24 @@
+/**
+ * @copyright Copyright (c) 2019 John Molakvoæ <skjnldsv@protonmail.com>
+ *
+ * @author John Molakvoæ <skjnldsv@protonmail.com>
+ *
+ * @license AGPL-3.0-or-later
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+import NcActionCheckbox from './NcActionCheckbox.vue'
+
+export default NcActionCheckbox